Fronteers — vakvereniging voor front-end developers

Er zijn in totaal 27 posts geplaatst onder de categorie markup. Je vindt ze hieronder.

Front-end vraagstukken: HTML e-mail

Het is alweer een tijdje geleden dat een Fronteers lid voor het laatst een front-end vraagstuk op het blog aan iedereen wilde voorleggen, maar Monique Martens heeft nu een vraag over HTML e-mail:

Webrichtlijn 84 en 85: Volgorde en groeperen van invoervelden

Gebruik het tabindex attribuut om van de standaard tab-volgorde op formuliervelden af te wijken wanneer deze volgorde niet toereikend is voor correct gebruik van het formulier door toetsenbordgebruikers. (R-pd.13.2) Breng groepering van invoervelden aan door middel van het fieldset element. (R-pd.13.3)

Webrichtlijn 57 & 58: Links en nieuwe vensters

Links op overheidswebsites dienen niet zonder waarschuwing automatisch nieuwe vensters te openen. (R-pd.8.14) Open geen automatische nieuwe vensters, behalve wanneer de locatie van de link behulpzame informatie bevat die nodig kan zijn tijdens een belangrijk, niet te onderbreken proces. (R-pd.8.15)

Webrichtlijn 55 & 56: Links voor seriële navigatie

Geef blinde bezoekers extra mogelijkheden om lange lijsten met links over te slaan. (R-pd.8.12) Geef boven aan pagina’s met veel onderwerpen een pagina-index met links om naar de verschillende onderwerpen te navigeren. (R-pd.8.13)

Webrichtlijn 54: Sneltoetskoppelingen

Ontzie het accesskey attribuut. Als toch besloten wordt dit attribuut toe te passen, gebruik het alleen op links die door de hele site onveranderd blijven (bijvoorbeeld hoofdnavigatie) en beperk de sneltoetscombinaties tot nummers. (R-pd.8.11)

Webrichtlijn 52 & 53: Tabben tussen links

Voorzie in een logische volgorde van de links op de pagina. Gebruik het tabindex attribuut om van de standaard tabvolgorde van links af te wijken wanneer deze volgorde niet toereikend is voor correct gebruik van de pagina door toetsenbordgebruikers. (R-pd.8.9) Maak het tabben naar links niet onmogelijk. Verwijder niet de focus rectangle rondom een link of de mogelijkheid tot focus op een link. (R-pd.8.10)

Webrichtlijn 42 & 43: Achtergrondafbeeldingen

Decoratieve afbeeldingen dienen zoveel mogelijk door CSS geplaatst te worden. Informatieve afbeeldingen dienen door HTML geplaatst te worden. (R-pd.7.6) Het gebruik van CSS Image Replacement technieken die worden toegepast op essentiële informatie wordt afgeraden. (R-pd.7.7)

Webrichtlijn 39: Het longdesc attribuut en d-links

Gebruik geen d-links op overheidswebsites. Het gebruik van het longdesc (long description) attribuut verdient de voorkeur wanneer de alternatieve tekst op het alt attribuut ontoereikend is voor het begrip van de informatie in de afbeelding. (R-pd.7.3)

Webrichtlijn 37, 38, 40 & 41: Het alt attribuut

Het alt (alternative) attribuut dient te worden gebruikt op ieder img (image) en area element en dient te worden voorzien van een effectieve alternatieve tekst. (R-pd.7.1) Gebruik geen alt attribuut voor het oproepen van tooltips. (R-pd.7.2) Afbeeldingen die staan geplaatst binnen een link dienen een niet-lege alternatieve tekst te hebben om bezoekers die de afbeelding niet zien in staat te stellen de link te volgen. (R-pd.7.4) Geef bij het gebruik van image maps voor zowel het img element als ieder area element een effectieve alternatieve tekst aan via het alt attribuut. (R-pd.7.5)

Webrichtlijn 36: Volgorde van belangrijkheid

Zet de inhoud van de pagina in de HTML broncode op volgorde van belangrijkheid. (R-pd.6.2)

Webrichtlijn 35: De DocType Declaratie

Elk HTML of XHTML document moet beginnen met een geldige DocType Declaratie. (R-pd.6.1)

Webrichtlijn 27: betekenisvolle namen voor id en class attributen

Geef betekenisvolle namen aan id en class attributen. (R-pd.3.15)

Webrichtlijn 25 & 26: Lijsten

Gebruik ol (ordered list) en ul (unordered list) elementen voor het aangeven van lijsten. (R-pd.3.13) Gebruik het dl (definition list), het dt (definition term) en dd (definition data) element voor het aangeven van een lijst met definities. (R-pd.3.14)

Webrichtlijn 22, 23 & 24: Referenties en citaten

