I don’t know what to do for ‘border’ though.

A problem I have is what class names to give to other images like the ones floated within an article, or photos of the author, etc. Two people above suggested ‘illustrative’ for the former. Maybe that’s good, I don’t know. It assumes all such images would always be floated right, or always floated left. What if I want variety like in a newspaper? Speaking of that, I wonder what class names / naming conventions are used by printers. We’ve already adopted their use of ‘masthead’ — maybe they have some other good ideas we can use.

I wish I had more ideas on this because, in this blog topic at least, there isn’t a clear naming convention yet. I’ll have to go see how Eric names his floated images. ;-)

I avoid such names where possible, but there are some cases where nothing else seems particularly better. Eric’s example may or may not have more meaningful solution than this. If you want to change one class of styles later, you can do so without it being misnamed. A disadvantage is that you sometimes forget which style is which and have to refer to the style sheet.

Such naming and process is similar to what I’ve done when working on technical documents in FrameMaker where my template has a couple table styles named generically, and this seems like a reasonable test or comparison. I think it’s interesting to imagine what you would do if you were using the Styles feature while working in (for example) InDesign or another DTP program.

Without knowing under what circumstances you choose to “border” your imags, one can’t really address the question.

Yes, the class of “border” is not correct, as at some point in the future you could decide that these images should not be bordered.

Even another class name that is presentational, but not as specific as “border” could work for you here.

<img class=”slickLookingImage”> or something of the sort. :-)

- Jens

But images are presentational, right?

Some images are indeed presentational (backgrounds, borders, banner logos), but these shouldn’t even have tags; they should be added in later with CSS image replacement or DOM scripting.

Anything that does get an img tag is content, like text, and the classname applied to that tag should describe something meaningful about the content of the image, just like the classname of a span describes the text content inside it.

So what”s wrong with defining their presentational context along with semantic context.

Because the presentational context could change down the line, and suddenly you have a bunch of images with “border” classes which aren’t bordered, and a bunch of images without that class which are.

(I mean, it”s not like you”re saying class=”thickgreenborder”)

So you’re saying that as long as we use vague presentational classnames, it makes it all better?

Classnames describe content; they do not describe what we want to have happen to the content later.

I think that Tom, up there in comment 11, has a good solution. Why create a new class name when there’s a tag that does what you want: the strong or em tag would work well in a situation like this, it seems. You really are adding some emphasis to an item, in this case a border. Very appropriate for the task at hand.

There are some other sort-of-presentational class names hanging around my site, too. standalone is used when an image, or set of images, stands on its own, as opposed to illustrative images that are floated. The intent is presentational, though again, standalone doesn”t say exactly how the images stand alone. It just says that they do.

It seems that illustrative images are the exception here. How about class="illustrative" for the floated images, and leave the standalone images unclassed?