WebAIM - Web Accessibility In Mind

E-mail List Archives

Thread: Underlined text on button

for

Number of posts in this thread: 5 (In chronological order)

From: Tarek Alaaeddin
Date: Fri, Mar 22 2002 9:00AM
Subject: Underlined text on button
No previous message | Next message →

Hello Everyone,

Just wondering if sombebody knows how to underline text for a value of a
button. For instance I have a button called Submit, and I want to underline
the letter S, to tell the user that S is the shortcut key. Anybody can help
with that?

Thanks.

Tarek



_________________________________________________________________
Chat with friends online, try MSN Messenger: http://messenger.msn.com


----
To subscribe, unsubscribe, or view list archives,
visit http://www.webaim.org/discussion/


From: Jon Gunderson
Date: Fri, Mar 22 2002 10:06AM
Subject: Re: Underlined text on button
← Previous message | Next message →

Tarek,
Here is the HTML code for a submit button:

<button type="submit"><span style="text-decoration:
underline">S</span>ubmit</button>

You can do other styling of the text, preferably with cascading style
sheets [1].

Jon

[1] http://www.w3.org/TR/CSS1.html

At 10:00 AM 3/22/2002 -0600, you wrote:
>Hello Everyone,
>
>Just wondering if sombebody knows how to underline text for a value of a
>button. For instance I have a button called Submit, and I want to
>underline the letter S, to tell the user that S is the shortcut key.
>Anybody can help with that?
>
>Thanks.
>
>Tarek
>
>
>
>_________________________________________________________________
>Chat with friends online, try MSN Messenger: http://messenger.msn.com
>
>
>----
>To subscribe, unsubscribe, or view list archives, visit
>http://www.webaim.org/discussion/

Jon Gunderson, Ph.D., ATP
Coordinator of Assistive Communication and Information Technology
Division of Rehabilitation - Education Services
MC-574
College of Applied Life Studies
University of Illinois at Urbana/Champaign
1207 S. Oak Street, Champaign, IL 61820

Voice: (217) 244-5870
Fax: (217) 333-0248

E-mail: = EMAIL ADDRESS REMOVED =

WWW: http://www.staff.uiuc.edu/~jongund
WWW: http://www.w3.org/wai/ua



----
To subscribe, unsubscribe, or view list archives,
visit http://www.webaim.org/discussion/

From: Jim Thatcher
Date: Mon, Mar 25 2002 12:30PM
Subject: CSS positioning with Dreamweaver
← Previous message | Next message →

Hi,

Glasshauss (www.glasshaus.com) are publishers of a terrific book on web
accessibility. Their new site has some problems. They have been informed of
those problems and will attend to them, I hope.

There is one problem for which I need some advice. The pages use CSS to
position text elements on the page, and the information is not spoken in the
correct sequence. The developer responded to me that the positioning is
imposed by Dreamweaver. Question: is there any way to insure that the
content entered with dreamweaver will be linearized (spoken) in the same way
that it appears on the display?

Jim
http://jimthatcher.com
512-306-0931


----
To subscribe, unsubscribe, or view list archives,
visit http://www.webaim.org/discussion/

From: Paul Bohman
Date: Mon, Mar 25 2002 12:59PM
Subject: RE: CSS positioning with Dreamweaver
← Previous message | Next message →

Looks like people have already begun to answer this question, but I'll
still put my post in with the others:

The answer to this problem is actually available in the same book that
they will be publishing. I'll explain it briefly here:

Dreamweaver allows users to create what it calls "layers." In the
default configuration of Dreamweaver, these "layers" are actually <div>
elements with CSS positioning applied to them. Page authors can create
almost any imaginable configuration of layers. They can rearrange them,
enlarge or shrink them, rearrange them again, and so on.

This sort of flexibility is great for authors, but it can cause havoc
for users of screen readers. Screen readers ignore all of the CSS
positioning. All of it. Screen readers are only concerned with the
literal order of the elements in the page. This is often referred to as
"linearization" or the "linearized order" of elements on the page.

To find out the linearized reading order of a document, remove ALL of
the HTML tags (or just imagine doing so). You should be left with plain
text. This is the order that screen readers care about.

As was mentioned in earlier posts, you can rearrange the order of <div>
tags created in Dreamweaver, because they show up as little yellow
shields in the upper left of the document. Use your mouse to rearrange
them so that the reading order matches the visual layout order.
Rearranging these little yellow shields will not affect the visual
layout at all. It will be a HUGE benefit to those who use screen readers
though.

Dreamweaver is not the only tool in which this is an issue. GoLive is
another example, and, to some extent, FrontPage as well.

Paul Bohman
Technology Coordinator
WebAIM (Web Accessibility in Mind)
www.webaim.org
Center for Persons with Disabilities
www.cpd.usu.edu
Utah State University
www.usu.edu




From: John Foliot - bytown internet
Date: Mon, Mar 25 2002 12:58PM
Subject: RE: CSS positioning with Dreamweaver
← Previous message | No next message

A review of the source files shows the footer information ahead of the
"content" information on the home page. For user agents which do not support
CSS, they will render the text in the linear fashion it is constucted in.

Using the DIV IDs in the code, you present in this order:
<div id="header"...>
<div id="navigation1"...>
<div id="footer"...>
and then finally,
<div id="bookimage1"...> and
<div id="title"...>, <div id="text1"...>

So that's how a non-CSS application will interpret the information. You
must use care that you do not confuse positioning with ordering,
structure(logic) vs. display.

As for how to fix it in Dreamweaver? (Use HomeSite <grin>). Crack open the
code (view code) and re-order it properly.

JF


>