Category Archives: Accessibility

Accessibility and 508 compliance in web design and web development

How Will the Cloud Evolve in 2014?

Image via Flickr by George Thomas

As we push further into the 21st century, the internet has continued to adapt to fulfill the needs of its demanding user base. Web 2.0 brought forth many changes to the medium such as social media, crowdsourcing and richer user experiences that many of us take for granted. As the infrastructure grew, so did the need for a more flexible data environment.

Enter the cloud. At this point, the general public has been thoroughly educated on its uses and benefits thanks to its seamless integration with mobile devices and digital platforms. However, while consumers are enjoying cloud-enabled apps like Spotify and Google Apps, it’s the businesses that have truly been reaping the benefits. According to IBM, companies that adopt competitive cloud technologies are doubling in revenue growth when compared to others that are behind the curve. Now passed its infancy stage; the future is bright for the cloud. Here’s what we can expect from cloud technology in 2014 and beyond.
Read more >

3 Steps to Avoid Negative Social Media and Lawsuits Over Website Accessibility

 

Web accessibility is a major initiative in the Internet world. Trade organizations, industry websites, and university communications departments all include web accessibility as a chapter in the web design handbook. The websites for corporations, government entities, sole proprietorships, and non-profit agencies are held to a set of standards that ensures equal access to the Internet.

Simply put, web accessibility amounts to how universally available your website is. Consider those with disabilities. For someone who is legally blind yet can still see a monitor, miniscule fonts will in effect lock him out of your site. If an individual is deaf, and you have non-signified audio messages on your site, the important information in that audio becomes in effect withheld from that individual. Web accessibility is the concept of overcoming these barriers through the appropriate programming and design techniques.

 

Step 1: Understand the Expectations and Your Obligations

Why Web Accessibility?

Web accessibility is an important consideration for your financials. According to HHS, approximately 54 million Americans are living with a disability. With a total US population of 315 million, that 54 million amounts to 17% of the general public that can’t use your website. This affects your bottom line in three ways:

  1. What if you’re selling your product on your website? Can you operate without 17% of your revenue? If your site has excessive accessibility barriers, that’s exactly what you’re doing.
  2. By shutting out this segment of the population, you are both refusing to market to them and denying them the services they seek. This can be construed as discrimination, which can lead to a reputation that will tarnish your image and hurt sales. Today’s social media climate can expedite this at light speed.
  3. Web accessibility could boost your online traffic by as much as 17%. Remember, the more people your site attracts, and the longer those people spend on your site, the more marketable your site is to advertisers. Therefore, even if you’re not selling through your site directly, you can increase the value of your ad inventory due to the increased traffic.
    Read more >

Easy IE Conditional CSS with No Hacks!

Any serious CSS person has hacked their way through more ‘Internet Exploder’ issues than they care to talk about. Even if there are only a few small issues to fix in an area, it can be difficult to track them through multiple style sheets (ie. conditional sheet for IE6 & 7). Hacks are just bad practice, so what can you do? There is a better way! I came up with a neat little piece of code that has greatly simplified my life when dealing with cross-browser compatibility.

Read more >

Google’s Accessible Search for the Visually Challenged

When I read about this new creation from Google I had to tell the world. For those of us fighting the good fight, trying to make the web available to as many people as possible, this is a huge step forward. You can test it for yourself at http://labs.google.com/accessible/

The project is headed up by a blind researcher who lost his vision from glaucoma as a kid. It is easy to overlook the fact that nearly 8 million online users in the US alone are visually impaired, and that the number increases as the web becomes available to more people. Can your business afford to turn away 8 million visitors? It could be the difference between sinking or swimming!

‘corePHP’ is dedicated to the education and development of a more accessible web. We have information on our site that discusses accessibility. Our info includes documentation, extensions and files that members can download. Make your site accessible to everyone!

You can read more on the Google Accessible Search Engine at http://www.newsfactor.com/story.xhtml?story_id=44748

Tableless does NOT mean Accessible!

In the last year there have been major changes in tableless design and accessibility. Recently, laws have been passed requiring websites to be accessible and lawsuits have been filed against current sites and developers. Clearly, our world will never be the same again. It’s a case of ‘get up to speed or get out of the race.’ Unfortunately, there have been a lot of misunderstandings about the terms ‘accessible,’ ‘tableless’ and ‘valid xhtml+css.’

