How to shroud an email address to prevent spam

We were able to identify few screen reader visitors (few among millions) but no braille or of other type.

ah – but does that mean that your site was not accessible to them? You cannot rely on stats for this.

The core part of the site content is visual

And? Are you suggesting that people with a visual impairment should not be allowed the same ease of access as everyone else? Were you aware that perhaps only 5% of registered blind people actually have no sight? And that they will all have family members and friends who do not have any sight issues? Surely it is up to the individual surfer as to what sites they want to visit – not you?

ah – but does that mean that your site was not accessible to them? You cannot rely on stats for this.

For a large news site we did a deep research, surveys, analytics and polls. It appears in my country blind people almost don’t use internet directly, they ask for help of their friends or family if they need something. In US and other top countries it’s ok for disabled people to have a normal life. Unfortunately, in my country it’s not the same. We have not solved yet problems with elevators for disabled people at shopping malls and street crossings and you are talking about internet.

And? Are you suggesting that people with a visual impairment should not be allowed the same ease of access as everyone else?

Okay, I can make it accessible, but for what reason? A photographer’s portfolio is showcasing photographs. Blind people can read what is the photo about and what is pictured on it but they can’t see it anyway. I can do this extra work as a developer, but a client is not going to pay for that. He thinks blind person will not become a client. You can argue about the accessibility, the rights of disabled people etc but you can’t blame a client of thinking about HIS business. A website is a converting platform and he will pay for anything that will make him new clients. But he is not going to pay for the features for blind people. And in this case the client IS right. So, when I give him a detailed cost estimate, he will review it and remove any parts of the work which are not needed for him.

So what? That does not make them right. And do ensure that you are differentiating between alt texts for decorative images and alts for informational images.

Of course, just gave you an example of a current state. And yes, I do differentiate alts and titles, alts for important stuff and decorations.

To avoid discrimination for a start

Good point. I’m doing the most part of the job to make sites accessible as much as I can. But not always 100% usable and comfortable for ALL kinds of disabled people. Need to learn these in details.

Then I’m sorry but your hypothetical client is a fool.

1. They are not hypothetical, that’s real situation with real clients. I hear it from 9 clients out of 10. Even when I start talking about features for disabled people they look at me like I’m an idiot.
2. They pay for the development, they can insist or choose another company to work with. I prefer to have them stay – it’s business.

In the UK

This is the main point. You live in UK and it’s NORMAL for you. But hey, there’s the rest of the world. I live in Ukraine. It’s a poor country. We have no sound warnings for the green lights on the road crossings, no braille on product price tags or packages etc. Disabled people in our country ARE POOR. The government does not care about them. Often even families don’t care much, unfortunately. This is sad. But this is reality in many countries, including all ex-USSR (and Russia to, believe me).

Are there clients out there who do not want a slice of that market?

These market in Ukraine is much, much, much smaller. I would rather say it’s a micro-market. By the way, despite Ukraine is a large country and plastic cards are VERY common and popular (everyone have them) all over the country people still don’t pay by card on the internet. Even on largest online stores the main (over 95% of orders) payment method is ‘Cash on delivery’. This is just an example. Always remember that there is a lot of other countries outside UK and US and in many of them everything is COMPLETELY different. I saw many foreign companies coming to ukrainian or russian market and failing just because they were trying to work the way they work in their country. Always consider mentality and specifics of the country/people you are going to work with.

Who said he had to? Accessible design is not a premium add-on. It should always be part of all design projects. It’s part of WordPress core.

You need to spend some extra time to double-check everything and even test (the perfect scenario). This takes time. Time means money. When the client says “let’s see if we can cut off some costs” you start optimizing every step of yours. No responsiveness, no optimization for slower connections over mobile etc.

Isn’t dropping support for IE6-7 a discrimination? From my point of view, making a website 100% accessible is the same as making it work in IE6-8. If it’s broken and visitors can’t use it properly – it’s bad. If it’s working and users can use the most important features, even if they don’t get all the pretty stuff and extra functionality – it’s ok. Making everything 100% accessible and functional in all possible scenarios for every possible user is utopia.

You need to spend some extra time to double-check everything and even test (the perfect scenario).

Only initially and whilst you are learning. Didn’t you have to do the same kind of thing when you were learning web design generally? It can – and does – become second nature pretty quickly. And there are tons of support resources out there in the meantime.

Isn’t dropping support for IE6-7 a discrimination?

No because that doesn’t impact a specific group that can defined using other criteria. Web accessibility is specifically about making sites usable for disabled people. if a disabled person chooses to use IE7 and your site does not support IE7, then that’s a different thing entirely.

These market in Ukraine is much, much, much smaller.

I do appreciate that but it will grow. The growth in other areas of Europe and the US has been quite amazing over the past 10 years. This is your chance to get in on the ground floor. 🙂

