Inaccessibility of Visually Usable Website

Noted: Friday, July 23, 2010 at 12:50:53. Words count: 203.
Last updated: Friday, July 23, 2010 at 12:50:53.

Pleasing visually Website designs might be pleasing the eyes only. They are may be inaccessible in some point of views. Usable and accessible words always overlapping each other. Remember, the eyes is not the only one ‘client’.

Based on my browsing experience, these situations usually found on visually usable Websites:

  • No ‘Skip to main content’ menu. So, they are not truly usable for tab-bing users.
  • Lack of sufficient contrast color. Based on Web Content Accessibility Guidelines (WCAG) 2.0 – contrast ratio. Commonly, it happened on tagline, blog description, post metadata, quotation, and small texts in footer section.
  • Links are not distinct. “Underline links in the main content may arise aesthetics problem,” they said. Links are different by its color only. Their decision may become a problem for low vision and color-deficit vision users.
  • Lacks of alternative text. Problems are visible while all images turned off in Web browser’s side. No descriptive and proper alt attributes are available.
  • Abbreviation is not clear in meaning. Although not using abbr tag, at least the definiton or expanded version is described in the first of its occurences.

You may also review those condition in:

  • ‘Simple’ themes of WordPress and other CMS.
  • Blogs and Websites which have a large usability topics.
Dani Iswara, [myfirstnamelastname]

10 comments to "Inaccessibility of Visually Usable Website"

  1. Aldy

    Bli Dani,
    1) skip to main content, bersifat wajib?
    2) kontras warna, masih banyak yang membuat asal “cantik”.
    3) masih banyak, artikel terdapat warna lain dan bergaris bawah tetapi tidak bisa di klik.
    4) kalau sudah di-sable image, tidak ketahuan lagi justrungnya :(
    5) ada apa dengan abbr Bli?, selama ini selalu menggunakan abbr untuk singkatan dan acronym untuk akronim.

  2. Aldy

    typo :( abbr untuk singkatan

  3. dani

    Pak Aldy,
    tentang menu skip to main content itu:
    G1: Adding a link at the top of each page that goes directly to the main content area (WCAG 2.0).

    The objective of this technique is to provide a mechanism to bypass blocks of material that are repeated on multiple Web pages by skipping directly to the main content of the Web page. The first interactive item in the Web page is a link to the beginning of the main content. Activating the link sets focus beyond the other content to the main content. This technique is most useful when a Web page has one main content area, rather than a set of content areas that are equally important.

    Note: Visible links are necessary for those navigating with a keyboard including switch users, those using techniques that generate keyboard strokes slowly, screen magnification software users, screen reader users working with sighted colleagues, keyboard only users and those navigating using voice recognition software.

    Techniques for WCAG 2.0.

    Mengenai tag abbr, pernah kita bahas di Tag abbr Mudah Diakses. Di HTML5 (jika suatu ketika ganti doctype), tag abbr merepresentasikan abbr dan acronym:

    The abbr element represents an abbreviation or acronym, optionally with its expansion. The title attribute may be used to provide an expansion of the abbreviation. The attribute, if specified, must contain an expansion of the abbreviation, and nothing else.

    HTML5 – abbr.

  4. ardianzzz

    Skip to main conten? saya taruh absolute -1000px tersembunyi di atas jendela peramban… hehe…

  5. dani

    setelah klik menu skip itu, tombol back-nya berfungsi? :P

  6. ardianzzz

    Ah, sedikit masalah dengan jQuery :P

  7. aldy

    Bli Dani,
    Kedepan acronym dipensiunkan, cukup menggunakan abbr saja?, atau boleh mulai dari sekarang?

  8. dani

    masalah kecil, memang. Apalagi buat situ.

    Pak Aldy,
    teori semantiknya, memang tag abbr yang direkomendasikan. Tapi, apapun tag yang akan deprecated/usang, peramban Web modern akan tetap mampu membacanya. Mengenai pilihan, terserah pengelola/penyaji saja.

  9. Menyederhanakan Blog, Tak Semudah Dikira - Unessential Weblog

    […] patut disontek begitu saja? Silakan baca kembali Inaccessibility of Accessible Website & Inaccessibility of Visually Usable Website di Dani Iswara […]

  10. Tipografi untuk Aksesibilitas Web Visual - Unessential Weblog - Tidak Penting

    […] ini sempat saya singgung di tulisan Inaccessibility of Visually Usable Website (Dani Iswara .com). Beberapa tema/theme WordPress yang dinyatakan usable, tampak sederhana di sisi […]

Leave comment

All XHTML markups will be held for moderation. Keep on topic, please.