A short time ago, I was getting burned out doing the same ol’ coding day after day. I had pushed my nested table skills to the limits and could get a good design, but something always seemed off. I originally started out with prepress, graphic design and Photoshop work, and I wanted the web to do what I was used to doing in those programs. To say it was frustrating was an understatement. Then one day I came across CSS Zen Garden and my world was never the same again. I have learned all I can about tableless websites and accessibility, and it’s completely changed how do web development.

I think I’m accessible!

I go through several pages of news every day trying to find tips to increase my development skills and I have recently noticed a growing trend with the majority of developers. People seem to think that if they make their site tableless, it automatically means it’s accessible. This couldn’t be further from the truth. It is a great step toward greater accessibility, but chances are they are missing the mark in several other areas of their site. Another myth is that if their site passes the validation for xhtml and CSS, that their site is accessible as well. They are just as libel for a lawsuit with a tableless validated xhtml+css site as they are with a nested-table monster of a site. At the same time, a table layout website can pass as accessible. How is this possible?

Take the following steps to ensure that all of your customers can access your site. You’ll sleep easier at night knowing you won’t be spending development time in court explaining your ignorance of the topic to a jury.

Have proper form

The most non-accessible code seems to come from forms. Accessible forms aren’t too difficult, but there needs to be a little more care taken in how they are laid out. One of the best articles I’ve come across that teaches how to make accessible forms is on this page at WebCredible.co.uk. There’s a rule that I follow: If I can use the form completely without using a mouse then it’s accessible.

I thought we were done with tables!?

The second most iΩaccessible code comes from our old friend the table. Keep in mind that tables are completely valid to use in xhtml+css layouts. In fact they are the preferred choice if you are presenting tabulated data. The problem is that they are very hard to read if you are using a screen reader that’s not coded properly. There are many extra tags you should insert that you may not have ever heard about, but that are necessary for those who are using an alternative browser. My favorite article on accessible tables can be found here on 456 Berea Street. It covers a lot of the basics so you can make accessible tables in no time at all. I would recommend doing some of your own research on more advanced accessible tables.

Know how to use your page tags

Another easy way to assist users who require accessible technology is to use your page tags correctly. Using them correctly will also make them more semantically correct, which will make your site more popular in search engines. I start laying out my sites in pure text before I even touch CSS. This assures me that everything will look right in screen readers and cell phones, as well as older browsers (which I filter out into a nicely formatted text only layout). Visit this page on Mezzoblue for a more complete description of how to correctly use tags within your page.

Can you read my script?

There are other less crucial code styles that can help with accessibility. I urge you to know as much about your site’s coding as possible since you are responsible for what you put on the web. Most Ajax is not accessible, as well as a lot of JavaScript. If you use JavaScript, be sure to include a noscript explaining what is happening to those who can’t use it, or give a link to a place where they can use it (ie. JavaScript iframes).

Minimalists are people too!

Try to keep in mind that some people browse the web with their graphics, css and/or JavaScript OFF. Think about how your page will be viewed if this happens. Also, keep in mind that many people increase their text size in their browser. Try not to use px for your font sizes since that locks the text sizes in IE. Use em (or %) instead, so it will increase with the size increase function within the browsers. You won’t be sued for not having this, but it’s good etiquette for web accessibility.

Help for you in less than 12 steps

Hopefully this will give you a more complete picture of what it means to create an accessible website. Some people seem to be looking for lawsuits these days, so it’s good to have your bases covered. Here are a couple tools that will help you with all this:

  • Firefox Web Browser: I doubt there is anybody who doesn’t use this anymore for web development, but if you don’t then download it here.
  • Web Developers Toolbar: Once you have Firefox you need to download this toolbar. It’s an absolute must. It’s a good idea to choose CSS > Disable Styles > All Styles. This will allow you to see your page the way it looks with no CSS – which is a setting people often use for slow connections. This also gives a good indication of what screen readers will see. One other great feature is under Information. You can choose to display virtually any tags in your site at a glance without going to your source.

Good luck!