Skip to main content

Jim Byrne Accessible Website Design Glasgow for The Third Sector, Voluntary, Charities and Not for Profits

Accessible, Responsive Website Design
Jim Byrne Web Designer

Accessibility consultancy – what is it and why do you need it?

Ensuring that your online content is accessible isn’t merely a legal obligation—it’s a reflection of your dedication to inclusivity and your forward thinking. As an experienced accessibility consultant, I provide custom solutions to guide you through the intricacies of digital accessibility, offering everything from comprehensive audits to straightforward practical advice. In this short article, I explain what digital accessibility is, why you need it, and how to get started.

What is digital accessibility?

Digital accessibility is about crafting online spaces – and content delivered via computer interfaces – where everyone, regardless of their abilities can engage with the content. For example, for your website, it means ensuring every aspect is welcoming and accessible to visitors, whether they are using a screen reader, navigating with a keyboard, or facing other challenges.

The essence of digital accessibility—in the wider sense—means designing and developing digital content in a way that breaks down barriers and opens up avenues of access for everyone. This is done by ensuring the format of content is designed to be flexible, i.e., it can change to fit the needs of the individual, not the other way around. We don’t force the individual to change to fit with the way we present our content.

For example, when digital content is accessible, it will be possible for a blind person, using a screen reader, to have your content read out to them, including descriptions of any image or photographs on the page. And those descriptions will be equivalent to the function the image or photograph plays for sighted visitors.

When we talk about digital accessibility, we’re not just talking about ticking boxes or meeting legal requirements (although that’s important too!). We’re talking about fostering a digital world where everyone feels included, empowered, and able to fully participate in the online experience.

Accessibility – what’s in it for you?

First and foremost, there’s the matter of reputation. By prioritising digital accessibility, you’re not just showing the world that you care about inclusivity—you’re also demonstrating your commitment to excellence. You are telling your audience, your customers, your partners, and your competitors that you mean business when it comes to inclusion and equality.

Accessibility and the law

Then, there’s the matter of legal compliance. In many jurisdictions, digital accessibility isn’t just a suggestion—it’s the law. By ensuring your content meets accessibility standards, you’re not just avoiding potential legal headaches down the road—you’re also safeguarding your brand’s reputation and integrity. In the UK that means complying with The Equality Act 2010.

Accessibility pays

By reaching a wider audience, you’re opening up new revenue streams, tapping into markets you might have overlooked, and ultimately, boosting your bottom line. If you are a charity, a non-profit, or a public sector organisation you are getting your message out to more of your potential audience.

When you prioritise accessibility, you’re also opening the door to new ideas and possibilities. You are flexing your creative muscles, pushing the boundaries of what’s possible, and ultimately, setting yourself apart from your competition.

So, in a nutshell, the advantages of digital accessibility for content producers are clear: enhanced reputation, legal compliance, increased audience and/or revenue opportunities, and a boost to innovation. It’s a win for you and for those who consume your content and services.

How do you ensure your content is accessible?

One of the first things you can do is to assess where you are right now, i.e., find out how accessible your current digital content is. A good way to do that is to commission an accessibility audit. For example, if you have a website and you want to know if it is accessible, an accessibility auditor can check it against the de facto standards that are used by governments across the world, i.e., the WCAG 2.1. (and WCAG 2.2 when it is adopted by governments).

Accessibility consultancy: take advantage of my decades of expertise and experience

WCAG stands for Web Content Accessibility Guidelines. These are the guidelines published by the W3C. You will be reassured to know, that I provided feedback on version two of the guidelines, in my previous role as Director of the Guide of Accessible Website Designers. I have detailed knowledge that I can put to good use when assessing the accessibility of websites and other digital content, including PDFs and MS Word documents, videos, and dynamic content. I have been working in the area of accessible website design since 1996, written multiple books on the subject, creating training courses (check out my bestselling WCAG 2 Accessibility online course) and given advice to 100s of organisations. I’ve also got over 20 years experience of building websites – so I understand the problems you meet and need to solve.

A Website Accessibility Audit example: what does a website access audit consist of?

A WCAG 2.2 AA accessibility audit

I WCAG 2.2 audit of your website tests it against 56 WCAG A & AA checkpoints on a variety of different platforms (including mobile and tablet), using a variety of accessibility tools (e.g., screen reader, keyboard, magnifier, colour contrast changers) and different browsers. Both automated and manual testing are used as part of the audit.

My website audits include feedback from disabled people