making a website 100% accessible is the same as making it work in IE6-8.

You can never make a site 100% accessible as its level of accessibility is defined by whoever is using it. All you can do is make the site as accessible as possible by doing things the Right Way (ie according to the WCAG guidelines etc). If user X doesn’t know how to use their assistive technology (AT) correctly, that’s not your problem. Ditto if someone is using an very old or obscure user agent (such as IE6). These are not accessibility issues, But if you deliberately obfuscate your contact email address in such a way that it cannot be rendered by some AT, then that is an accessibility issue because you have created this barrier when there are barrier-free alternatives.

Making everything 100% accessible and functional in all possible scenarios for every possible user is utopia.

This is not about Utopia. It’s about trying to ensure that you do not create barriers. Many disabled users are perfectly capable of wrangling their own software. They are experts in their field and their range of skills etc can be mind-blowing. Nor are they asking for special treatment. All that they do ask is that you do not make their lives more difficult if this can be avoided.

Accessible design really isn’t as scary as it might look initially. And the potential benefits for everyone are very significant.

It’s about trying to ensure that you do not create barriers
…
All that they do ask is that you do not make their lives more difficult if this can be avoided.

Got it. Completely agree.

A question. Ok, I have obfuscated email and some user agents can’t understand the email address characters. Looks like a problem. But the tag has alt attribute saying ‘Press this link to send me an email”. I suppose this user agent can perform this basic action (following a mailto: link and sending email using a webmail or any mail client). Using contact form is actually the same – a visitor can send an email but he can’t see the actual email address. So, every user, including disabled CAN use this feature. Looks like we don’t have any problem here. Am I missing something?

it impacts millions of people, including disabled.

But not disabled people specifically – hence not a web accessibility issue.

Definition of web accessibility
W3C’s definition

https://creativemarket.com/badelt/7896-Righter-A-Simple-WordPress-Theme/live-preview

Here’s a demo of a Righter WordPress theme. I’m creating a Pro version of the theme with extra functionality and fixing some general issues for this version. Accessibility is on the list.

Check the ‘Contact me’ button, bottom left. In the original theme it’s not obfuscated, has no alt and title attributes etc.

Original code (from the link above):
<a target="blank" href="mailto:someone@gmail.com?subject=Hello" class="email">Contact me</a>

My edited version:
<a href="mailto:someon%65@gmail%2E%63om?subject=Hello" target="_blank" alt="Click here to send me an email" class="email">Contact me</a>

It has alt attribute, it’s a text link accessible by it’s nature, the design (it looks like a button) is pure CSS. It functions well – opens a mail client’s (or webmail’s) ‘Compose new message’ screen and puts there recipient’s email address and message subject. As I understand it’s 100% accessible and operable. The email address itself isn’t readable and it shouldn’t actually. It’s still accessible. Am I right?

By the way, checked WCAG 2.0. Seems like I’m following these guidelines intuitively, I learned this in the process, not by reading the guidelines. Most of this is just a common sense and good practices.

Eek! target=”_blank”?

Yeah, this is something I’m trying to figure out for a long time. First of all, a button saying ‘Send me an email’ is logically a “new window action” as it will open a mail client. For external apps _blank will be ignored. For those who set Gmail (or other webmail) to handle mailto: links in the browser without _blank it will be loaded in same tab/window replacing the site, which is not a logical and expected behaviour. With Gmail it looks really bad. Clicking mailto: link opens in current window/tab a blank page with Gmail’s ‘compose’ overlay div and after sending the message this overlay is automatically closed leaving you in front of a blank page. Awkward. But wait, that’s not all! When you hit browser’s back button you see a ‘compose’ overlay again instead of going back to the site. What most users will do in this case? Close the tab/window. This is not a user-friendly behavior. I think that ‘Contact me’ link is not an internal/external LINK to be followed, it’s an external ACTION, which by default will be handled in separate window (external application or webmail in external window) or it can handle an overlay with contact form..

the alt must replicate the text rendered in the graphic

It makes no sense for me, really. Looks like just stupid following some strict rule, not thinking about the end user but about getting ‘WCAG Passed’ badge. First of all, the button is not a graphic, it’s a PLAIN TEXT link ‘Contact me’, it is a text and it is accessible. The alt attribute, as I understand, gives alternative readers some extra information – explanation, instruction etc. Replicating ‘Contact me’ text in alt attribute makes no sense because it doesn’t help and it’s actually redundant, because the link text is accessible itself. Alt text here is kinda optional instruction for alternative reader. What am I missing?

have you tried putting your theme through the theme accessibility audit yourself?

Not yet, until now I developed themes only for personal projects and clients. Right now working on my first theme to be released in public and will definitely try this out. Thanks!