Web Page Hall of Shame
Poor vs. Better Web Page Usability

Shame Friendly
  1. Access Skills - supplants pre-configured optimal text size2 (paradox10)
  2. AFL-CIO - supplants pre-configured optimal text size2
  3. AOL - supplants pre-configured optimal text size2
  4. Apple Computer - high on imagery, low on legibility 2
  5. AT&T - arbitrary fraction of pre-configured optimal body text size
  6. Bank of America - arbitrarily smaller than pre-configured optimal body text size
  7. Barnes & Noble - supplants pre-configured optimal text size2
  8. BibleGateway.com - supplants pre-configured optimal text size2
  9. Bigcharts.com - supplants pre-configured optimal text size2
  10. CBS TV - supplants pre-configured optimal text size2
  11. Chase Bank - supplants pre-configured optimal text size2
  12. Chicago Tribune - supplants pre-configured optimal text size2
  13. City of Jacksonville - supplants pre-configured optimal text size2
  14. City of Los Angeles - supplants pre-configured optimal text size2
  15. City of New York - supplants pre-configured optimal text size2
  16. City of Tampa - supplants pre-configured optimal text size2
  17. C/Net News - supplants pre-configured optimal text size2
  18. Coca Cola - supplants pre-configured optimal text size2
  19. Creative Labs - supplants pre-configured optimal text size2
  20. Dell Computer - supplants pre-configured optimal text size2
  21. Dolphin Computer Access - arbitrary fraction of pre-configured optimal body text size
  22. Earthlink - supplants pre-configured optimal text size2
  23. eBay - supplants pre-configured optimal text size2
  24. Economist.com - arbitrary fraction of pre-configured optimal body text size
  25. ESPN - supplants pre-configured optimal text size2
  26. Federal Express - arbitrary fraction of pre-configured optimal body text size
  27. Ford Motor Company - supplants pre-configured optimal text size2
  28. Fox.com - supplants pre-configured optimal text size2
  29. Free Software Foundation - supplants pre-configured optimal text size2
  30. Gateway Computer - supplants pre-configured optimal text size2
  31. General Motors - supplants pre-configured optimal text size2
  32. Google Groups - supplants pre-configured optimal text size2
  33. Home Depot - supplants pre-configured optimal text size2
  34. HTML Center - supplants pre-configured optimal text size2; low contrast
  35. IBM - supplants pre-configured optimal text size2
  36. Infospace.com - arbitrary fraction of pre-configured optimal body text size
  37. Intel - supplants pre-configured optimal text size2
  38. Internet.com - arbitrary fraction of pre-configured optimal body text size
  39. IRS Forms & Publications - supplants pre-configured optimal text size2
  40. KDE - gray, supplants pre-configured optimal text size2,
    December 2013 contextual 144 DPI screenshot
  41. Knoppix - supplants pre-configured optimal text size2
  42. Kodak - supplants pre-configured optimal text size2, text in images
  43. Loot.com - supplants pre-configured optimal text size2
  44. Mac Life - supplants pre-configured optimal text size2
  45. MarketWatch.com - supplants pre-configured optimal text size2
  46. Mercedes Benz - arbitrary fraction of pre-configured optimal body text size
  47. Micro$oft.com - - supplants pre-configured optimal text size2
  48. Motley Fool - supplants pre-configured optimal text size2
  49. Msn.com - arbitrary fraction of pre-configured optimal body text size
  50. NASA - supplants pre-configured optimal text size2
  51. Newegg.com - arbitrary fraction of pre-configured optimal body text size
  52. NFL.com - arbitrary fraction of pre-configured optimal body text size
  53. National Organization for Women - supplants pre-configured optimal text size2
  54. National Rifle Association - supplants pre-configured optimal text size2
  55. NBC - supplants pre-configured optimal text size2
  56. Northwestern University - arbitrary fraction of pre-configured optimal body text size
  57. New York Times - supplants pre-configured optimal text size2
  58. PBS - supplants pre-configured optimal text size2
  59. Performance Technologies GroupTM - supplants pre-configured optimal text size2
  60. Register4less.com - supplants pre-configured optimal text size2
  61. Rotarynews.com - arbitrary fraction of pre-configured optimal body text size
  62. Sears - supplants pre-configured optimal text size2
  63. SES Americom - supplants pre-configured optimal text size2
  64. Sony - supplants pre-configured optimal text size2
  65. STFU, Parents - supplants pre-configured optimal text size2
  66. State & Local Government on the Net - arbitrarily smaller than pre-configured optimal body text size
  67. State of Arkansas supplants pre-configured optimal text size2
  68. State of Florida arbitrarily smaller than pre-configured optimal body text size
  69. State of Illinois - modestly smaller than pre-configured optimal body text size
  70. State of Massachusetts - supplants pre-configured optimal text size2
  71. State of Michigan - arbitrarily smaller than pre-configured optimal body text size
  72. State of Minnesota Judicial Branch - supplants pre-configured optimal text size2
  73. State of New Hampshire - supplants pre-configured optimal text size2
  74. State of New Jersey - supplants pre-configured optimal text size2
  75. State of New York - supplants pre-configured optimal text size2
  76. State of Texas - everything in Texas isn't big after all: arbitrarily smaller than pre-configured optimal body text size
  77. State of Washington - supplants pre-configured optimal text size2
  78. Sun Microsystems - supplants pre-configured optimal text size2
  79. Superpages.com - supplants pre-configured optimal text size2
  80. Symantec - supplants pre-configured optimal text size2
  81. Target.com - supplants pre-configured optimal text size2
  82. TD-Ameritrade - supplants pre-configured optimal text size2
  83. Tesco.com - supplants pre-configured optimal text size2
  84. ThisisLondon.com - arbitrarily smaller than pre-configured optimal body text size
  85. Tom's Hardware Guide - supplants pre-configured optimal text size2
  86. TV Guide - supplants pre-configured optimal text size2
  87. U S Congress - supplants pre-configured optimal text size2
  88. U S House of Representatives - supplants pre-configured optimal text size2
  89. U S Senate - supplants pre-configured optimal text size2
  90. UCLA - arbitrarily smaller than pre-configured optimal body text size
  91. UNC Highway Safefy Research Center - arbitrarily smaller than pre-configured optimal body text size
  92. UX Movement - supplants pre-configured optimal text size2
  93. Wal Mart - supplants pre-configured optimal text size2
  94. The Wall Street Journal - arbitrarily smaller than pre-configured optimal body text size
  95. Washington DC - supplants pre-configured optimal text size2
  96. Webcredible - tiny text paradox10
  97. Webdesign-L.com - supplants pre-configured optimal text size2
  98. WebMD.com - supplants pre-configured optimal text size2
  99. Die Welt.de - supplants pre-configured optimal text size2
  100. Westciv.com - low legibility text via short x-height family & low contrast
  101. Yahoo.com - supplants pre-configured optimal text size2

  1. Accessites.org4
  2. Adventist.org 
  3. Cnn.com4
  4. Cnn/Money4
  5. Gallup Strengths Center
  6. Jebsweb
  7. Smart Tech for Seniors
  8. State of Pennsylvania4
  9. Steak 'n Shake
  10. This Is Responsive
  11. WABC TV New York4
  12. Web Pages That Suck
  13. Webnauts
  14. Zeldman.com
