Special Text on SEO, Semantic, and Usability-Accessibility

May 19, 2009 – 03:28 by Dani Iswara. Words count: 177.
Last updated: Sunday, August 9, 2009 at 3:53.

Special texts formatting helps readers/visitors to scan web content (usability). Many onpage search engine optimization (SEO) practice have visual-effect only. Especially for the specific words/special texts as known as keywords[?]. Look inside the markup codes. It often use inline Cascading Style Sheet (CSS).

See the different in Table 1 below:

Table 1. Special text based on Visual-effect only, Semantic, and Usability-Accessibility Perspectives
Visual-effect only Semantic, Usability-Accessibility

visually–looks different, full color, underlined, bigger, smaller, e.g:

  • <b>
  • <i>
  • <u>
  • <strike>
  • <span style="color:red">
  • <span style="font-size:16px">
  • <small>
  • <a href="..." title="[redundancy of anchor text]″>
  • <img src="..." alt="..." title="..." width="..." height="..." />

codes have a meaning, easy to use, and understandable (especially by screen reader users), e.g:

  • <strong>
  • <em>
  • underlined words should be links
  • <del>
  • <span class="red alert warning error"> (CSS based)
  • using plain text or aria="required" to say some alerts/warning/errors
  • <h1> – <h6>
  • <span class="smalltext date-time"> (CSS based)
  • use relative font sizes (em, %, x-small, etc.)
  • <a href="..." title="[only additional information]″>, usually not needed (read on unessential title attribute; bahasa Indonesia)
  • image tag must have alt attribute (see on text alternative for alt attribute; bahasa Indonesia)

You may choose the best option. :)

Just unessential weblog
Dani Iswara, mail me: [myfirstnamelastname]@gmail.com or use contact form.

Posted in category: SEO Tips, Semantic Markups, Web Accessibility, Web Usability
Tags: , , ,
6 Comments/Trackbacks (Comment closed)

You are free to share (copy, distribute, transmit) & adapt this blog post under the similar license (Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported; CCA-NC-SA 3.0 Unported). Please put these links on your copy:
Taken from: Special Text on SEO, Semantic, and Usability-Accessibility by Dani Iswara.

Unimportant Related/Random Posts

You may also read list of most popular posts and most popular tags of Dani Iswara .Net.

6 Responses to post titled: Special Text on SEO, Semantic, and Usability-Accessibility

  1. Comment by nomercy on June 5, 2009 at 05:27:09
    using Mozilla Firefox 3.0.10 on Linux Mint 7

    nah ini yang masih sering terlupakan mas … untuk font itu sebaiknya pakai em atau px mas? saya juga sering pakai % …

  2. Comment by Dani Iswara on June 5, 2009 at 07:57:13
    using Mozilla Firefox 3.0.10 on Gentoo Linux

    karena kecanggihan peramban yang bisa zoom text only dan pelbagai fitur aksesibilitas lainnya, mungkin ngga terlalu penting lagi ukuran relatifnya nanti. :)

  3. Comment by ganda on November 17, 2009 at 16:56:59
    using Mozilla Firefox 3.5.5 on Windows XP

    maksudnya ukuran relatif dengan absolute ya? sampai saat ini, saya masih menggunakan kombinasi keduanya. :D

  4. Comment by ganda on November 17, 2009 at 16:58:30
    using Mozilla Firefox 3.5.5 on Windows XP

    intinya, HTML is for the content, CSS is for presentation. :D This is the best option for me. :D

  5. Comment by Dani Iswara on November 20, 2009 at 08:11:49
    using Mozilla Firefox 3.5.5 on openSUSE Linux

    ganda,
    ya, nantinya desainer Web mungkin cukup mengedukasi pengguna untuk memanfaatkan kecanggihan peramban, dibanding merombak situs lama yang tidak dibangun dengan standar Web.

  6. Comment by Dani Iswara on November 20, 2009 at 08:13:44
    using Mozilla Firefox 3.5.5 on openSUSE Linux

    ganda,
    or just disable the CSS on user’s side. :)

Sorry, for some reasons (sometimes due to sp*ms attack), the comment form is closed at this time. If You have any suggestions, please contact me. Thank you.

Dani Iswara .Net

Return to TOP
›› Older entries: Secure Medical Data Hacked
‹‹ Newer entries: Manual Accessibility Evaluation – Table and Checklist