homepage Welcome to WebmasterWorld Guest from 54.161.185.244
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Pubcon Platinum Sponsor 2014
Home / Forums Index / WebmasterWorld / Accessibility and Usability
Forum Library, Charter, Moderators: ergophobe

Accessibility and Usability Forum

    
What exactly are Accessibility and Usability?
Primer on forum topic
DrDoc

WebmasterWorld Senior Member drdoc us a WebmasterWorld Top Contributor of All Time 10+ Year Member



 
Msg#: 3 posted 12:25 am on Feb 17, 2006 (gmt 0)

A brief history.

May 5th, 1999, marked an important milestone in Internet history. This was the day when the World Wide Web Consortium (W3C) [w3.org] presented the first official Web Content Accessibility Guidelines (WCAG) [w3.org] recommendation. Although this new Web Accessibility Initiative (WAI) [w3.org] did not spread like a wildfire, it kindled a flame which has only grown stronger since. Today, 2006, Accessibility and Usability is on everyone's lips.

Certainly, February 16th, 2006, marked another important milestone by the founding of this Accessibility and Usability forum! The topic has been discussed many times [google.com] here on WebmasterWorld. Accordingly, today marked the day when an entire forum is dedicated to such an important topic as accessibility and usability.

Although accessibility and usability can be seen as two very different things, they successfully go hand in hand. The two approach the issue of making a website as successful as possible, but from two different points of view.


The tides are turning.

For years, accessibility and usability have been considered optional improvements. Not anymore. Many countries across the globe are passing laws necessitating a global change in how we view accessibility and usability. Companies and websites have faced legal penalties for not making their sites accessible. The legal requirements in certain countries, or for certain types of websites, obligate many of us to not only be aware of accessibility and usability guidelines, but to actively pursue and conform to them.

We can no longer afford not to at least educate ourselves about what accessibility and usability means.


Before you read any further...

Allow me to get one common misunderstanding out of the way right off the bat: accessibility and usability applies to all websites. You cannot say that a certain type of site is excluded from being concerned about these matters.

Also, accessibility and usability is more about determination and conscious effort than it is about money. It does not have to cost a lot of money. By properly educating yourself on what accessibility and usability entails you can easily build a truly accessible and usable site without spending much (if any) more time and money!

I have witnessed examples, first hand, where both time and money has been saved by being concerned about accessibility and usability matters. I have witnessed how it has simplified addition of new content, simplified redesign, and generated more sales.

If it seems overwhelming at first, there are a few very simple changes you can make to your site which will make the difference between being 100% accessible and being the target of a lawsuit [webmasterworld.com] (pun intended).


Accessibility.

Accessibility deals with ensuring that everyone can access your website, regardless of browser used or whether living with certain impairments or disabilities. To cite the W3C: "Web accessibility means that people with disabilities can perceive, understand, navigate, and interact with the Web, and that they can contribute to the Web, ... [whether suffering from] visual, auditory, physical, speech, cognitive, [or] neurological disabilities. ... Web accessibility also benefits people without disabilities. ... A key principle of Web accessibility is designing Web sites and software that are flexible to meet different user needs, preferences, and situations ... such as people using a slow Internet connection, people with 'temporary disabilities' such as a broken arm, and people with changing abilities due to aging."

Needless to say, accessibility is much more than caring for people with disabilities. It is about lowering the barriers for everyone accessing the Internet, about caring for people's needs and preferences, along with writing the best possible content.

Visual.

When making a site accessible to users with visual impairments we are dealing with a wide spectrum of visual impairments: blindness, vision affected by age, color blindness, blurred vision, etc. The Web Content Accessibility Guidelines (WCAG) help you to identify what visual impairments and disabilities are, and how they affect the content on your website. You will become aware of how different colors and combinations thereof can be used to provide greatest possible contrast and visibility.

Are you using images to convey information? Is the same information available to those who surf with images turned off? Do you provide descriptive information about your images to assist users (and search engines) to find what they are looking for?

Learn the difference between the various HTML elements and how each affects accessibility for visually impaired visitors. Learn how to make your content stand out and be readable by everyone. You may have the best content on your website and the niftiest products to sell, but if a legally blind person cannot access your site, or if someone with color blindness cannot find the "Buy Now" button on your site -- it doesn't matter -- they will go elsewhere.

Auditory.

