Semantics & Semantic Design Goals

Reading an often linked blogticle (yes I made that word up, it means blog article) on semantics, using the Lynx text browser, and a little bit of thinking about web design in my head made me ponder on a few topics.

First, while I was making this blog a couple months ago, I had already had much knowledge of XHTML, CSS, web standards, and semantics of it all. Well actually I thought I had a lot of knowledge on it all. First of all, I made this site mostly with the look of it in mind first and foremost. I now know this is the wrong way to go; I should have had design goals in mind from the beginning. I will talk more about these goals later on in this post.

The second topic I thought about is really a good question in my opinion. When should we use a class attribute to define something and when do we use an id attribute? There are obviously many answers to when you should use which, and I’m sure not everyone will agree with one answer. What I want to know, however, is if there is a widely agreed upon answer? Surely there’s one thing that you have to consider, id attributes can only appear once, while a class attribute can be repeated. But what about certain elements that you know won’t be repeated but isn’t really that important? Does such an element deserve it’s very own id attribute? I’ll leave you to ponder these questions, as I have not found an answer anywhere nor have I got one myself.

Now the last topic I have thought about started with me wanting to make my design stand out more. Call it a redesign if you want, call it a realignment if you wish, but I do not think my design is anything special. But I digress, the main point I wanted to talk about was this need of mine to redesign, with the reading on semantics and the using of Lynx on websites, made me think about my need to make definite, but flexible, design goals. Flexible because I don’t know the extent of what I can achieve yet. Definite because I’ve been making it up as I coded so far. And without further ado, here are my design goals for this blog:

* It has to be easy to read in Lynx. So content must be near the top of the page.
* It has to look nearly the same in all the modern browsers. So I guess IE5.5/Win is out.
* It has to be more than just “yet another blog theme” look.
* Final goal for now, it will be designed with higher resolutions in mind.

I will surely be adding to these goals in the future, but for now these four cover most of what I think is most important.

  • Martin

    Simple. I’m using classes for elements I know I have lots of – like for an article list (.article). For everything else I use the ID.

  • Robb Ting

    Yes repeated items have to use class attributes. What I mean though is for example menu items: if you have more than one menu list aren’t they semantically the same thing, even if visually you want them to be different? Should you use one class for both, or one id for each, or one class for both and one id for each?

    If you think about it, even if you don’t show the lists differently visually, you’d like the option to do so. However, is it really semantically correct to separate them into different id attributes just so you can style them with CSS? A menu list is always a menu list when you describe it, no matter if it’s in the header, footer, sidebar, or anywhere else. Would an id="sidemenu" really be a correct description when it won’t be a “sidemenu” when you view it in a text browser or without CSS turned on? And this is just one example I thought of off the top of my head right now.