0

I decided to get completely rid of all ids in my CSS and in addition to that I want to begin transition to HTML 5.

Old Markup where .sidebar is the selector for both sidebars and the ID's are uses to style the sidebars individually

<div id="sidebar" class="sidebar widget-area"></div>
<div id="sidebar-alt" class="sidebar widget-area"></div>

now this is what I would do in html 4 and I am NOT under the impression that ID's are obsolete in HTML5 please to not upvote this comment I would have done the same in html 4

<div class="sidebar sidebar-primary widget-area"></div>
<div class="sidebar sidebar-secondary widget-area"></div>

My question is now about the role attribute. Is this basically a made up value? Has it or might have some real meaning in the future?

Solution 1 Where .sidebar stays the selector for both sidebars and I would uses aside[role="..."] to style the sidebars individually

<aside role="sidebar-primary" class="sidebar widget-area"></aside>
<aside role="sidebar-secondary" class="sidebar widget-area"></aside>

Solution 2 Or should I better give both sidebars the same role and use the role selector for common styles?

<aside role="sidebar" class="sidebar-primary widget-area"></aside>
<aside role="sidebar" class="sidebar-secondary widget-area"></aside>

I am not that into HTML 5 yet and I like to get some Opinions what might be better with in depth explanation if possible.

After looking at the WTC list of roles the "sidebar" role seems not to be defined and after thing about it both solutions (1+2) might be bad

Solution 3 The "complementary" role is defined as a role by W3C so this might be a better way to do it? I am still curious why people come up with role="sidebar" then and what sense does it make to just "invent" roles? If its for CSS they should uses classes to style or not?

<aside role="complementary" class="sidebar-primary widget-area"></aside>
<aside role="complementary" class="sidebar-secondary widget-area"></aside>
Mukul Kant
  • 7,074
  • 5
  • 38
  • 53
James Mitch
  • 519
  • 2
  • 11
  • 26

1 Answers1

5

role is not made up

stephenmurdoch
  • 34,024
  • 29
  • 114
  • 189
  • Yes. You may want to include a summary on how roles work, to give the links a little more context. – BoltClock Jul 12 '12 at 06:51
  • 1
    Thx, i know i can style them as you can read in the question, i also know that they are not all made up, i should have been more specific. but when i search for "sidebar" on [-this-](http://www.webteacher.ws/2010/10/14/aria-roles-101/) and [-this-](http://www.w3.org/TR/wai-aria/roles) list i found nothing. So "sidebar" seems not to be a existing role. Anyway roles seem to have a lot more predefined values then i taught thx for the links. SO what about roles that are not predefined? Can we just make them up? Does it makes sense to do so? I guess not? Where to find the Sidebar role? – James Mitch Jul 12 '12 at 07:10