Are you using sound to convey information? Ensure that the same information is available in a textual format. Not only will this allow access to your quality content for those who suffer from auditory impairments; it will also allow those with broken (or turned off) speakers another means of accessing the information.

Another benefit from providing audio/visual content in a textual format is that it can now be spidered and indexed by search engines. It can be printed by your visitors.

Physical.

Physical impairment can make it difficult for a visitor to access and navigate your site. Arthritis, a broken arm, decreased mobility; all affect a visitor's capability of clicking the right link, selecting the desired check box. Try surfing your site using your off hand (or nothing but a keyboard) and you will quickly discover what I'm talking about.

Cognitive.

Is your content written with your target audience in mind? Do not use words like vehement when words like forceful or full of energy will convey the same meaning. If technical terms must be used, ensure that glossaries or explanations are readily available.

Visitors don't like reading a lot of text. They skim. Don't turn your content into an academic and cognitive stumbling block. Short sentences. Simple explanations. Avoid slang.

Summary.

While accessibility is typically directly associated with disabilities there is so much more to consider. Accessibility means not turning anyone away, regardless of browser, internet connection speed, education, disabilities, personal preferences. So what if your visitor prefers large text and you think it will look ugly. It is their choice! So what if your buyer is using a pointer wand to make a purchase? Are you going to turn them and their money down based on a disability?

Accessibility is about empowering your visitors!


Usability

As you can see, the step over to usability is quite natural. Usability takes over where accessibility ends. If accessibility is about enabling access to your site for everyone, usability is ensuring that everyone can navigate the site in an intuitive way. Usability is about making your quality content easy to find, about ease and flexibility of navigation, about simplicity and logic.

Whether consciously or not, we have all learned valuable lessons from from years of study and research by usability guru Jakob Nielsen [useit.com]: 1) web users want to find what they're after quickly, and 2) if they don't know what they're after, they nevertheless want to browse quickly and access information they come across in a logical manner.

Usability is the answer to how you can please your users and live up to the demands of an everchanging web. Internet is no longer just about having the information people are looking for. It's about providing the easiest way of finding that information.

The same methods used to making your website accessible can typically be directly employed in making your site usable. Try navigating your site using your off hand again. Navigate your website using nothing but a keyboard. Give someone (not tech savvy) who is unfamiliar with your website the task of finding something in particular. Watch their behavior. Listen to their feedback on what worked and what did not. Then do that a thousand times more! ...or, go read some of Jakob Nielsen's articles.

If you have excellent content and quality products to sell, but not an easy way for your visitors to navigate your site or find what they are looking for, do not think they will go through the trouble of figuring out "how your site works".

I have witnessed countless examples of companies losing significant numbers of sales due to lacking usability. Sometimes even the smallest changes have made a great impact.

Simplify and enhance their experience!


Summary

Accessibility and Usability are two topics not to be ignored or taken lightly. Legislation and the steady increase in public demand for a better web is, luckily, going to impact how we view marketing, site design, and ecommerce -- forever.

Let's share each other's experiences in the quest for an accessible and usable web. Let's learn and grow together. In the end, it will benefit both us and our visitors.

 

BeeDeeDubbleU

WebmasterWorld Senior Member beedeedubbleu us a WebmasterWorld Top Contributor of All Time 10+ Year Member



 
Msg#: 3 posted 12:55 pm on Feb 17, 2006 (gmt 0)

An excellent post Dr. Doc. Well done!

BeeDeeDubbleU

WebmasterWorld Senior Member beedeedubbleu us a WebmasterWorld Top Contributor of All Time 10+ Year Member



 
Msg#: 3 posted 12:59 pm on Feb 17, 2006 (gmt 0)

Are there any sites where the legislation is detailed in understandable language?

Added: forget this. I see that they have been added to the charter, [webmasterworld.com...]

Chris_D

WebmasterWorld Senior Member 10+ Year Member



 
Msg#: 3 posted 1:40 pm on Feb 17, 2006 (gmt 0)

Are there any sites where the legislation is detailed in understandable language

Try the checklists at w3c [w3.org...]

ronin

WebmasterWorld Senior Member 10+ Year Member



 
Msg#: 3 posted 2:36 pm on Feb 17, 2006 (gmt 0)

An awesome introduction to a very important and much under-discussed topic.

The only point I would slightly quibble with is:

Visitors don't like reading a lot of text.