Gebruik het cite element voor referenties naar personen en titels. (R-pd.3.10) Vermijd het gebruik van het q (quotation) element. (R-pd.3.11) Gebruik het blockquote element voor het aangeven van (lange) citaten. (R-pd.3.12)

Webrichtlijn 19, 20 & 21: Tekstopmaak, definities, wijzigingen, superscript en subscript

Gebruik het dfn (definition) element voor het aangeven van termen, elders gedefiniëerd in een definitielijst. (R-pd.3.7) Gebruik het ins (insertion) en del (deletion) element voor het aangeven van regelmatige wijzigingen in de inhoud van een pagina. (R-pd.3.8) Vermijd het gebruik van het sup (superscript) en sub (subscript) element waar mogelijk. (R-pd.3.9)

Webrichtlijn 18: Tekstopmaak, afkortingen

Gebruik het abbr (abbreviation) element voor afkortingen indien er onduidelijkheid zou kunnen ontstaan over de betekenis ervan, de afkorting een zeer belangrijke rol speelt in de tekst of wanneer de afkorting niet voorkomt in het Nederlands woordenboek. (R-pd.3.6)

Webrichtlijn 17: Tekstopmaak, het aangeven van nadruk

Gebruik het em (emphasis) en strong element voor het aangeven van nadruk. (R-pd.3.5)

Webrichtlijn 16: Paragrafen, nieuwe regels en alinea’s

Gebruik het p (paragraph) element voor het aangeven van paragrafen. Gebruik niet het br (linebreak) element voor het scheiden van paragrafen. (R-pd.3.4)

Webrichtlijn 13, 14 & 15: Beschrijvende markup, kopregels

Schrijf zowel grammaticaal correcte, als beschrijvende markup. (R-pd.3.1) Gebruik markup voor kopregels die de hiërarchie van de informatie op de pagina uitdrukken. (R-pd.3.2) Sla in de markup geen niveaus in de hiërarchie van kopregels over. (R-pd.3.3)

Webrichtlijn 7 & 8: Gebruik de Strict variant voor nieuwe websites, en ontwijk de Frameset variant

Bij de bouw van een nieuwe website: gebruik van HTML 4.01 of XHTML 1.0 de Strict variant. (R-pd.2.4) Gebruik geen frames op overheidswebsites. Gebruik daarom ook niet van HTML 4.01 of XHTML 1.0 de Frameset variant. (R-pd.2.5)

Webrichtlijn 6: Gebruik bij voorkeur alleen de Strict variant (R-pd.2.3)

Bij het aanpassen van een bestaande website: gebruik van HTML 4.01 of XHTML 1.0 alleen de Transitional variant als het gebruik van de Strict variant onmogelijk of onwenselijk is. (R-pd.2.3)

Webrichtlijn 5: Gebruik geen deprecated markup (R-pd.2.2)

Gebruik geen markup die in de W3C specificaties staat aangemerkt als deprecated (achterhaald). (R-pd.2.2)

Webrichtlijn 4: Gebruik HTML 4.01 of XHTML 1.0 (R-pd.2.1)

Gebruik HTML 4.01 of XHTML 1.0 volgens de W3C specificaties voor de markup van overheidswebsites. (R-pd.2.1)

Webrichtlijn 3: Niet rekenen op optionele technologie (R-pd.1.3)

Maak de functie van de website niet afhankelijk van optionele technologie, zoals CSS en client-side script: optionele technologie dient de informatie op de site en het gebruik ervan te complementeren en niet de toegang ertoe te belemmeren wanneer deze technologie niet ondersteund wordt. (R-pd.1.3)

Webrichtlijn 2: Gelaagd bouwen (R-pd.1.2)

Deze week de tweede richtlijn: Bouw websites volgens het principe van gelaagd bouwen. (R-pd.1.2)

Webrichtlijn 1: Scheiding tussen structuur en vormgeving (R-pd.1.1)

Het leek ons leuk (Gelukkig nieuwjaar overigens!) om een discussie aan te zwengelen over de webrichtlijnen van de overheid. Niet in het wilde weg: wat vind je nou van die richtlijnen, maar juist per richtlijn: hoe waardevol, correct, belangrijk is hij? 125 richtlijnen, iedere week 1. Zo zijn we wel even bezig! :P Deze week de eerste richtlijn: Houd structuur en vormgeving zoveel mogelijk gescheiden: gebruik HTML of XHTML voor de structuur van de site en CSS voor de vormgeving ervan. (R-pd.1.1)

RSS beschikbaar

Op veler verzoek heeft Krijn gisteren de RSS-feed van het blog geactiveerd, dus hang hem gauw in je favoriete reader! Een feed van aankomende bijeenkomsten is in de maak.