When I carry out an accessibility audit I ask two of my disabled colleagues will give feedback on the accessibility of your website. John Turley is blind and uses a screen reader on both his mobile phone and laptop; Ruby Shah has a visual impairment and uses a variety of accessibility tools including a screen magnifier and contrast changer. They will also test the site to ensure that it is keyboard-only accessible.

You get a detailed report including:

  • An executive summary, highlighting the most important issue to fix.
  • A table showing the percentages of checkpoints that have passed failed, or are not applicable (N/A).
  • A list of all relevant checkpoints with notes relating to any issues found and suggested fixes.
  • A full checkpoint summary table showing whether each has passed, failed, or is N/A
  • The full unedited notes from my disabled colleagues. I provide unedited notes because they will give you a good sense of how a disabled person interacts with your website content. Relevant parts of these notes are also incorporated into the checkpoint notes.

The length of the report can vary depending on the size of the website, the amount of issues found, and their complexity.

An accessibility consultancy service designed to help you

An accessibility audit is your first step to ensuring you are complying with relevant equality laws and reach more poeple with your content and your message.

“We requested a root-and-branch evaluation of our website to help inform its development, and in a short space of time Jim and his fantastic team put together an incredibly comprehensive report that fulfilled every aspect of our brief. He was able to identify specific instances of non-compliance, as well as highlight recurring themes and issues and make recommendations to ensure that our web presence not only complies with WCAG AA standards but is fully optimised for usability. Moreover, the first-hand feedback from his auditors provided invaluable insight into the UX of users with disabilities. I’d be delighted to recommend Jim and his colleagues to anyone looking to make their web presence accessible to the widest possible audience.”

Alex Norton (Communications Manager, CLOSER)

Contact me today to discuss your accessibility needs. I provide accessibility advice and support as well as practical services such as website and document accessibility auditing.


Web Content Accessibility Guidelines 2 (WCAG 2) Defining the principles: translating from WCAG Speak to Jim Speak

Defining the principles: Web Content Accessibility Guidelines 2 (WCAG 2)

This short article will set out the basic ideas underlying the World Wide Web Consortium’s Web Content Accessibility Guidelines 2 (WCAG 2).

The shortest possible summary of the guidelines:

The WCAG 2 guidelines are based on four principles: all content must be Perceivable, Operable, Understandable, and Robust.

  • For each principle there are guidelines.
  • For each guideline, there are testable ‘success criteria’.
  • For each guideline and success criterion, there are related techniques.

Ok, if you are anything like me, that’s about as clear as mud. So to understand it, let’s start by defining what some of these words/principles mean; which we can do by translating them from WCAG speak to the much simpler, Jim speak.

Part 1: Defining the principles

Perceivable

WCAG speak: Information and user interface components must be presentable to users in ways they can perceive.

Jim speak: The site visitor must be able to recognise that the content exists. For example, by being able to see it, hear it, or touch it (e.g. being presented as raised dots for a braille user).

Operable

WCAG speak: User interface components and navigation must be operable.

Jim speak: The site visitor must be able to navigate around the site and use the features and functions presented.

Understandable

WCAG speak: It should be easy to understand page content and easy to use the website.

Jim speak: Not only should visitors be able to recognise the existence of the content and be able to interact with it, but they must also be able to understand it.

Robust

WCAG speak: Content must be robust enough that it can be interpreted reliably by a wide variety of user agents, including assistive technologies.

Jim speak: It must be possible to access the content using everything from a text-only web browser to the latest Firefox browser. And everything in between, including screen readers and all the different brands and versions of browsers now available

Success criteria – what does that mean?

‘Success criteria’, may not be a phrase that most people will be familiar with; however it is an idea at the heart of WCAG 2 – so we need to figure out what it means.

WCAG speak: For each principle there are guidelines. For each guideline, there are testable ‘success criteria’.

Jim speak: There are things you will need to check to assess whether your website is accessible or not.

Accessible Website Design Glasgow (AWDG)

Providing accessible Internet services, including accessible web design, website accessibility auditing, website accessibility training, online training, web development, mobile web development and social media integration.