It really depends on who your visitors are. Some visitors like reading a lot of text. (Otherwise online newspapers would have fallen flat a long time ago, right?)

Perhaps the best compromise is to find some way to offer different visitors text-heavy and text-lite versions of the same content. Two columns would handle this kind of situation in a very simple way - with a picture and large font bullet point summary on one side and detailed paragraphs on the other.

BeeDeeDubbleU

WebmasterWorld Senior Member beedeedubbleu us a WebmasterWorld Top Contributor of All Time 10+ Year Member



 
Msg#: 3 posted 2:58 pm on Feb 17, 2006 (gmt 0)

Try the checklists at w3c [w3.org...]

I just did. Do you think the table there conforms? Centred text on a table this size? ;)

Beagle

WebmasterWorld Senior Member 5+ Year Member



 
Msg#: 3 posted 4:26 pm on Feb 17, 2006 (gmt 0)

Great idea for a new forum. Not that I'll be contributing much, if anything, but I hope to learn a lot!

Centred text on a table this size? ;)

So, my first lesson? That's just for [guidelines], right? Even that much is a bad thing?

[edited by: Beagle at 4:36 pm (utc) on Feb. 17, 2006]

Hach3

5+ Year Member



 
Msg#: 3 posted 4:36 pm on Feb 17, 2006 (gmt 0)

Here is a former thread with some good tips and insight on visual accessability.

[webmasterworld.com...]

Jon_King

WebmasterWorld Senior Member 10+ Year Member



 
Msg#: 3 posted 4:47 pm on Feb 17, 2006 (gmt 0)

Daunting, very daunting - what a check list.

I often have pages with 50 elements. Can you imagine the code and labor to accomplish this on just one page, never mind that I have 1000's of pages.

If compliance becomes strongly enforced, I would have to rethink architecture on future sites. I don't think how I build them now - would work. I'd have to change a large part of the development process, man what a bummer. I can see twice the labor hours for every page, how can this possibly work? How about doubling server usage with these larger pages, whats that gonna cost?

Don't get me wrong, I want to help Accessability but this is asking a lot. I think a scalable automated method is needed before widespread compliance happens. IMHO

DrDoc

WebmasterWorld Senior Member drdoc us a WebmasterWorld Top Contributor of All Time 10+ Year Member



 
Msg#: 3 posted 5:02 pm on Feb 17, 2006 (gmt 0)

The checklist may appear daunting ... But is it really that difficult to start using
alt attributes on applicable elements? ... or to use <noscript> elements, or textual descriptions of audio/visual content?

Priority 1 should not be a huge obstacle for most sites.

LifeinAsia

WebmasterWorld Administrator lifeinasia us a WebmasterWorld Top Contributor of All Time 5+ Year Member



 
Msg#: 3 posted 5:09 pm on Feb 17, 2006 (gmt 0)

But is it really that difficult to start using alt attributes on applicable elements?

I think the resistance has not been about going forward, but about going back and being "required" to add ALT="place holder graphic" to thousands of 1x1 pixel graphics. Or adding an ALT tag to thousands of pictures in an online photo album.

DrDoc

WebmasterWorld Senior Member drdoc us a WebmasterWorld Top Contributor of All Time 10+ Year Member



 
Msg#: 3 posted 5:10 pm on Feb 17, 2006 (gmt 0)

1x1 pixel

Assuming spacer gifs are used (yuck).
Do people still use those, by the way?

And, for place holder graphics like that -- I would not worry about alt text on them [webmasterworld.com].
Only for images that actually mean something, that have contents.

pageoneresults

WebmasterWorld Senior Member pageoneresults us a WebmasterWorld Top Contributor of All Time 10+ Year Member



 
Msg#: 3 posted 5:30 pm on Feb 17, 2006 (gmt 0)

I would not worry about alt text on them.

<img src="/images/file.gif" height="1" width="1" alt="">

For spacer gifs, empty alt attributes would be required to pass validation. An empty alt attribute consists of two quote marks (side by side with no space inbetween them).

DrDoc

WebmasterWorld Senior Member drdoc us a WebmasterWorld Top Contributor of All Time 10+ Year Member



 
Msg#: 3 posted 5:31 pm on Feb 17, 2006 (gmt 0)

That's what I meant, pageone ;)

pageoneresults

WebmasterWorld Senior Member pageoneresults us a WebmasterWorld Top Contributor of All Time 10+ Year Member



 
Msg#: 3 posted 5:49 pm on Feb 17, 2006 (gmt 0)