Dishonorable Mention Tyranizing the Disadvantaged7
  1. Evangelizing Less Than All the World (more links, for a special class)
  2. Web Accessibility Initiative (WAI) home page - small body text
  3. World Wide Web Consortium, rude styling from what should be a leader in best practices
  4. World Wide Web Consortium Accessible Home Page Before and After Demonstration, comparing terrible to merely bad
  5. Accessible Internet - tiny text5
  6. Adelphia - small text5
  7. AltaVista
  8. Amazon.com - small text5
  9. City of Atlanta4
  10. City of Baltimore - small text5
  11. City of Miami - small text, low contrast5
  12. CSS Pointers Group - tiny text5
  13. Epiphany Web Browser - small text2, 5
  14. Federal Citizen Information Center - small text, text in images5
  15. First Baptist Church of Milford formerly friendly, now tiny gray text2, 5
  16. GE - small text, low contrast5
  17. Internet FAQ Archives 2, 5
  18. Medicare.gov - small text5. Three choice text sizer:
    • defaults to smallest choice
    • provides no choice equal to browser default size
    • "large" choice is marginally larger than browser default
    • no overall width added to accomodate larger selections
  19. Metropolitan Opera - text in images, links hide with zoom5
  20. MIT - small fixed size text5
  21. Mozilla - small text, low contrast5, 8
  22. NCAA - micro body text5
  23. NIHSeniorHealth.gov - tiny text5
  24. Opera Software - small text5, 8
  25. The Register - small text5
  26. Search.com - tiny text5
  27. St Louis Area Mensa - small text5
  28. State of California - tiny text5
  29. Commonwealth of Virginia - tiny text5
  30. Wired.com - tiny text5
  31. Wordpress.org - small gray text1, 2
  32. ZDNet - text in images, small text5
  1. AARP - tiny text
  2. City of Marco Island - small text, text in images
  3. City of St Petersburg - micro body text2
  4. Cynthia Says - small, or tiny, body text9
  5. Grandparents.com - plugin required, tiny text2
  6. Gray Panthers - small text, text in images
  7. National Council on Aging, tiny text2, 3
  8. Section 508 Home Page - tiny text2
  9. Senior Corps, - micro text2
  10. Seniorsafety.com, - tiny text2
  11. Silvert's, - tiny text2
  12. US Social Security - small body text, tiny link text
  13. Spinlife.com - micro body text2
  14. State of Arizona - micro body text2
  15. State of Florida - small text, text in images
  16. Usability.com - low contrast3
  17. Veterans Administration - text in images, tiny menu text
  18. Webusability.com - plugin required
