E-mail List Archives

You are here: Home > Community > E-mail List Archives > View Thread

Thread: Semantic markup vs CSS styling for emphasis

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

From: Mark Fletcher
Date: Wed, Aug 06 2003 8:24AM
Subject: Semantic markup vs CSS styling for emphasis
No previous message | Next message →

Hi folks,

I'm currently in an interesting debate regarding the use of the phrase tags
 and for emphasis as opposed to styling the content using CSS.
I only have HPR at my disposal. So I wondered if anyone could shed some
light on the following questions.

1. Do JAWS or Windows-Eyes support CSS and if so up to what level?
2. Do you ever use CSS for emphasis or like me would you only use semantic
markup.

Many Thanks
Mark

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

From: Gilles Casse
Date: Wed, Aug 06 2003 8:53AM
Subject: Re: Semantic markup vs CSS styling for emphasis
← Previous message | Next message →

Hi,

Just to mention that you may want to use a styled em element.
Greetings,

Gilles

--
Oralux http://oralux.org

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

From: Mark Fletcher
Date: Wed, Aug 06 2003 8:58AM
Subject: Re: Semantic markup vs CSS styling for emphasis
← Previous message | Next message →

Hi Gilles,

Yes, thanks that is a good point. But would you ever just use CSS rather
than EM or Strong?

Cheers
Mark
----- Original Message -----
From: "Gilles Casse" < = EMAIL ADDRESS REMOVED = >
To: < = EMAIL ADDRESS REMOVED = >
Sent: Wednesday, August 06, 2003 3:50 PM
Subject: Re: Semantic markup vs CSS styling for emphasis

> Hi,
>
> Just to mention that you may want to use a styled em element.
> Greetings,
>
> Gilles
>
> --
> Oralux http://oralux.org
>
>
>
> ----
> To subscribe, unsubscribe, or view list archives,
> visit http://www.webaim.org/discussion/
>

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

From: Miriam Frost Jungwirth
Date: Wed, Aug 06 2003 9:09AM
Subject: Re: Semantic markup vs CSS styling for emphasis
← Previous message | Next message →

Hi Mark,

There isn't a conflict between semantic markup and CSS - you would
simply use em or strong and style them -

for example, in your CSS document -
strong {
font-weight: bold;
text-transform: uppercase;
font-color: red; }

and wherever you use strong you'll get bold, capitalized red text.

Semantic _and_ attractive!

~Miriam

On Wednesday, August 6, 2003, at 09:59 AM, Mark Fletcher wrote:

> Hi Gilles,
>
> Yes, thanks that is a good point. But would you ever just use CSS
> rather
> than EM or Strong?
>
> Cheers
> Mark

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

From: jeff newman
Date: Wed, Aug 06 2003 9:15AM
Subject: Re: Semantic markup vs CSS styling for emphasis
← Previous message | Next message →

> Yes, thanks that is a good point. But would you ever just use CSS rather
> than EM or Strong?

Personally, I'd use it to save space.

this is bold

takes up a lot less space than

this is bold or however you want to structure it.

Even if you're using CSS you still have to mark up where your
emphasis/strong begins and ends. It's much simpler to just use the
appropriate tag than to create a class/div/selector. The only time I can
think of using a CSS solution that doesn't involve or would
be if I needed different kinds of emphasis for some reason.