Oh, I knew that, I just wanted to provide a working example. ;)

By default, Lynx displays the filename of any image that does not contain an alt attribute. Many popular weblog templates include several spacer images even before the site name. You don't notice them in your visual browser, of course, but this is what Lynx sees:

[shim.gif] [shim.gif]
[shim.gif]
[shim.gif]
Welcome To My Web Site
[ciblueHeader2.gif]
[ciblueCurve2.gif]

By default, JAWS reads the filename of any image that does not contain an alt attribute. Imagine how frustrating it is to hear this:

graphic shim dot gif graphic shim dot gif graphic shim dot gif graphic shim dot gif
welcome to my web site graphic ciblue header two dot gif graphic ciblue curve two
dot gif

If you introduced yourself like that in real life, nobody would talk to you.


encyclo

WebmasterWorld Senior Member encyclo us a WebmasterWorld Top Contributor of All Time 10+ Year Member



 
Msg#: 3 posted 6:55 pm on Feb 17, 2006 (gmt 0)

Centred text on a table this size? ;)

You might want to pick out this as a usability issue as it is less than ideal for readability. But taking into account the age of the page (the file dates from 1998/1999) the reason why the text is centered is that modern browsers are behaving differently than when the page was authored, when quirks mode (the only rendering mode in those days) left-aligned the text. Dig out your copy of Netscape 4 and you'll see. :)

However, check out some the markup for that table:

<H2>Priority 1 checkpoints</H2>
<DIV class="table">
<TABLE [b]summary="Table of priority 1 checkpoints, organized by category and sorted by checkpoint number."[/b] border>
<TR class="checkhead"><TH>In General (Priority 1)
[b]<TH>[/b]Yes<TH>No<TH>N/A</TR>
<TR class="checkinfo">

<TD><A href="wai-pageauth.html#tech-text-equivalent">1.1</A>&nbsp;Provide a text equivalent for every non-text element (e.g., via "alt", "longdesc", or in element content). <em>This includes</em>: images, graphical representations of text (including symbols), image map regions, animations (e.g., animated GIFs), applets and programmatic objects, [b]<abbr title="American Standard Code for Information Interchange">ascii</abbr>[/b] art, frames, scripts, images used as list bullets, spacers, graphical buttons, sounds (played with or without user interaction), stand-alone audio files, audio tracks of video, and video.

The bold parts show some specific ways of increasing the accessibility of the page: a summary attribute which describes the contents of the table, the use of th instead of td for headings, and the use of semantic markup such as abbr with an appropriate title for the abbreviation.

Matt Probert

WebmasterWorld Senior Member 10+ Year Member



 
Msg#: 3 posted 7:52 pm on Feb 17, 2006 (gmt 0)

I am, and always have been, an advocate of accessibility.

One point I should like to make about "pictures". There is a view among many sited people that they must put in descriptive alt text, eg: "alt="photo of me and the wife outside our cabin on Mount Rushmoor", when in reality many blind users don't want nor need to know about those pictures - they are purely decorative - and as such an empty string alt="" can be better.

Please note the distinction between decorative and functional images. I should advise against using images for functionality (eg: don't use a "click here" picture, use text instead).

Matt

pageoneresults

WebmasterWorld Senior Member pageoneresults us a WebmasterWorld Top Contributor of All Time 10+ Year Member



 
Msg#: 3 posted 8:01 pm on Feb 17, 2006 (gmt 0)

One point I should like to make about "pictures". There is a view among many sited people that they must put in descriptive alt text, eg: "alt="photo of me and the wife outside our cabin on Mount Rushmoor", when in reality many blind users don't want nor need to know about those pictures - they are purely decorative - and as such an empty string alt="" can be better.

Matt, I think in the above scenario, the guidelines are going to disagree with you. Why? Well, the guidelines do state that if the image requires a text equivalent, which this one does, the alt attribute needs to be populated with the appropriate text. Leaving it blank goes against the guidelines. Also, that image, when processed by someone using assistive technologies, may help them to solidify the page. I'm going to assume that the surrounding text is discussing a vacation to Mount Rushmoor. Describing the picture to those listening is good practice and is suggested.

There are definitely decorative and functional images. For example, a decorative image might be a round bullet used adjacent to a link. Not a best practice, but a good example of where an empty alt attribute would be required.

OldWolf

5+ Year Member



 
Msg#: 3 posted 11:58 pm on Feb 17, 2006 (gmt 0)

DrDoc

I ve learnt something new today

Thank you for your time

old_expat

WebmasterWorld Senior Member 10+ Year Member



 
Msg#: 3 posted 2:42 am on Feb 18, 2006 (gmt 0)

Not meaning to sound too negative .. but ..

I believe folks like me would take this issue more seriously if those who are perched on their accessibility soapboxes .. when informed that "Buy" buttons on their own websites had no alt text .. would reply other than ..

[paraphrased]"I can't do anything about that."

NOTE: The website referred to in this post is NOT that of DrDoc.

DrDoc

WebmasterWorld Senior Member drdoc us a WebmasterWorld Top Contributor of All Time 10+ Year Member



 
Msg#: 3 posted 3:40 am on Feb 18, 2006 (gmt 0)

While I understand your feelings, old_expat, there are unfortunately times when hosted/leased ecommerce solutions cannot be touched (either because of licensing issues or limited to no access to the code).

Like I mentioned earlier in this thread -- there are definitely time and money savings to be had. You can expect some of those topics to pop up (along with raw data showing exactly what kind of savings/sales increase we are talking) in the near future. Just working out a few details :)

