Loyd Grossman Accessibility Problems

13th March 2005 · Last updated: 5th October 2016

Having enjoyed a plate of pasta tonight topped with Loyd Grossman's delicious Tomato & Basil Sauce, I noted the text on the jar mentioned a pizza recipe was available via Loyd's official website. I found the recipe, but couldn't help noticing what an accessibility disaster the site appeared to be. Before I go any further I'd like to point out that in no way do I wish to discredit the fine sauces and other products sold in the Loyd Grossman range. If only his site was as good as the sauce I tried tonight! But mistakes are bad for any site, so I feel I should point out the ones I have noticed. If they seem minor to you, remember that not only is it UK Law to make your business site "accessible", but visitors will benefit as well, especially those using a screenreader, such as blind users. Or indeed anyone who isn't able to load all the graphics due to a slow connection, or who has them turned off.

The mistakes below are all easy to fix, so it's a shame that they are there. Otherwise, it's an interesting site with a lot to see, including videos of some recipes. (I've printed out several of the text recipes to try out later!) Anyway, here's the list of the problems I found:

  • Missing ALT text.
  • Wrong ALT text:
    • The image for "Loyd's Top Tips" in the menu has the ALT text "Loyd's Month".
    • "Seasonal Recipes" on the Recipes page has the ALT text "New Recipe Book".
    • On the front page "Seasonal Recipes" has the ALT text "What's New?", but that's the next header, so the text is repeated twice.
    • "Message Board" in the menu has ALT text that says "Our Advocates". What the?!
  • List arrows on the Recipes page have ALT text that says "Image".
  • There's a mysterious blank image in the top-left corner of some pages that has the ALT text "Image".
  • What's with the text under "Recipe Ideas" on the front page? It has an image in a sentence, which adds "Image" to the words (when images are turned off). The sentence reads "Click here for some great recipe ideas which are simple to prepare but taste delicious, including some of my own ("Image") favourites". (Sites should also avoid using "Click here", as it makes no sense without a mouse, nor to blind users who have the text read out by a machine.)
  • The ALT text for the header at the top reads "Original Loyd Grossman Recipes" (even though the image only says "Loyd Grossman"). Unfortunately, the text colour is black on a black background, so it's not visible unless page colours are removed.
  • Visited links don't appear in a different colour. So you have to scan the list of recipes again to see where you were. This slowed me down quite a bit.
  • Recipes open in a pop-up window. This means no browser buttons, such as Print. (There is a "Print" option on screen though.)
  • On the recipe pages themselves, simple bold text is created by using images. Why not use actual bold text using standard HTML? This means the text cannot be enlarged in browsers like Firefox. The text also looks fuzzy when printed out. (Naturally, the printer isn't able to use its built-in fonts.)
  • The image on the recipe for Primavera Risotto with Panfried Salmon and Rocket suffers from visual lines. That's because it's not being shown at the actual size, which is smaller. Not an accessibility problem, but it looks bad.
  • The links on the Authenticity and Cooking Techniques pages aren't underlined, nor does the cursor change to a hand when over them. It looks like they are just normal text, but click on them and they really are links!

There are many other tiny mistakes to be found, like "email" spelled in two different ways, links wrongly coloured, inconsistent font sizes, and so on. See how many mistakes you can spot.