1. Dec 04

    Anbefalt lesing: What are web standards and why should I use them?

    Generelt 0 kommentarer »

    Det har vært lite aktivitet fra meg de siste ukene. Jeg har vært utslitt og har hatt vondt i alle muskler. Russetiden går hardt utover helsen. Men nå er den tiden forbi, og er kun et minne til fremtiden. Nå har jeg bedre tid igjen, til å skrive mer på denne siden, og prøve å gjeneurobre lesere, som sikkert har synket så drastisk at jeg ikke en gang tør å tenke på det. Men det er vel slik som skjer, når russetiden kommer. Prioriteringslisten endrer seg.

    Som første post, etter pausen min, vil jeg anbefale noe lesestoff for de som er i tvil om hva webstandarder er, og hvorfor det er så sabla viktig. Denne lenken fører deg videre til Webstandards.org, som ofte kommer med gode poster til de som engasjerer seg for semantikk og webstandarder. Noen poster kan man kanskje styre unna, da de blir litt for tekniske for de fleste.

    Men dette er altså en artikkel jeg anbefaler alle som driver med nettutvikling å lese: What are web standards and why should I use them?

    \\ emneord: , , ,

  2. Dec 04

    4 semantiske tips

    Markup 0 kommentarer »

    Her kommer en kjapp liste over 4 semantiske tips som du kan fundere litt over og kanskje vurdere å bruke i dine sider, for å maksimere tilgjengeligheten. Dette er kanskje litt inspirert av Photoshop TVs “One for the Road”, der de gir tips på slutten av programmet som seerne burde sjekke ut.

    1. Definer sidespråk til eksterne lenker. Dette gjøres via attributten til a, som heter hreflang. Der definerer du språket til siden du lenker til ved å gjøre f.eks: <a href="http://site.no" title="Sidetittel" hreflang="no">Side</a>.
    2. Definer språk i paragrafene dine. Også slik at brukeren skal få informasjon om hvilket språk dette står på. Dette gjøres med attributten lang, og du kan blant annet bruke den på paragraf-elementet. Eksempel: lang="no".
    3. Bruk rel til å definere hva en link er. Om du lenker mellom sidene dine i en hel nettside kan du bruke rel til å si til nettleseren hva denne siden er for deg. Det er et nøkkelord, som kan gruppere forskjellige linker og si hva som hører sammen. Har du f.eks en “kontakt meg”-side kan du bruke rel="contact".
    4. Bruk rev til å definere hva lenkesiden er i forhold til nåværende side. Det vil si det motsatte av rel, og om du da er inne på “Kontakt meg” siden, og linker tilbake til fremsiden, kan du bruke rev="contact" for å vise at du er inne på kontaktsiden til hovedsiden din.

    Det var 4 kjappe (kanskje litt vell kjappe) tips, til hvordan du kan forbedre tilgjengeligheten/semantikken i dine sider!

    \\ emneord: , ,

  3. Dec 04

    Link-tag med rel attributten

    Markup 0 kommentarer »

    Forord

    Tenkte jeg skulle gi en liten innføring i hvordan man bruker link-taggen til flere ting enn å koble til en ekstern CSS fil. Jeg tror det er stor manglene kunnskap på bruk av link-taggen ute på nettet. Det lønner seg å legge til flere link-tagger med forskjellig informasjon for bedre brukervennlighet på siden din. Nå skal jeg forklare litt hva link gjør, gi noen eksempler og snakke litt rundt den.

    Hva gjør den?

    Så hva gjør denne link-taggen? Jo, den definerer rett og slett forhold mellom to forskjellige dokument. Det er nemlig derfor link brukes når du skal koble til en ekstern CSS fil. Når man gjør dette har man verdien “stylesheet” i attributten rel. Men, som jeg har sagt tidligere kan manbruke link til mye annet. Blant annet navigering mellom sider. Om du bruker Opera har du kanskje sett en tool-bar som har linker som: Next, Up, Home osv. Disse knappene fungerer ikke på de fleste sidene, men definerer du hva de gjør i link-tag, vil de fungere. Du vil altså øke brukervennligheten på siden din. Så hva kan du gjøre? Se nedenfor for hvilke verdier du kan i ha rel attributten.

    Mulige verdier

    • alternate
    • appendix
    • bookmark
    • chapter
    • contents
    • copyright
    • glossary
    • help
    • home
    • index
    • next
    • prev
    • section
    • start
    • stylesheet
    • subsection

    Disse verdiene beskriver kanskje seg selv. Du har index, home, help, next, prev, copyright som kanskje er mest relevant/viktigst – om du ser bort i fra stylesheet ja.

    Eksempler

    Så hvordan bruker vi dette?

    Under head legger du inn dette.
    <link title="Startsiden" rel="index" />
    <link title="Hjelpesiden" rel="help" />
    <link title="Neste artikkel" rel="next" />
    <link title="Forrige artikkel" rel="prev" />

    Tilleggsinformasjon

    Disse attributtene kan brukes på link i xhtml strict: charset, href, hreflang, rel, rev, media, type. I tillegg til disse har vi de vanlige attributtene som id, name, title, lang, xml:lang osv. Du kan også bruke ekstra attributtene som onclick, ondblclick, onmousedown osv med JS.

    \\ emneord: ,

Andre bloggere: