WAI 2.0

1
WAI 2.0

• Flere akronymer.

2
WCAG 2.0 Working Draft Fire prinsipper

• Content must be perceivable
• Innholdet skal presenteres slik at det kan bli
  oppfattet av alle brukere.
• Interface elements in the content must be
  operable.
• Grensesnittelementene skal kunne anvendes av alle
  brukere
• Content and controls must be understandable.
• Det skal være lett å forstå innhold og
  grensesnittelementer (controls)
• Content must be robust enough to work with
  current and future technologies.
• Innholdet skal fungere bra med dagens og
  fremtidlige teknologier.

3
Hvorfor WAI?

• Someone who cannot hear well will want a visual
  representation of information presented via
  sound.
• Someone who cannot see well will want to hear or
  feel (via braille or tactile graphics) an
  equivalent of the visual information.
• Someone who does not have the strength to move
  quickly or easily will want to use as little
  movement as possible and have as much time as
  they need when operating Web interfaces.
• Someone who does not read well may want to hear
  the information read aloud.

4
Prinsipp 1 Percievable

• All non-text content that can be expressed in
  words has a text equivalent of the function or
  information that the non-text content was
  intended to convey.
• Alternate text, labels
• Synchronized media equivalents are provided for
  time-dependent presentations.
• Alternativer til animasjoner, og lignende
• Both information/substance and structure are
  separable from presentation.
• Bruk HTML og CSS riktig.
• All characters and and words in the content can
  be unambiguously decoded.
• Angivelse av encoding.
• Structure has been made percievable through
  presentation(s), positioning and labels.
• Foreground content is easily differentiable from
  background for auditory and visual default
  presentations.
• Gode kontraster

5
Prinsipp 2. Operable

• Make all functionality operable via a keyboard or
  a keyboard interface.
• Tastaturnavigasjon accesskey, tabindex.
• Allow users to control time limits on their
  reading or interaction.
• Unngå automatisk scrolling.
• Allow users to avoid content that could cause
  photosensitive epileptic seizures.
• Unngå ltblinkgt og syke animasjoner.
• Provide mechanisms to help users find content,
  orient themselves within it, and navigate through
  it.
• Navigasjonsstruktur, labels
• Help users avoid mistakes and make it easy to
  correct them.
• Site-design og flyt. Validering av form-verdier.

6
Prinsipp 3 Understandable

• Ensure that the meaning of content can be
  determined.
• Språkangivelse, forklaringer av akronymer,
  link-titler og tekst.
• Organize content consistently from "page to page"
  and make interactive components behave in
  predictable ways.
• Konsistens i layout og navigasjonsstruktur.

7
Prinsipp 4 Robust

• Use technologies according to specification.
• Valider sidene.
• Ensure that user interfaces are accessible or
  provide an accessible alternative(s).
• The way out

8
Tips i HTML

• Bruk idattributtet sammen med div for å gruppere
  og identifisere viktige komponenter i siden
• ltdiv idheadergt
• ltul idmainMenugt
• ltligtlt/ligt
• lt/ulgt
• lt/divgt
• Bruk title-attributtet på linker.
• Bruk lang-attributtet på diverse elementer.
• Bruk label-elementer og ider i forms.
• ltpgt
• ltlabel fornamefieldgtNavnlt/labelgt
• ltinput idnameField
• typetext namename/gt
• lt/pgt
• Bruk fieldset og legend i forms til å gruppere
  kontroller.
• Bruk accesskey (også for linker) og tabindex til
  å definere tastaturnavigasjon.
• Lag god navigasjonsstruktur. Les pensumboka.

9
Ressurser

• WCAG 2.0 Working draft
• http//www.w3.org/TR/WCAG20/
• WCAG 1.0 Recommendation
• http//www.w3.org/TR/WCAG10/
• HTML-forms
• http//www.w3.org/TR/html4/interact/forms.html
• Bobby validation service
• http//bobby.watchfire.com/

10
Ukas kulturelle innslag

• Mai, mai, mai Delaila
• WAI, WAI, WAI, Delaila.
• ler litt nervøst.
• går og skammer seg.

11
Eksempel Node med egenskaper

• Vis alle egenskaper med navn for en node, med
  gjennomsnitt av stemmer (fitness).
• Hensikt med eksemplet
• Demonstrere bruk av databasen.
• Mer bruk av XQuery.
• Mer bruk av XSLT.
• Tre filer
• nodeprop.php PHP-fil som gjør utdrag fra
  databasen.
• node.xsl Stilark som transformerer resultatet
  fra nodeprop.php.
• lib.xsl Stilark som genererer generell
  sidestruktur.
• Flere måter å gjøre dette på!!