Welcome to Web Axe - Practical Web Accessibility Tips
Hello and welcome to Web Axe. This is your host Dennis and this is episode 4 - quick but important tips. I'll be covering four different topics today: just real briefly, for four short but I feel pretty important programming techniques for web accessibility.
The first one is text links, and you will see on the web it will say 'click here' and have the 'click here' hyperlinked, which is a big no-no. If you've been doing web programming for a while you probably already know this but another reason not to do this is accessibility. And the reason why for accessibility - besides usability and it being bad practise - but for accessibility if there is a user using a screen reader or some kind of special device then there will most likely be a tool where the user can view all the links on the web page that they are currently at. So, if they're viewing the links and it says click here, then they are obviously not going to know where that link goes to. So it's much much better, say the link says 'click here' to view the map to my store', well it's much better practise for the link to say 'map to my store' and just hyperlink that whole phrase. Then, if the link is viewed out of context, it is really easy to tell where that link goes.
Okay, so the next topic we'll talk about is heading tags and there's many many reasons why you should have proper use of header tags in your HTML - H1, H2, H3 - but another reason is for accessibility. And the reason is similar to the text link reason - there are tools for people with different user agents where the user can view the structure of the web page. So if you've got a really long web page with a lot of content and a lot of text, instead of having to read through - or listen through - the whole web page, the user can view the structure of the document by the heading tags, so that he or she can just jump to the portion of the page that he or she wants to listen to, thereby making it much more user friendly and accessible.
The next quick link for today is close links on popups which is a pretty straightforward item. It's basically saying if you open a popup window, at the end of the content in the popup window, you should just add a close link on there at the end of the content, which makes it more quick and easy for the user to know that they're at the end of the file and to close the window. And that goes for fully enabled people as well as people using screen-readers or whatnot. Another side note on that - it's another whole other topic in itself - is opening a popup window. Technically there are a lot of different things involved in that as you may know, but at the minimum I'd just like to say that if you're opening windows - and some people think that's a terrible idea to begin with - but if you open a popup window make sure you tell the user one way or another that they are going to open another window, either by just text in front of the hyperlink, or maybe in the title tag of the hyperlink, or maybe just at the beginning of your website.
The last topic I'd like to discuss is dropdown menu links. So, when you come to a web page, many times you'll see a select form element, you know, a drop down menu and when you select something all of a sudden it just shoots you over to whatever page it's linked to. And personally this bugs me - as far as usability goes, it's not very good, and as far as accessibility goes, this isn't very good either. And it just has to do with the user being in control, and knowing what's going on on the web page so that they don't get confused or get lost and it kind of is similar to the popup window issue also. But if you look at the web accessibility guidelines, check out checkpoint 7.4 or 7.5 and 10.1, which will cover this issue. So in order to correct this problem for your dropdown menu all you need to do is just add a submit button, or a go button, or however you want to label it, and so once you make the selection, the user just then has the control, and press that button and then be taken to the link that he or she has chosen. And another little point I'd like to make about that is, the reason why I don't think doing it the other way is very good is because if you select something, say it opens a window with the selection, and then you close the window and in the dropdown menu the selection is still there. Well what if you wanted to open it again? You'd have to change your selection, close another window and then change your selection back so it's just a big miss. So please, just put a submit, or a go button or something, next to your dropdown menu for links and everyone will be happy.
All right, so that's it for episode 4 of Web Axe, this is Dennis signing off, please leave any comments to questions, or suggestions you may have for my podcast, and you can do that by going to WebAxe.blogspot.com. Thanks. See you next time.
Visit Web Axe at Web Axe.blogspot.com. Grab your RSS or ATOM feed here. You can also leave a comment or send Dennis an email.