Get in touch if you would like to discuss your latest project ideas.

    How can I help you?



    Call now to chat about your new website: 07810 098 119.


    WCAG 2.1 Guidelines Explained

    A history lesson: where did the website accessibility guidelines come from and what’s in them?

    • 1995: The first web accessibility guidelines were compiled by Gregg Vanderheiden shortly after the 1995 Chicago WWW II Conference.
    • 1998: University of Wisconsin–Madison compiled the Unified Web Site Accessibility Guidelines.
    • 1999: they formed the basis for WCAG 1.0.

    WCAG 1.0. were focused on HTML and web pages.

    • 14 guidelines.
    • 65 checkpoints.
    • Each with a priority level: A, AA. AAA.

    A Compliance: the guidelines must be satisfied otherwise it will be impossible for one or more groups to access the Web content.

    AA Compliance: should be satisfied, otherwise some groups will find it difficult to access the Web content.

    AAA Compliance: may be satisfied: to make it easier for some groups to access the Web content.

    14 WCAG 1 Guidelines

    • Guideline 1: Provide equivalent alternatives to auditory and visual content.
    • Guideline 2: Don’t rely on colour alone.
    • Guideline 3: Use markup and style sheets, and do so properly.
    • Guideline 4: Clarify natural language usage.
    • Guideline 5: Create tables that transform gracefully.
    • Guideline 6: Ensure that pages featuring new technologies transform gracefully.
    • Guideline 7: Ensure user control of time-sensitive content changes.
    • Guideline 8: Ensure direct accessibility of embedded user interfaces.
    • Guideline 9: Design for device independence.
    • Guideline 10: Use interim solutions.
    • Guideline 11: Use W3C technologies and guidelines.
    • Guideline 12: Provide context and orientation information.
    • Guideline 13: Provide clear navigation mechanisms.
    • Guideline 14: Ensure that documents are clear and simple.

    WCAG 2 – Published 2008

    Not just websites, but also PDF, Google Docs, Spreadsheets, e-Books… and other ‘digital assets’.

    WCAG 2.1 – Published 2018

    • WCAG 2.1 does not deprecate or supersede WCAG 2.0.
    • The differences between WCAG 2.0 and 2.1 are mostly related to the use of tablets and mobile devices.
    • They are designed to make content more accessible to a wider range of people, including accommodations for blindness and low vision.

    WCAG 2.1 Based on 4 Principles

    • Perceivable.
    • Operable.
    • Understandable.
    • Robust

    What principles?

    • Perceivable?
    • Operable?
    • Understandable?
    • Robust?

    What do the principles mean?

    Perceivable

    WCAG speak: information and user interface components must be presentable to users in ways they can perceive.

    Jim speak: the site visitor must be able to recognise that the content exists. For example, by being able to see it, hear it or touch it.

    Operable

    • WCAG speak: user interface components and navigation must be operable.
    • Jim speak: the site visitor must be able to navigate around the site and use the features and functions presented.

    Understandable

    • WCAG speak: information and the operation of user interfaces must be understandable.
    • Jim speak: not only should visitors be able to recognise the existence of the content and be able to interact with it, but they must also be able to understand it.

    Robust

    • WCAG speak: content must be robust enough that it can be interpreted reliably by a wide variety of user agents, including assistive technologies.
    • Jim speak: it must be possible to access the content using everything from a text-only web browser to the latest Firefox browser. And everything in between, including screen readers and all the different brands and versions of browsers now available.

    Each Principle Has A Set Of Guidelines

    1. Perceivable: the guidelines relate to:

    • Text alternatives for non-text content.
    • Captions and other alternatives for multimedia.
    • Content can be presented in different ways, including by assistive technologies, without losing meaning.

    Operable: the guideline Relate To:

    • Ensuring functionality is available for keyboard users.
    • Giving users enough time to read and use content.
    • Avoiding content that causes seizures or physical reactions.
    • Help users navigate and find content.
    • Making it easier to use inputs other than by keyboard.

    Understandable: the guideline Relate To:

    • Make text readable and understandable.
    • Make content appear and operate in predictable ways.
    • Help users avoid and correct mistakes.

    Robust: the guideline Relate To:

    • Maximising compatibility with current and future user tools.
    • For example, by using valid code.

    For Each Principle

    There are guidelines – these are the basic goals that authors should work toward in order to make content more accessible.

    And For Each Guideline

    Ther are ‘testable success criteria’.

    • Three levels of conformance are defined as: A (lowest), AA, and AAA (highest).
    • Techniques and examples are provided for meeting those criteria.

    Mobile Platforms

    • All ‘success criteria’ apply to mobile platforms as well as desktop platforms.
    • However, the techniques sections does not yet fully cover mobile techniques.

    Jim Byrne


    A note on the Arial font and accessibility

    Arial is a sans serif typeface, designed in 1982, based on Monotype Grotesque. The font has a similar proportion and weight to Helvetica.

    It is a font with a contemporary look. Since 1992 it has shipped with every version of Microsoft Windows, which has helped it become ubiquitous.

    It is a favourite of desktop publishers, though less so with designers; who think it inferior to Helvetica. The story goes, that it was designed primarily to avoid having to pay royalties (to Linotype) for the use of Helvetica.

    It is rarely recommended for print work (though it is a print font). Helvetica is considered a better-looking, more flexible font.

    Arial and accessibility

    Arial is recommended by RNIB and other organisations concerned with accessibility. If you search for guidelines for document accessibility they all tend to say, use Arial, with a minimum size of of 14pt.

    However, I am not aware of any research that shows Arial to a better font than similar sans serif fonts. I think it’s more likely that it was the sheer ubiquity of this sans-serif font that led to the recommendation.

    There are similar contemporary-looking, clean and easy-to-read fonts that would do the job just as well. I.e. Calibri, Century Gothic, Helvetica, Tahoma, and Verdana or Myriad Pro.

    Note that all of the above fonts are sans serif. Serif fonts are rarely recommended – as more ornate fonts are considered more difficult to read. On lower resolution computer screens the serifs can be distorted, making the words look blurry.

    Slab serif Fonts

    Having said that, slab serif Fonts (a type of serif typeface characterized by thick, block-like serifs) such as Rockwell, Clarendon, and Museo Slab are considered easy to read and accessible. They tend to be used for headings rather than body text.

      How can I help you?



      Call now to chat about your new website, and accessibility check/audit or accessible web design training: 07810 098 119.

      Photo: “Pool of Knowledge” by Ian Muttoo is licensed under CC BY-SA 2.0


      Theory into practice; designing a flexible website is the key to accessible website design

      On my WCAG 2.1. training course, I outline why designing a flexible website is the key to accessible website design – by flexible I mean designing your site so that visitors can change it to suit their own needs.

      It’s a good approach for you because you don’t need to design a million different websites, e.g. one with big text for people with a visual impairment, another for people who are colour blind and yet another for people with motor impairments. You just need to design one website; one that can flex to accommodate a million different needs.

      I said that you should aim to, ‘divorce content from presentation’. Unfortunately, that can all sound a bit theoretical, so in this article, I will give you some practical examples of how that works in practice.

      Examples of flexible design

      1. For people using older browsers ensure you set font sizes using relative units (e.g. em units or percentages) rather than absolute units (e.g. pixels or ppints). If you use absolute font sizes visitors to your site using older browsers might not be able to resize the text to suit their needs.

      2. Ensure your website is ‘responsive‘, i.e. it reflows or resizes itself to work on all devices – no matter their size or shape. If your website is not responsive visitors may have to scroll left and right, to see all of your content or it may be unusable on smaller screens. I agree with the Bureau of Internet Accessibility who explain that making your website responsive is essential – but it is not the full story.

      3. Don’t use background images for important content. It is not possible to add text description (i.e. via the alt attribute) to background images. For a portion of your visitors, some of your content will be missing. For example, enabling high contrast mode in Mozilla’s Firefox automatically hides background images. It does this to ensure that all of the text on the page has the desired high contrast – with the background. If those background images have essential content in/on them – that content is gone for some visitors. The visitor is no longer getting equivalent content to those people using the default contrast.

      4. Ensure all links clearly describe their destination. Screen reader users can quickly navigate around a page by extracting all of the links – so I can quickly jump to the one I want. If the links are all called ‘click here’ or ‘more’ or ‘PDF download’ then they need to read the entire page to get the context for every link. The designer did not build in flexibility; they built-in a barrier that only became apparent when a screen reader user tried to access the site. Never turn off user scalability; this will make it difficult for visitors to resize the text.

      5. Similarly, a screen reader user can summarise headings on a page – to get a sense of how the content is organised. This will only be possible though if the content is organised in a logical way using appropriate headings, i.e. an h3 heading is used to indicate that the content of the headings is related to but subservient to the content in the preceding h2 heading. If there are five headings on a page and they are all marked up using h1 – visually they may look related – but as far as the screen reader (and access tools) are concerned – there is no logical order to any of them.

      6. Ensure your site is keyboard-friendly. Many assistive technologies rely on keyboard accessibility – not just screen reader users. For example, people who use mouth and head sticks and those who use adaptive keyboards.

      Try using your tab key to navigate your website. Check if any links are being missed, check that the links are in a logical order, check that there is a visual indication of the link you are on; one common method is to have the link outlined in a colour that contrasting colour. If there is no ‘focus indicator’ it is very easy to get lost when using a keyboard to navigate.


      Free Guide: How To Keep Your Website Accessible

      Non-profits need to ensure their websites are accessible. This jargon free guide will help.


      The ‘cast iron’ business case for accessible website design

      Just a quick follow up from my New Year Newsletter in which I gently encouraged you to think about your website and online marketing strategy. One area I mentioned in my newsletter was website accessibility. As I am sure you already know, it is considered a form of discrimination if disabled people are not able to access website content (the Equalities Act 2010). So with that in mind I thought I’d take the opportunity to look at the benefits of accessible website design from a slightly different perspective, i.e. the business case.

      The business case for accessible website design

      In September last year I spoke at the Accessibility Scotland conference and an audience member asked whether there was a ‘cast iron’ business case for making a website accessible? They were having trouble trying to get their managers to prioritise accessibility or put any resources into ensuring the website was accessible to disabled people. 

      ‘Off the top of my head’ I could not remember any statistics to quote, though I did mention the usual stuff about a more accessible site generating more traffic, being easier to use and having reduced maintenance costs.

      However, it seems that these logical arguments do not ‘cut any ice’ when it comes to making the case; what people want are facts, figures and case studies showing increased traffic and increased sales.

      So with that in mind here are three major case studies showing the benefits of accessible website design in real terms. 

      • CNET: there was a 30% increase in traffic from Google after CNET started providing transcripts (reported AST(.ppt) “We saw a significant increase in SEO referrals when we launched an HTML version of our site, the major component of which was our transcripts.” – Justin Eckhouse, CNET, 2009.
      • Legal & General Group: visitor numbers doubled, maintenance costs were cut by two thirds, natural search traffic increased by 50%. .
      • Tesco:  ‘the site now attracts a much wider audience, spending £13 million a year, which is a fraction of the original cost of £35,000 to develop the accessible site’ (John Browett, Tesco Chief Executive). Read the Tesco case study. (2004, UK).

      These case studies clearly show that an accessible website design reduces maintenance costs, increases usability and increases traffic. In short, accessible website design is good for your business.

      Web Accessibility Auditing Service :

      Even if you are not planning a brand new website from scratch I can help you realise some of the benefits outlined above by making your existing website more accessible. The first step in that process is to have your website audited to see if there are any aspects that are inaccessible to disabled peoples. You will then be in a position to have those issues addressed; thus increasing the accessibility and usability of your website.

      As an website accessibility auditor since 1996 I am one of the most experienced and skilled practitioners in the UK. I will check your site against the WCAG 2.0 guidelines to ensure that your site is compliant with the BS8878 Web Accessibility Code of Practice.

      An audit by myself goes way beyond tick box checks; I will check that your site is accessible and usable to the real people who visit your site.

      Contact me today to take advantage of this unique expertise to utilise my expertise to attract more visitors to your website and make it easier to use by everyone. No matter what your budget or how big or small your website is I will be able to provide an audit that fits with your needs.


      Organising Website Content: 14 tips

      1. Know your audience and what they want from you: i.e. aim to make the things they are likely to look for the easiest to find.
      2. Create a priority list of your target users; and a priority lists of what they will be looking for on your site. That way you can address the main needs of the most important groups first.
      3. It can be helpful to Imagine typical users, how they might navigate through your site and how they might find what they are after.
      4. Review your website statistics. The most popular pages and search terms will be obvious: ensure you make them even easier to find. (Install Google Analytics and you can see the route people take through your site, the page they were viewing when they left – and much more).
      5. Create more than one way to find the same thing: Some users prefer search and some prefer browsing. Just like when a person visits a real store; some people ask staff and some just walk around. Some obvious ways to find things you could offer to visitors would be: search, browse via the main navigation, browse via the site map, ask via email, contact form or telephone.
      6. Explore different organisation schemes, e.g. alphabetic, by subject, by audience, by date. Most websites use a mixture of schemes; e.g. at the top level your scheme could be based on the needs of your audience (e.g for a site about a conference your audience groups could be exhibitors, visitors, press) – down a level the scheme used could be based on subject or alphabetical order. For example on a site selling books, a PHP programmer might click in to the technical books’ area; then click Programming books, then PHP books – then browse those PHP books alphabetically. Or more likely – they will just search for PHP books from the home page.
      7. Use a site-map tool to visualise your site such as the free online tool http://writemaps.com
      8. A content management system can make it easy to offer several different schemes automatically: e.g. it can be easy to organise your content alphabetically, by topic or by date at the click of a link.
      9. Group similar things together. Group navigation visually: e.g. information related links in one place; dynamic things (discussion, social media) on another, play things (weather, games), organisation related things together (about us, press releases, employment opportunities, contact, staff…).
      10. Decide whether your navigation will be shallow or deep. Is everything going to be accessible from the home page, or do you need to burrow down to find things? One approach isn’t necessarily better than the other; it’s all about how easy and quickly things can be found.
      11. Label things clearly and use familiar labels. Clear and consistent labeling is obviously important. Is it clear what the person will get when they click that link? Does the page they go to have the heading they expect? Use conventions; e.g. Information about your organisation is in the ‘About’ area, information about your services in the ‘Services’ area, information about your products in the ‘Products’ area. ‘Information for the press is in the ‘Press’ area – use ‘Contact’ for the contact form link.
      12. Use search engine friendly urls, e.g.. websitedomain.com/category/sub-category/pagename.php. Use all lower case, no spaces, don’t use any ‘funny characters’.
      13. Navigation should be based on your content and visitor research. Your navigation scheme should become clear from the way you have organised your content. I.e. it should be created with your users in mind: it should not reflect your internal organisation chart.
      14. Use conventions to place navigation on the page: horizontal main navigation across the top, left-hand for subsection navigation; right hand for navigation related to page topic. Search – is usually top right, at the very top and bottom is where you usually find contact information and a site-map.

      Portable Document Format (PDF)Download Organising website content as a PDF document.

      “Jim’s patience and close work with his designer meant we got a vibrant new image that we could use across all media.” Clare MacGillivray, Development Coordinator Edinburgh Tenants Federation

      Contact us today to discuss your project’s digital marketing needs

      Or phone to talk over your ideas: 07810 098 119.

      Photo by yvestown on Flickr – used under a Creative Commons licence


      Get the Web Accessibility Toolbar for Internet Explorer

      In this tip I recommend you check out a new Toolbar for Internet Explorer developed by Steven Faulkner, of the National Information and Library Service (NILS). Support for the toolbar is confined to Internet Explorer on Windows, so I haven’t been able to try it out myself (I use a Mac) – however, Gez Lemon of the website Juicy Studio is giving it glowing reviews – and I trust his judgement.

      According to the blurb, ‘It is designed to help the user to interrogate aspects (structure/code/content) of a html document that can have an affect on the accessibility of that html document. ‘

      It does all sorts of things I would find useful as a developer of accessible websites (validation, screen resolution changes, CSS on/off, links to online checking tools and so on), so I think you will find it very useful. You can find installation instructions, and a full feature list for the accessibility toolbar on the website.

      The Web developer tool for Firefox is also worth checking out: http://www.chrispederick.com/work/firefox/webdeveloper/ – and it is according to Mike Pepper, ‘bloody good’.

      Links


      How to make client-side image maps accessible

      Although client-side images are preferred over server-side image maps – as equivalent text can be provided for each image map ‘hot-spot’ – server-side image maps are sometimes necessary. For example, a server side image can be used when the active regions of a client-side image map cannot be easily defined using an available geographic shape. In such cases the answer is to provide redundant text links relating to each link provided by the server side image map.

      The following markup example is typical of the code used to reference a server side image map.

      <a href="/cgi-bin/mymap.map">
      <img ismap src="imagemap.gif" >
      </a>
      

      The web pages accessed by the clicking the mage map in the above example would be completely hidden to someone using a screen reader or a text-only web browser, as there is no alternative way of accessing the links provided.
      An example of the server side image with alt attribute added and an alternative set of links to the same content:

      <a href="/cgi-bin/mymap.map">
      <img ismap src="imagemap.gif"
      alt="Alternative text links are provided at the foot of the page.">
      </a>
      

      You then make the following links available at the foot of the page,

      <p><a href="about.html">About Us</a> | <a href="research.html">Research</a> </p>
      

      As you can see in the example above the alt attribute provided information about where to find the text based links. The alternative text based links provided at the bottom of the page imply that the image map has two hot-spots, one to find information about the organisation and another for information related to research.


      Other posts in this category

      View a list of all blog posts.

      Let's Chat

      07810 098 119

      Alternative access to client feedback ››

      “The audit was extremely comprehensive, clear and demonstrated Jim’s expertise in the area of accessible web design.” Peter Madden, Project Manager, Sealed Envelope Ltd