XHTML and IMG ALT tags...

He has: 1,016 posts

Joined: May 2002

Hi,

I've been trying to do this new site in XHTML and I normally use a small 1x1 pixel transparent image for some places and the validator complains that I don't have any alt tag for those. What is the best way to do this? Just put an empty alt tag (i.e. alt=" ") or is there a better way?

Busy's picture

He has: 6,151 posts

Joined: May 2001

use alt="" (no gap)
using a gap will create a small blank box when trying to view the alt, using no gap doesnt diplay anything

don't forget the / on the end of the tag Wink

He has: 1,016 posts

Joined: May 2002

The problem is that Dreamweaver will delete the ALT tag if it's empty, that's why I have to put the space Sad

He has: 296 posts

Joined: May 2002

Then add the space in Dreamweaver then take it out in notepad Smiling

He has: 1,016 posts

Joined: May 2002

Yeah, but I was hoping there would be another way... Anyways, it's not that important, these images are 1x1 pixels so not many people are going to put their mouse over them and even if they do it's no big deal.

They have: 21 posts

Joined: Oct 2000

What's the point of coding to XHTML if you're not going to follow the ideals of XHTML?

The whole point of XHTML is *not* presentational hacks likes 1x1 transparent images, but to use CSS to layout the page. If you're not going to go the whole way, might as well not go at all. While your structure may validate, it says nothing about the true validity of the page.

Supermod @ CodingForums.com

dk01's picture

He has: 516 posts

Joined: Mar 2002

I don't understand how using 1x1 pixels have anything to do with the use of xhtml:

Quote: Mission of the HTML Working Group
To develop the next generation of HTML as a suite of XML tag sets with a clean migration path from HTML 4. Some of the expected benefits include: reduced authoring costs, an improved match to database & workflow applications, a modular solution to the increasingly disparate capabilities of browsers, and the ability to cleanly integrate HTML with other XML applications. For further information, see the Charter for the HTML Working Group (members only).

No where in there does it say anything about using images for positioning or even that xhtml's purpose was to use only "CSS to layout the page".
-dk

He has: 1,016 posts

Joined: May 2002

I use the 1x1 pixel image in a column that I want 1px wide. Instead of using a different colored image for each line I'd like to make, I use a transparent one and set a background color in that column instead. I think this is a lot easier and I too don't see how that interferes with XHTML?

Megan's picture

She has: 11,421 posts

Joined: Jun 1999

Quote: Originally posted by jkd
What's the point of coding to XHTML if you're not going to follow the ideals of XHTML?

The whole point of XHTML is *not* presentational [b]hacks likes 1x1 transparent images, but to use CSS to layout the page. If you're not going to go the whole way, might as well not go at all. While your structure may validate, it says nothing about the true validity of the page. [/B]

It depends if you're coding to transitional or strict. If you're going with the transitional spec it's okay to use tables for layout. I don't see what the problem is with coding to xhtml transitional at this point in time. The whole point of transitional is to transition from HTML to xhtml.

Busy's picture

He has: 6,151 posts

Joined: May 2001

just for the record tables are used in XHTML strict, just not the align or bgcolor attributes are allowed

Zollet, thought about using the   in a span tag with css to control the size of it (font size, family etc). but like you say, 1x1 is very unlikey to be mouse overed but would be messy if viewed with images turned off

He has: 1,016 posts

Joined: May 2002

Well, if anyone views a website with images turned off, I'm sure they're used to having the website look all messed up. That's not a worry at all since it's their problem if they've chosen to turn images off. Smiling

They have: 13 posts

Joined: Oct 2002

Quote: Originally posted by zollet
Well, if anyone views a website with images turned off, I'm sure they're used to having the website look all messed up. That's not a worry at all since it's their problem if they've chosen to turn images off. Smiling

Try having reading difficulties then.

Megan's picture

She has: 11,421 posts

Joined: Jun 1999

So what would you say is the best thing to do in this case? Should we try to avoid using spacer images at all? Or should we label them with something? If so, what would make most sense?

He has: 1,016 posts

Joined: May 2002

I guess you could do either a space, a dot or something like that.

They have: 21 posts

Joined: Oct 2000

Quote: Originally posted by Megan
So what would you say is the best thing to do in this case? Should we try to avoid using spacer images at all? Or should we label them with something? If so, what would make most sense?

Use CSS! There are very handy width, min-width, max-width, height, min-height, and max-height properties. Then you have padding and margin properties to get it perfect.

Supermod @ CodingForums.com

Busy's picture

He has: 6,151 posts

Joined: May 2001

jkd, not all of those you mentioned work in version 6 and 7 browsers

disaster-master's picture

She has: 2,154 posts

Joined: May 2001

Here is an article for ya'll.

Spacer gifs and alt tags

Megan's picture

She has: 11,421 posts

Joined: Jun 1999

I'm sorry, that question was meant for "thought" who seems to actually use a screen reader. I was wondering what he, as a visually impared user, would prefer that we do.

They have: 13 posts

Joined: Oct 2002

if your going to use graphics use them, but dont put empty alt tags!

I persoanlly use css, and html for web sites. But hey it all takes time!

One alternative to consider so that you dont upset those of us who use text readers is to do a text only version, However even i am not always that committed!

Thought

xx

Megan's picture

She has: 11,421 posts

Joined: Jun 1999

Quote: Originally posted by jkd
Use CSS! There are very handy width, min-width, max-width, height, min-height, and max-height properties. Then you have padding and margin properties to get it perfect.

Great! Now wouldn't it be nice if all browsers supported them properly? Unfortunately I have the curse of still developing for NS 4.x (both of my current clients are using that piece of junk), so spacer gif's are still a necessity in a few instances.

Oh my gosh, get a load of the number of spacers used by some of the prominent newspapers in that article D-M posted! Whoah! Over 100 on the NY Times site!

Thought,

If we are forced to use spacer.gif's, what's should we put in the alt attribute? Also, what's the most common text browser in use? Would we be able to download this somewhere just to see how it works? Thanks.

They have: 13 posts

Joined: Oct 2002

most commone text browser i think is jaws, but i knwo that text help did have screen reader as a free download. url for text help is: texthelp.com

There site amusingly is one awfull site to look at though!

I do find that the easiest way to get over the screen reader problem is to add another version of the site as a text file, just the basic information of where to contact etc does for most sites, site or similar.

I have to add that i believe that he bobby standards are way ott and that they need to be a bit more realsitic!

Oh and buy the way for the record i am female Wink

Thought

xx

Busy's picture

He has: 6,151 posts

Joined: May 2001

Thought, does the title tag act interfer like the alt tag in images?

alt here

Want to join the discussion? Create an account or log in if you already have one. Joining is fast, free and painless! We’ll even whisk you back here when you’ve finished.