Re: [WSG] Semantics, lists and links
Hi Ellen A list is semantically correct. It also has advantages for screen reader users as they can navigate lists with a simple key combination. Glen On Sat, Aug 28, 2010 at 2:33 AM, wsg@webstandardsgroup.org wrote: * WEB STANDARDS GROUP MAIL LIST DIGEST * From: Ellen Herzfeld s...@xlii.org Date: Thu, 26 Aug 2010 18:35:03 +0200 Subject: Semantics, lists and links Hello, I have been, since forever, using unordered lists to mark up navigation links. This seems to be the standard recommended method used by all the people in the know. Depending on the situation, the list will be styled vertically or horizontally. No problem there. However, when CSS is disabled (or when no stylesheet is served for old old browsers), all these links appear as vertical lists with bullets. A screen reader will, I suppose, pronounce bullet every time before every item as shown in Fangs. Now, this is not an issue when the list is four or five items long, but when it gets to ten items or more, I find the long vertical list to be obstrusive. I am working on a site that has a main navigation menu, styled inline, near the top with ten links to the ten major parts of the site. And in one section of the site, all the pages also have have a second horizontal navigation menu with the twenty six letters of the alphabet. Without CSS, this makes for a very long, very narrow, list of links that you have to scroll past to get to the meat of the page. Yes, I do have a skip navigation and go to content menu at the very top, but still, I have a problem with this. An alternative solution is to put all the links in a nav with no list (I'm using html5 elements). The links will then appear on one line when CSS is disabled. I'm not sure yet if a p in the nav would be necessary for old browsers. The items can be separated by a non-breaking space for readability. I am trying to apply best practices and make my markup as semantically correct as possible so I have some questions: Is there a compelling reason to keep the lists? Would the markup be dramatically unsemantic without them? What do you people think? Thanks, Ellen * From: Ted Drake tdr...@yahoo-inc.com Date: Thu, 26 Aug 2010 12:05:18 -0500 Subject: RE: [WSG] Semantics, lists and links A screen reader will not say bullet. It will, however grab that list and ad d it to a secondary navigation tool for the page. Screen reader users are a ble to see all of the lists on a page, as well as all headers. They can the n skip directly to the items they are interested in. So use your lists and headers. It's good stuff. You can also add Aria roles to the list: ul role=main. Ted -Original Message- From: li...@webstandardsgroup.org [mailto:li...@webstandardsgroup.org] On B ehalf Of Ellen Herzfeld Sent: Thursday, August 26, 2010 9:35 AM To: wsg@webstandardsgroup.org Subject: [WSG] Semantics, lists and links Hello, I have been, since forever, using unordered lists to mark up navigation lin ks. This seems to be the standard recommended method used by all the peop le in the know. Depending on the situation, the list will be styled vertica lly or horizontally. No problem there. However, when CSS is disabled (or when no stylesheet is served for old old browsers), all these links appear as vertical lists with bullets. A screen reader will, I suppose, pronounce bullet every time before every item as shown in Fangs. Now, this is not an issue when the list is four or five items long, but whe n it gets to ten items or more, I find the long vertical list to be obstrus ive. I am working on a site that has a main navigation menu, styled inline, near the top with ten links to the ten major parts of the site. And in one section of the site, all the pages also have have a second horiz ontal navigation menu with the twenty six letters of the alphabet. Without CSS, this makes for a very long, very narrow, list of links that yo u have to scroll past to get to the meat of the page. Yes, I do have a ski p navigation and go to content menu at the very top, but still, I have a problem with this. An alternative solution is to put all the links in a nav with no list (I' m using html5 elements). The links will then appear on one line when CSS is disabled. I'm not sure yet if a p in the nav would be necessary for ol d browsers. The items can be separated by a non-breaking space for readability. I am trying to apply best practices and make my markup as semantically co rrect as possible so I have some questions: Is there a compelling reason to keep the lists? Would the markup be dramatically unsemantic without them? What do you people think? Thanks, Ellen
[WSG] Semantics, lists and links
Hello, I have been, since forever, using unordered lists to mark up navigation links. This seems to be the standard recommended method used by all the people in the know. Depending on the situation, the list will be styled vertically or horizontally. No problem there. However, when CSS is disabled (or when no stylesheet is served for old old browsers), all these links appear as vertical lists with bullets. A screen reader will, I suppose, pronounce bullet every time before every item as shown in Fangs. Now, this is not an issue when the list is four or five items long, but when it gets to ten items or more, I find the long vertical list to be obstrusive. I am working on a site that has a main navigation menu, styled inline, near the top with ten links to the ten major parts of the site. And in one section of the site, all the pages also have have a second horizontal navigation menu with the twenty six letters of the alphabet. Without CSS, this makes for a very long, very narrow, list of links that you have to scroll past to get to the meat of the page. Yes, I do have a skip navigation and go to content menu at the very top, but still, I have a problem with this. An alternative solution is to put all the links in a nav with no list (I'm using html5 elements). The links will then appear on one line when CSS is disabled. I'm not sure yet if a p in the nav would be necessary for old browsers. The items can be separated by a non-breaking space for readability. I am trying to apply best practices and make my markup as semantically correct as possible so I have some questions: Is there a compelling reason to keep the lists? Would the markup be dramatically unsemantic without them? What do you people think? Thanks, Ellen *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
RE: [WSG] Semantics, lists and links
A screen reader will not say bullet. It will, however grab that list and add it to a secondary navigation tool for the page. Screen reader users are able to see all of the lists on a page, as well as all headers. They can then skip directly to the items they are interested in. So use your lists and headers. It's good stuff. You can also add Aria roles to the list: ul role=main. Ted -Original Message- From: li...@webstandardsgroup.org [mailto:li...@webstandardsgroup.org] On Behalf Of Ellen Herzfeld Sent: Thursday, August 26, 2010 9:35 AM To: wsg@webstandardsgroup.org Subject: [WSG] Semantics, lists and links Hello, I have been, since forever, using unordered lists to mark up navigation links. This seems to be the standard recommended method used by all the people in the know. Depending on the situation, the list will be styled vertically or horizontally. No problem there. However, when CSS is disabled (or when no stylesheet is served for old old browsers), all these links appear as vertical lists with bullets. A screen reader will, I suppose, pronounce bullet every time before every item as shown in Fangs. Now, this is not an issue when the list is four or five items long, but when it gets to ten items or more, I find the long vertical list to be obstrusive. I am working on a site that has a main navigation menu, styled inline, near the top with ten links to the ten major parts of the site. And in one section of the site, all the pages also have have a second horizontal navigation menu with the twenty six letters of the alphabet. Without CSS, this makes for a very long, very narrow, list of links that you have to scroll past to get to the meat of the page. Yes, I do have a skip navigation and go to content menu at the very top, but still, I have a problem with this. An alternative solution is to put all the links in a nav with no list (I'm using html5 elements). The links will then appear on one line when CSS is disabled. I'm not sure yet if a p in the nav would be necessary for old browsers. The items can be separated by a non-breaking space for readability. I am trying to apply best practices and make my markup as semantically correct as possible so I have some questions: Is there a compelling reason to keep the lists? Would the markup be dramatically unsemantic without them? What do you people think? Thanks, Ellen *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org *** *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
Re: [WSG] Semantics, lists and links
On 26 Aug 2010, at 17:35, Ellen Herzfeld wrote: An alternative solution is to put all the links in a nav with no list (I'm using html5 elements). The links will then appear on one line when CSS is disabled. Try it in Lynx (last stable release came out last year, newer development builds are available), you'll find it very difficult to tell the difference between white space between links and white space inside links. i.e. the only way to tell where one link ends and the next begins will be to step through them one at a time. As a sentence goes, it won't make a lot of sense either. I'm not sure yet if a p in the nav would be necessary for old browsers. A single link will rarely be an entire paragraph. Lists are the right choice here, other posts to this thread explain some of the ways that screen readers handle them. -- David Dorward http://dorward.me.uk *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