Note 1 Website construction software, facilitator of disrespect by design.
Note 2 indicates text is sized either wholly or substantially using pixels and/or points. In all standards-compliant web browsers, this practice rudely disregards user-personalizable default sizes, commonly resulting in most text a fraction of legible size, and only randomly resulting in an optimal reading size.
Note 3 indicates substantial text is sized by embedding in images.
Note 4 former member of the Shame column, redesigned to make site friendlier.
Note 5 former member of the Friendly column, redesigned to make site less accessible.
Note 6 If you can't read it, nothing else matters.
Note 7 This paradoxical group consists of sites targeted directly to the physically challenged or to reducing burdens upon the physically challenged, or sites addressing usability and/or accessibility issues, or sites targeted largely or wholly to senior citizens, the group with poorest average eyesight.
Note 8 They decide what size their browsers should default to. Why don't they use it on their web sites?
Note 9 Site sets a font-family rule that makes no sense: 'Verdana, "Times New Roman", sans-serif'. Times New Roman is a sans-serif font that is significantly smaller than Verdana. This means visitors who do not have Verdana installed but do have Times New Roman or some other Times variant installed can expect to see text substantially smaller than those with Verdana installed, and with serifs instead of without. The only rational explanation for such a rule is that the site was created by non-sighted persons with no assistance from anyone with professional site design experience and normal vision. This problem is compounded by the imposition of fonts 85% of the visitor's default. This is a screenshot of the site and several others on a system without Verdana installed.
Note 10 Why don't they use what they recommend on their web site? This is how hypocrisy is defined.

Tiny? Micro? What do these mean?

Here, the pages were visited using a screen resolution of 1440 X 900 or above. Since the advent of very high resolutions and displays of 19" inches and larger, the old standards of 640 X 480 VGA and 800 X 600 SVGA have lost so much ground that fewer than 1% of users use them. Over a decade ago already, 1024 X 768 became the most common "happy" or "ideal" resolution for popular low cost flat panel displays. More recently, widescreen displays of 16:10 and 16:9 have all but eliminated standard 4:3 displays from local stores, with 1280 X 800 becoming the laptop median resolution, 1366 X 768, 1440 X 900 & 1600 X 900 duking it out for entry-level desktop dominance, and HDTV's 1920x1080 as desktop mainstream.

Next, the most web-standards-compliant browser currently available, Firefox, was used to visit each site. Firefox was used with its default (1em) font size of 16 pixels. At 1024 X 768 and 120 DPI, 16 pixels produces a default font size compatible with other apps and the OS, 10 point, which is the size recommended by usability expert Jakob Nielsen as a web page minimum.

So, what means "tiny" and "micro"? Using the above settings, "tiny" is approximately equivalent to 7 point and the CSS value "x-small". It renders at approximately .6875em, which, if CSS is enabled in your browser, looks like this: tiny. "Micro" is approximately equivalent to 6 point and the CSS value "xx-small". It renders at approximately .5825em, which, if CSS is enabled in your browser, looks like this: micro. Also if CSS is enabled in your browser, actual x-small and xx-small are: x-small and xx-small.

Some References

Linkback


Parent page
Valid HTML 4.01!
Last Modified
2020-05-20
© Felix Miata
Felix's Home