bedlam

WebmasterWorld Senior Member 10+ Year Member



 
Msg#: 3 posted 5:55 am on Feb 18, 2006 (gmt 0)

Please note the distinction between decorative and functional images.

This leads me to suggest something I haven't seen mentioned in any of the recent accessibility threads: remove decorative images.

"But wait!" I hear from the audience, "those images are part of the corporate identity, crucial to our all-important branding, part of the site's design."

Well then, what the heck are they doing in the markup?! Write this down on a postit and stick it to your monitor:

If the image isn't about the content and the content isn't about the image, then the image shouldn't be there!

There is another option that the use of the word "design" should have caused you to think of--and really, this has been a realistic if not universally available option since the release of IE5, lo those many years ago--that alternative option is CSS [w3.org].

Most if not all of this decorative cruft that you find in the markup (i.e. in the html code) of web pages can be removed--at the design stage--to external stylesheets. This includes rounded corners, list-item bullets, logos and graphical headlines (via fir [google.com]) and non-content images such as the ever popular 'happy suit person,' 'fluffy corporate cloud' and 'girl with headset' genres.

Removing these images to stylesheets has a couple of obvious advantages:

  • you don't even have to worry about alt attributes for them,
  • with every non-content image that you remove, your html document will look more and more like what it fundamentally is--a text document--to people accessing it with screenreaders or other non-graphical useragents
  • your pages will immediately print better
  • significant modifications (and in some cases [csszengarden.com] complete redesigns) to page and site designs can be made by editing one file

If you think this sounds like a plug for css you're right. It is. If you think it seems out of place in the accessibility forum, you're wrong. It's not. Proper separation of content from design is essential to the creation of accessible pages.

In the recent Target accessibility thread, people were, to my amazement, discussing making complete duplicate 'shadow sites' for accessibility purposes. But, provided the content is logically structured and soundly marked-up, if the design elements of a site are added via css, then the pages will be well on their way to being accessible documents with little or no extra work required.

Unfortunately, given that many pages out there are built of sliced up images, it's not necessarily going to be practical to retrofit an existing site to use all css background images for non-content images, but there is absolutely no reason for any new site ever to use a spacer gif again.

-b

wolfadeus

WebmasterWorld Senior Member 5+ Year Member



 
Msg#: 3 posted 10:39 am on Feb 18, 2006 (gmt 0)

Bedlam, I am using images generally related to the topic as a help to structure the text and make it look nicer - for example, as it's a tourism site, photographs of the place as closely related as possible.

The text is grouped into paragraph-clusters of three, divided by h2-lines of text and the central paragraph has a little picture in it. That makes the text come in little pieces, but the pictures are not crucial and don't have alt text nor do they provide really important information - they are decoration.

I think that's all right in terms of both, pleasing the healthy user and still not constraining disabled users from accessing key information - what do you think?

Matt Probert

WebmasterWorld Senior Member 10+ Year Member



 
Msg#: 3 posted 10:51 am on Feb 18, 2006 (gmt 0)

This leads me to suggest something I haven't seen mentioned in any of the recent accessibility threads: remove decorative images.

