Finnberry does Ed-Tech

In this post, I'm going to explain how I solved the problem of my photography portfolio not working with keyboard navigation. Previous/next buttons If I was navigating by keyboard, I would expect the next tab after the menu to take me to the previous and then the next buttons that sit half way up my photo. So I had a look at the html for those and this is what I found: <a class="prev" onclick="plusSlides(-1)">Prev</a> <a class="next" onclick="plusSlides(1)">Next</a> For those that don't speak fluent html, the <a> tag is what tells the internet browser that the text or image that follows is going to be a hyperlink.  Initially, I just saw that they begin with an <a> tag and thought that should be fine but I did notice that the <a> tags don't have an href element and that is odd. Maybe that is the problem. I wanted to be sure that this was the problem, so I googled it and found one of the top sol...

For this guideline, I am going to use my own website. I have been revamping my porfolio website to update it but also to provide more examples of my work and some better functionality. I recently updated my colour scheme and (obviously) checked that it all met WCAG guidelines.  The most recent piece of work, has been to develop some photography pages. These are organised by theme. Although I have ensured that all of the prior content meets WCAG guidelines, I have just checked the photography pages and they fail this guideline.  Keyboard Guideline All functionality of the content is operable through a keyboard interface without requiring specific timings for individual keystrokes, except where the underlying function requires input that depends on the path of the user's movement and not just the endpoints. So, if you visit one of my photography pages and try to tab through, using the keyboard, you will soon spot the problem. You will notice that as you hit the TAB key, the dif...

 I have skipped the last few in the previous section because they were mainly to do with HTML and CSS issues, which the vast majority of people don't work with... unless they are developers, in which case, they should be able to read the guidance and put it into practice themselves. So I have jumped to the next section, section 2, which is about operability . Basically, all user interface components and navigation must be operable - be able to be used. The first guidelines in this section address keyboard navigation. All functionality should be achieveable by keyboard only. That means... unplug your mouse and check that you can still use whatever it is you have designed. Challenge Before we start delving into the specifics of this one, I would like to challenge you to live for a day or two without your mouse. Unlug it! Put it in the drawer. Do everything with your keyboard. Why is this important? Because you will begin to understand some of the challenges of keyboard navigation. Yo...