Unless I'm totally missing the point of what you're asking (which is
possible... it's only 11:10am... groan....)

jeff

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

From: Mark Fletcher
Date: Wed, Aug 06 2003 9:30AM
Subject: Re: Semantic markup vs CSS styling for emphasis
← Previous message | Next message →

Hi Jeff,

> Even if you're using CSS you still have to mark up where your
> emphasis/strong begins and ends. It's much simpler to just use the
> appropriate tag than to create a class/div/selector. The only time I can
> think of using a CSS solution that doesn't involve or would
> be if I needed different kinds of emphasis for some reason.

Absolutely I could not agree with you more.

> Unless I'm totally missing the point of what you're asking (which is
> possible... it's only 11:10am... groan....)

The main question is would you do this:

This is bold
emphasis {font-family: Verdana, Arial, Helvetica, sans-serif; font-weight:
bold;}

Or would you do this:

This is bold

strong {font-weight: bold;font-style: normal;}

In my mind using the span removes the structural meaning from the mark-up,
do you agree with this?

Cheers
Mark

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

From: jeff newman
Date: Wed, Aug 06 2003 9:56AM
Subject: Re: Semantic markup vs CSS styling for emphasis
← Previous message | Next message →

I do agree that it would remove the structural meaning of the mark-up. I'm
not sure if this would be penalized in anway, i.e. lower ranking in search
engines.

My natural instinct, as has been expressed by others is to use the
appropriate tags wherever possible and then pretty them up using CSS. I
can think of a couple of examples where getting a CSS tag to perform a
function already available in a standard HTML tag could lead to problems
down the road.

But then again, it all depends on what you're hoping to accomplish, right?
:)

j.

On Wed, 6 Aug 2003 16:30:45 +0100, Mark Fletcher <mark-
= EMAIL ADDRESS REMOVED = > wrote:

> Hi Jeff,
>
>> Even if you're using CSS you still have to mark up where your
>> emphasis/strong begins and ends. It's much simpler to just use the
>> appropriate tag than to create a class/div/selector. The only time I
>> can
>> think of using a CSS solution that doesn't involve or 
>> would
>> be if I needed different kinds of emphasis for some reason.
>
> Absolutely I could not agree with you more.
>
>> Unless I'm totally missing the point of what you're asking (which is
>> possible... it's only 11:10am... groan....)
>
> The main question is would you do this:
>
> This is bold
> emphasis {font-family: Verdana, Arial, Helvetica, sans-serif; font-
> weight:
> bold;}
>
> Or would you do this:
>
> This is bold
>
> strong {font-weight: bold;font-style: normal;}
>
> In my mind using the span removes the structural meaning from the mark-
> up,
> do you agree with this?
>
> Cheers
> Mark
>
>
> ----
> To subscribe, unsubscribe, or view list archives, visit
> http://www.webaim.org/discussion/
>
>

--
Jeff Newman
Librarian, Reference Department
Robarts Library, University of Toronto
p: 416.978.1953
e: = EMAIL ADDRESS REMOVED =

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

From: Gilles Casse
Date: Wed, Aug 06 2003 9:59AM
Subject: Re: Semantic markup vs CSS styling for emphasis
← Previous message | Next message →

Hi Mark,

> But would you ever just use CSS rather
> than EM or Strong?
I would take both choices.
The em element for the meaning and thanks to CSS, the user will be free to
choose her preferred style: why not an aural style sheet?

Gilles

--
Oralux http://oralux.org

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

From: Mark Fletcher
Date: Wed, Aug 06 2003 10:04AM
Subject: Re: Semantic markup vs CSS styling for emphasis
← Previous message | Next message →

Hi Jeff,

Please find my reply comments inline.

> I do agree that it would remove the structural meaning of the mark-up.
I'm
> not sure if this would be penalized in anway, i.e. lower ranking in search
> engines.

No, but it could prevent say blind users being able to locate the emphasized
text though, right?
>
> My natural instinct, as has been expressed by others is to use the
> appropriate tags wherever possible and then pretty them up using CSS. I
> can think of a couple of examples where getting a CSS tag to perform a
> function already available in a standard HTML tag could lead to problems
> down the road.

That sounds very interesting, could you possibly expand upon this, that
would really help?
>
> But then again, it all depends on what you're hoping to accomplish, right?

Yes, of course.

I really appreciate you helping me with these questions.

Cheers
Mark

>
>
> On Wed, 6 Aug 2003 16:30:45 +0100, Mark Fletcher <mark-
> = EMAIL ADDRESS REMOVED = > wrote:
>
> > Hi Jeff,
> >
> >> Even if you're using CSS you still have to mark up where your
> >> emphasis/strong begins and ends. It's much simpler to just use the
> >> appropriate tag than to create a class/div/selector. The only time I
> >> can
> >> think of using a CSS solution that doesn't involve or 
> >> would
> >> be if I needed different kinds of emphasis for some reason.
> >
> > Absolutely I could not agree with you more.
> >
> >> Unless I'm totally missing the point of what you're asking (which is
> >> possible... it's only 11:10am... groan....)
> >
> > The main question is would you do this:
> >
> > This is bold
> > emphasis {font-family: Verdana, Arial, Helvetica, sans-serif; font-
> > weight:
> > bold;}
> >
> > Or would you do this:
> >
> > This is bold
> >
> > strong {font-weight: bold;font-style: normal;}
> >
> > In my mind using the span removes the structural meaning from the mark-
> > up,
> > do you agree with this?
> >
> > Cheers
> > Mark
> >
> >
> > ----
> > To subscribe, unsubscribe, or view list archives, visit
> > http://www.webaim.org/discussion/
> >
> >
>
>
>
> --
> Jeff Newman
> Librarian, Reference Department
> Robarts Library, University of Toronto
> p: 416.978.1953
> e: = EMAIL ADDRESS REMOVED =
>
>
> ----
> To subscribe, unsubscribe, or view list archives,
> visit http://www.webaim.org/discussion/
>

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

From: Mark Fletcher
Date: Wed, Aug 06 2003 10:10AM
Subject: Re: Semantic markup vs CSS styling for emphasis
← Previous message | Next message →

Hi Gilles,

> > But would you ever just use CSS rather
> > than EM or Strong?
> I would take both choices.
> The em element for the meaning and thanks to CSS, the user will be free to
> choose her preferred style: why not an aural style sheet?

Do any speech readers apart from Emacspeak support aural style sheets?

Thanks to everyone who has so far participated in this thread, I really
appreciate it!

Cheers
Mark

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

From: jeff newman
Date: Wed, Aug 06 2003 10:23AM
Subject: Re: Semantic markup vs CSS styling for emphasis
← Previous message | Next message →

Oh, they're just very ephemeral ideas and untested concerns.

Your point about blind users is very well taken and should be a priority.
I'm also not sure how an aurel stylesheet would handle this.

There's also the consideration of future changes. If your create and
maintain the site, and will for all time, then you can pretty much do as
you please. If someone else will be maintaining it they will need to know
all of the little "liberties" that you took with your mark-up.

My other concern deals with browsers that can't deal with style sheets at
all. I'm pretty sure that every browser can handle , , and 
with ease, but a browser that wasn't designed for CSS would just dump the
rule all together and leave your text unstyled and unemphasized. Granted,
these browsers are rare, but they tend to be the type of browsers most used
in developping nations, etc.

j.

On Wed, 6 Aug 2003 17:04:36 +0100, Mark Fletcher <mark-
= EMAIL ADDRESS REMOVED = > wrote:

> Hi Jeff,
>
> Please find my reply comments inline.
>
>
>> I do agree that it would remove the structural meaning of the mark-up.
> I'm
>> not sure if this would be penalized in anway, i.e. lower ranking in
>> search
>> engines.
>
> No, but it could prevent say blind users being able to locate the
> emphasized
> text though, right?
>>
>> My natural instinct, as has been expressed by others is to use the
>> appropriate tags wherever possible and then pretty them up using CSS. I
>> can think of a couple of examples where getting a CSS tag to perform a
>> function already available in a standard HTML tag could lead to problems
>> down the road.
>
> That sounds very interesting, could you possibly expand upon this, that
> would really help?
>>
>> But then again, it all depends on what you're hoping to accomplish,
>> right?
>
> Yes, of course.
>
> I really appreciate you helping me with these questions.
>
> Cheers
> Mark
>

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

From: Lori K. Brown
Date: Wed, Aug 06 2003 11:12AM
Subject: users who turn off underlining for links
← Previous message | Next message →

Dear list:

We are struggling with what would seem to be the most basic of problems:
the accessible, consistent, and user-friendly presentation of hyperlinks
in our web-based software product.

Unstyled, for nearly all browsers I have ever seen, hyperlinks are blue
and underlined. I believe that the particular styling of hyperlinks is
irrelevant for AT users, so I'm not going to examine their situation
further. But there are users with other visual impairments for whom the
particular styling is important -- colorblind users, users who use
magnifiers, and the problem we are addressing locally -- users who turn
off the underlining of hyperlinks. In a world with this diversity of
needs, the color that helps the no-underlines user is useless to the
colorblind user. I am baffled.

What is the best way to present hyperlinked text that makes all of these
folks happy?

I proposed using titles on the hyperlinks, since in some if not all
browsers titles on hyperlinks are presented as popup tooltips. But this
doesn't happen in all browsers, and many users are too impatient / unaware
to hover over a linked piece of text to get the tooltip.

Ideas? Suggestions? Commiseration?

Lori K. Brown
user interface engineer
SiteScape, Inc.

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

From: Jukka K. Korpela
Date: Wed, Aug 06 2003 1:40PM
Subject: Re: users who turn off underlining for links
← Previous message | Next message →

On Wed, 6 Aug 2003, Lori K. Brown wrote:

> Unstyled, for nearly all browsers I have ever seen, hyperlinks are blue
> and underlined.

Yes, and this poor practice has become good practice, because it is so
common. That is, although the choice was not good, it is best to avoid
disturbing it in author style sheets, except in special cases or in a
modest amount (like changing to less bright blue or removing the underline
on mouseover).

> - - and the problem we are addressing locally -- users who turn
> off the underlining of hyperlinks.

That would be their choice, and its their job the make an informed
choice. If they are completely colorblind, for example, they should take
some other action to make links look different from normal text.

> What is the best way to present hyperlinked text that makes all of these
> folks happy?

I think you take too much responsibility here. Authors should not be
required to prepare against any user actions - it would be completely
impossible in general. If you just preserve the two common default
features of link presentation (colors and underline), i.e. don't do
anything to remove or disturb then, you've done your share. Different user
agents and different users shall take it from there.

> I proposed using titles on the hyperlinks, since in some if not all
> browsers titles on hyperlinks are presented as popup tooltips. But this
> doesn't happen in all browsers, and many users are too impatient / unaware
> to hover over a linked piece of text to get the tooltip.

And it would be rather inefficient for recognizing links on a visual scan.
Besides, a tooltip is not at all a sure sign of a hyperlink.

--
Jukka "Yucca" Korpela, http://www.cs.tut.fi/~jkorpela/

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

From: Tom Gilder
Date: Wed, Aug 06 2003 3:29PM
Subject: Re: Semantic markup vs CSS styling for emphasis
← Previous message | Next message →

On Wednesday, August 6, 2003, 3:24:59 PM, Mark Fletcher wrote:
> I'm currently in an interesting debate regarding the use of the phrase tags
> and for emphasis as opposed to styling the content using CSS.

Read the text out-loud as you would do in a telephone conversation. Do
you put aural stress (such as reading them louder) on the words? If
so, or is most likely what you want.

If the styling is purely visual, then you probably shouldn't use them,
and just use CSS.

> 1. Do JAWS or Windows-Eyes support CSS and if so up to what level?

Sort of. JAWS and Windows-Eyes really just scrape content rendered by
IE and read it, however this means they take into account CSS which is
targeted at visual browsers.

For instance, display:none in a "@media screen" section should *never*
effect a screenreader, but sadly they do in a lot of common readers.

Neither have any aural CSS support, and neither really use
accessibility features of HTML well.

> 2. Do you ever use CSS for emphasis or like me would you only use
> semantic markup.

As above, it depends if the emphasis is visual or structual.

--
Tom Gilder, http://tom.me.uk/
Blog! http://blog.tom.me.uk/

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

From: Laura Carlson
Date: Thu, Aug 07 2003 7:53AM
Subject: Re: Semantic markup vs CSS styling for emphasis
← Previous message | Next message →

--On Wednesday, August 6, 2003 5:11 PM +0100 Mark Fletcher
< = EMAIL ADDRESS REMOVED = > wrote:

> Do any speech readers apart from Emacspeak support aural style sheets?

Hi, Mark,

Looks like Fonix SpeakThis has some limited aural CSS support.

<http://www.speakthis.com/highlights.cfm?highlight=aural&;name=Aural%20S
tyle%20Sheet%20Support>

Laura
_________________________________________________________________

Laura L. Carlson
Information Technology Systems and Services
University of Minnesota Duluth
Duluth, MN 55812-3009
mailto: = EMAIL ADDRESS REMOVED =

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

From: Mark Fletcher
Date: Thu, Aug 07 2003 8:42AM
Subject: Re: Semantic markup vs CSS styling for emphasis
← Previous message | No next message

Hi Laura,

Thank you for the URI. I really appreciate it.

Best
Mark

----- Original Message -----
From: "Laura Carlson" < = EMAIL ADDRESS REMOVED = >
To: < = EMAIL ADDRESS REMOVED = >; "Mark Fletcher"
< = EMAIL ADDRESS REMOVED = >
Sent: Thursday, August 07, 2003 2:48 PM
Subject: Re: Semantic markup vs CSS styling for emphasis

> --On Wednesday, August 6, 2003 5:11 PM +0100 Mark Fletcher
> < = EMAIL ADDRESS REMOVED = > wrote:
>
> > Do any speech readers apart from Emacspeak support aural style sheets?
>
> Hi, Mark,
>
> Looks like Fonix SpeakThis has some limited aural CSS support.
>
> <http://www.speakthis.com/highlights.cfm?highlight=aural&;name=Aural%20S
> tyle%20Sheet%20Support>
>
> Laura
> _________________________________________________________________
>
> Laura L. Carlson
> Information Technology Systems and Services
> University of Minnesota Duluth
> Duluth, MN 55812-3009
> mailto: = EMAIL ADDRESS REMOVED =
>
>
> ----
> To subscribe, unsubscribe, or view list archives,
> visit http://www.webaim.org/discussion/
>

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