Might I disagree? I do hope so <g>

There is a danger of accessibility, like all "political correctness", of dragging everybody down to a lowest common denominator. This is of course discrimination against those who are not disabled.

Decorative images can enhance the experience for those that can see, perceive and understand them, and as such are valuable. We should not ban galleries of paintings because the blind cannot visually appreciate the art! Nor music because the deaf cannot hear it!

I am also concerned about the suggestions that terminology must be kept simple so as to be understandable by those not well educated in language. As a writer, and more, one who loves the subtleties of the English language, I see this like banning music in favour of only rhythmnless noise because some people cannot understand Mozart.

From a usability perspective, there is much sense in keeping it simple - if I may be allowed a modern cliche - but let's not ban poetry, please!

Matt

Bernard Marx

WebmasterWorld Senior Member 10+ Year Member



 
Msg#: 3 posted 4:56 pm on Feb 18, 2006 (gmt 0)

Is your content written with your target audience in mind? Do not use words like vehement when words like forceful or full of energy will convey the same meaning.

Yup. There's the offending passage. Of course, the "Do not use.." sentence is implicitly modified by the "target audience". DrDoc knows these arguments already, but I might as well air them here (because we are at risk of developing a branch of this thread over at the Javascript forum!).

It's very good advice when applied to sites that are appealing to a mass audience, and will benefit from appealing to the lowest common denominator. But what may be good advice for The Sun may not be such good advice for The Guardian (translate to your own newspaper comparison).

Indeed The Sun outstrips The Guardian in sales many times over, but hasn't Brett recently been telling us that, if we're looking for our own bite of internet pie, there's much more meat to be found in the tail?

Switching to idealism, I'd like to add my voice to those who would like to complain about the diversity crushing power of search engines. We shouldn't be surrendering our language to them as well (Google Newspeak anyone?).

I realise that the newspaper analogy doesn't apply for many sites, even from an idealist perspective. A government information site has no business being interesting. Its business is providing information, and making that information accessible to all, including people of limited vocabulary (or even intelligence).

Nice article, Doc.

bedlam

WebmasterWorld Senior Member 10+ Year Member



 
Msg#: 3 posted 5:29 pm on Feb 18, 2006 (gmt 0)

This leads me to suggest something I haven't seen mentioned in any of the recent accessibility threads: remove decorative images.

Might I disagree? I do hope so <g>

<snip>

Decorative images can enhance the experience for those that can see, perceive and understand them, and as such are valuable.

So? You may want to go back and re-read my advice. I advised that purely decorative images be removed from the markup to stylesheets. Who wants a text-only web?!


...but the pictures are not crucial and don't have alt text nor do they provide really important information - they are decoration.

I think that's all right in terms of both, pleasing the healthy user and still not constraining disabled users from accessing key information - what do you think?

If they really add nothing to the content, then I would say (again), that they should be removed from the markup--but this has nothing whatsoever to do with whether or not images appear on your pages.

I am not advocating a return to text-only pages--I just seem to have misjudged how familiar participants in the thread are with CSS. Again, surf over to [csszengarden.com...] and view the source; you will not find a single <img ... /> element, but the pages are as graphically rich as anyone could want.

Save one of the csszengarden pages to your desktop and open it in a web browser. It contains no images.

-b

Maybe I should turn this subject into another thread...

DrDoc

WebmasterWorld Senior Member drdoc us a WebmasterWorld Top Contributor of All Time 10+ Year Member



 
Msg#: 3 posted 6:02 pm on Feb 18, 2006 (gmt 0)

A couple of things:

While I agree with bedlam that decorative images should be removed from the HTML structure in favor of defining them in the stylesheet, I feel it important to somehow clarify what types of decorative images we are talking about. A few examples of images which could successfully (and probably also should) be defined in the stylesheet:

  • images used as bullets in a list
  • page background image
  • image used as background for a drop-cap letter
  • graphic employed in "image replacement" techniques for headings

    Examples of "decorative" images which should remain in the markup:

  • sectional divider (it serves a purpose of separating passages of content; although one can argue that there are better ways of doing so [such as using separate <div> tags, proper use of headings and paragraphs, etc])
  • graphics which communicate a meaning (use your alt attribute to convey the meaning, not necessarily what is in the picture itself), whether subtle, abstract, or an example

    A few other examples of "decorative" images where brought forth in the thread, such as photos from travel destinations, etc. While you may personally view these as purely "decorative" they actually serve a great purpose. These are not the type of decorative images bedlam was talking about. Such images should remain in your markup. In fact, I would encourage you to use more of them.

    To take the travel destination photos as an example -- by making proper use of the alt and longdesc attributes you can now give the "blind" a glimpse of what the destination looks like. Excellent usage!

    Now, to address Matt Probert's post ... I think Bernard Marx conveyed the meaning well. Certainly you should utilize the language to write beautiful content. That's a given. But, always keep your target audience in mind. Write the most beautiful and rich content possible without losing the meaning of the passage. If there are a few words here and there which are not clearly understood by the reader, the context surely will ensure that the meaning is properly conveyed. Just don't use meaningless fancy words just because you know them. That's not beautiful. That's not prose. Balance is key.

  • g1smd

    WebmasterWorld Senior Member g1smd us a WebmasterWorld Top Contributor of All Time 10+ Year Member



     
    Msg#: 3 posted 11:21 pm on Feb 18, 2006 (gmt 0)

    ...and this all fits in neatly with the advice that I have often given, to mark up all content inside the block level elements of headings, paragraphs lists, tables, and forms, and then use CSS to style them.

    The HTML code on-page becomes very light, renders quickly, and is much easier for bots to parse (and might just get a better position - I sense that every page that I have converted from HTML bloat (with nested tables, multiple <font> tags, etc) to semantic HTML, with CSS for styles, has jumped up in rankings within a week or so).

    aspdaddy

    WebmasterWorld Senior Member 10+ Year Member



     
    Msg#: 3 posted 9:23 pm on Feb 20, 2006 (gmt 0)

    Great post DrDoc, so many sites these days are poor on usability, I often find myselt hitting Google and starting again out of frustration with bad design.

    I held some workshops recently with staff of UK schools on how to optimise the user experience on using common portals.

    These are primarily data inputters /form fillers but I think the principles apply to any site, especially e-commerce sites, the main things being repeated by attendees were:

    - Limited use of the mouse required to use the sites
    - Can control the text sizes in the browser
    - Can print the pages as they look on the screen
    - Can go back to any previous point from any point (Back button enabled, breadcrumbs etc)

    This was quite a focused sgroup for a specific application but I approach it like any other website.

    I start by identifying the primary and secondary user types. For each type identified I list the characteristics (age/background/IT skills), environment (noise/distractions/PC Spec/WebAccess) and the main tasks and goals each user performs including the frequency and session length.

    From this you can decide which usability guidelines to consider and how important each is. You should design for the primary users while considering the secondary users.

    Some people say this approach is unrealistic and your site should be designed for all users, IMO that is unrealistic, users and user-goals on the web are so diverse and you need to focus design effort on a few key things.

    Chris_D

    WebmasterWorld Senior Member 10+ Year Member



     
    Msg#: 3 posted 11:52 pm on Mar 1, 2006 (gmt 0)

    graphics which communicate a meaning (use your alt attribute to convey the meaning, not necessarily what is in the picture itself), whether subtle, abstract, or an example

    Exactly. If you go back to the basic premise - its all about the 'separation of content (html/xhtml) and presentation elements (CSS)'. Images which are in themselves 'content' - rather than 'presentational' should be in the HTML/XHTML.

    surf over to [csszengarden.com...] and view the source; you will not find a single <img ... /> element, but the pages are as graphically rich as anyone could want.
    Save one of the csszengarden pages to your desktop and open it in a web browser. It contains no images.

    I had a long conversation with Dave Shea in Sydney in 2004 regarding images as 'content' being different to images as 'presentation'. CSS Zengarden is a fantastic concept - a 'show me, don't tell me' concept. it was launched in May 2003, to show that CSS based designs can be visually appealing, and CSS can allow content to be reused with a vastly different appearance. The concept of only changing the CSS and NOT changing the HTML was a method to emphasise the design benefits of CSS, ease of reskinning content etc - compared to table based layouts. I don't think that the original zengarden HTML has changed since mid 2003.

    Dave has more recently covered some of the 'image replacement' techniques and their issues [mezzoblue.com...]
    and earlier [mezzoblue.com...]

    Global Options:
     top home search open messages active posts  
     

    Home / Forums Index / WebmasterWorld / Accessibility and Usability
    rss feed

    All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
    Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
    WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
    © Webmaster World 1996-2014 all rights reserved