Hvordan bruke POSH

POSH er Plain Old semantisk HTML. Det er en bevegelse ferde for å bringe alle som skaper websider avtale om bruk av POSH for websiden produksjon. POSH er byggesteinen av gyldige, semantiske, tilgjengelig og interoperable nettsteder.

Bruksanvisning

Hva å gjøre

1 For å skrive gyldig HTML, bli venner med de verktøyene som validere sidene dine. Du kan bruke W3C Markup Validation Tilbud (Se Ressurser for en link). Det er også mange andre tilgjengelige validering verktøy, slik som de i Fil> Sjekk Side menyen i Dreamweaver, eller i Verktøy-menyen i Firefox Web Developer Toolbar.

Når du validerer en side, gå gjennom hver feil og korrigere hver og en som står i din makt å endre.

2 Ikke bruk tabeller for layout. Dette er trolig den mest grell semantisk feil du kan gjøre. Ved hjelp av en tabell for layout markerer opp innhold som tabelldata, en forvirrende semantisk mismatch som bærer gjennom i hver enhet som leser siden din. Andre enheter som kan lese siden din har mobiltelefoner og andre mobile enheter, skjermlesere, braille-lesere tekstbaserte nettlesere og søkemotorer.

3 Det er helt greit å bruke tabeller for å lage rader og kolonner du trenger for å vise tabelldata. Det er semantisk korrekt.

4 Bruk elementer og attributter for deres semantiske formål. Se punkt to for hvordan du gjør dette.

5 Bruk meningsfulle, semantisk-baserte navn for klasser og IDer. Noen av de anerkjente semantiske id navnene i bruk inkluderer header, innhold, sidebar, bunntekst og nav. Navnet er beskrivende for formålet.

6 Ikke satt noen presentasjons markup i HTML. Flytt det hele inn i CSS.

7 Hold HTML markup som mager og meningsfylt som mulig. Ikke bruk for mange klasser når en id tildelt en div, en liste eller en blockquote kan tjene det samme formålet.

Hvordan gjøre det

8

Bruk overskrifter semantisk. Overskriften elementene går fra h1 til h6. Den h1 skal være navnet området, h2 bør være på siden eller artikkel navn, og mindre overskrifter bør brukes til å betegne andre viktige blokker av innhold. Tenk tilbake til da du lærte å lage en disposisjon. Din overskrift strukturen skal lage en disposisjon (eller hierarki) av meningsfulle deler av siden.

Hvis du deaktiverer CSS presentasjon, og bare se på de grunnleggende HTML, som i bildet av Digital Web Magazine med CSS deaktivert, bør du likevel ha en meningsfull organisert sidestruktur. Dette er i stor grad basert på god bruk av overskriftselementer.

9 Lag dine tabeller (for tabelldata bare!) Tilgjengelig med riktig hjelp elementer som bildetekst og th. Videre bruker sammendrag, omfang, overskrifter og andre tabellattributter riktig (ved behov) for ytterligere å klargjøre din tabell struktur.

10 EM og sterke elementer er semantisk. De innebærer vekt eller sterk vekt. Ikke bruk dem til å lage fet eller kursiv hvis teksten ikke er ment å bli vektlagt. Hvis du ønsker å bruke fet eller kursiv tekst som presentasjon, hold deg til de gamle trofaste B og jeg elementer. Enda bedre, lage noen presentasjoner CSS-regler for å gjøre triks.

11 Bruk sitere element å identifisere sitater som bok, magasin, og filmtitler. Cite gjengir i kursiv.

12 Når du siterer noen en eller henvise til en kilde, bruker du enten q eller blockquote element. Ikke bruk en blockquote å rykke inn tekst: bruk CSS for det.

1. 3 Bruk listene riktig. Lister er spesielt nyttig for navigasjon. Hva er en meny, men en liste over linker, tross alt? Lister kan også brukes til å lage bildegallerier, dialog, oppgavelister, trinn-for-trinn-instruksjoner og all slags semantisk meningsfylt innhold. Det finnes tre typer lister: ul (sorterte liste), ol (sortert liste), og dl (definisjon liste). Det er en ressurs på slutten av artikkelen med en link til The Autistic Cuckoo som vil hjelpe deg å forstå når du skal bruke hver type liste.

Hint

• For tips om å holde markering så mager som mulig, kan du lese min artikkel om bruk kommer velgere i CSS: http://www.ehow.com/how_2084495_use-css-descendant-selectors.html
• I tillegg til den sitere element, er det også en sitere attributt. Den brukes til å gi nettadressen til en kilde. Den kan brukes sammen med en sitere element eller med et innrykket tekst element.