Forum Moderators: open

Message Too Old, No Replies

Conveying relative importance using semantically-correct HTML

Headings only go up to 6 ;)

         

Receptional Andy

9:37 pm on Mar 4, 2008 (gmt 0)



I'll prefix this post by pointing out that this is as much a theoretical question as anything - I'm not interested in any SEO benefit or any of that kind of thing.

Let's say I have twenty short items of text. I want to list these in a way that conveys their relative (and descending) importance.

If I had six items, I'd be sorely tempted to using heading tags, but both the HTML and XHTML specifications only allow for a maximum of six headings. Maybe I should just keep increasing the number anyway, and see how browsers fall over ;)

I could use an ordered list, but I'm unsure about that. To me this implies sequence more than importance (like a recipe). But perhaps it's the most logical option.

Of course, I can also convey this visually, the most simplistic example being font sizes relative to importance. Sometimes I forget that it's HTML that inherited semantics from visual appearance, not the other way round ;)

I suppose the closest 'real world' example of what I'm talking about would be a tag cloud, although it's somewhat different. But while there's lots to read about showing those tags 'semantically' I haven't seen anything about how HTML could also help to convey a similar thing. So, if it helps anyone, I could just rephrase the question to "how to markup a tag cloud?"

Fotiman

3:28 pm on Mar 5, 2008 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



A "tag cloud" is typically listed in alphabetical order, with the importance shown by size and/or color. This is not what you asked for originally. You said that you want to convey relative importance in a descending order, which is not the same as a tag cloud.

If you want to convey importance in descending order, then I would say an ordered list makes the most semantic sense.

mattur

4:11 pm on Mar 5, 2008 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Ordered list or paragraphs imho. Headings are for headings - clue is in the name ;)

For any content that does not fit the (very) limited "document semantics" HTML offers, there's no such thing as semantically correct. I suppose you could do twenty-level repeating <em>'s or <strong>'s but what's the point of shoehorning in spurious semantics of no use to anyone? Just use the most effective (ie shortest) markup for your formatting needs, or actually markup the "importance" data.

Fotiman

7:29 pm on Mar 5, 2008 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



I wouldn't use paragraphs, as semantically that's not what you're marking up. A single word (in a tag cloud) does not make a paragraph.

mattur

8:17 pm on Mar 5, 2008 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



"Short items of text" sounds like paragraphs, but you're right, I wouldn't markup single words as paragraphs either.

Xapti

3:17 pm on Mar 7, 2008 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Ordered list sounds like a good idea, assuming you have no problems with ordering it linearly like that with no elements getting the same "value".

I don't think there's a microformat for this kind of thing, but it might be good to look up, if you care about that stuff.

jimbeetle

4:12 pm on Mar 7, 2008 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



I suppose the closest 'real world' example of what I'm talking about would be a tag cloud

I don't think I'd consider that a "real world" example, have never seen one in a textbook, tech paper, newspaper, etc. Plus, as far as I know tag clouds are simply visual representations; not sure how they sound through a screen reader (and not sure I'd like to hear one) ;-).

And ordered list would be my only semantically correct choice in the real world; in our world it has the advantages of conveying the same semantic meaning by both visual browsers and screen readers.

Receptional Andy

7:47 pm on Mar 7, 2008 (gmt 0)



I don't think I'd consider that a "real world" example

Hey, there're moving parts at the end of the day, Jim. I didn't just dream it ;)

Thanks everyone for the comments. I think I'll go with an ordered list and see how that pans out.

On a side note, I'm no designer really, but I've found the cues from "visual semantics" to be very helpful. So, if I can pick code that is already along the right lines the whole design/development process is much easier (headings are an obvious example, fieldset/legend might be even better).

Headings are for headings - clue is in the name

But this is the problem with my theoretical use - headings are not too far off my intention, although it would be something of an adaptation of the 'real' meaning.

[edited by: Receptional_Andy at 7:50 pm (utc) on Mar. 7, 2008]

g1smd

7:56 pm on Mar 7, 2008 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



Are you saying there are 20 levels of importance to that information?

Receptional Andy

8:07 pm on Mar 7, 2008 (gmt 0)



Are you saying there are 20 levels of importance to that information?

Perhaps more. But I'm not making a page in the traditional sense. I'm being all experimental ;)

chriswo

12:22 am on Mar 9, 2008 (gmt 0)

10+ Year Member



Have you seen how dated to-do's are displayed in 37Signal's Backpack? I think they are unordered lists, with different styles on the LI's. Upcoming items are darker/bigger/bolder, and they gradually fade to gray as you go down the list.