osCommerce accessibility stinks
ArrayosCommerce default installation is a huge mess for accessibility. Every piece of code that the platform spits out has endless tables and poorly coded HTML — finding your way through the code is like trying to clear brush.
The simple solution to osCommerce accessibility is to install the Simple Template System and put together a XHTML/CSS’ed out template. That only solves one part of the problem, however, because your wonderful template is going to be wrapping around a whole slew of undesirable code.
Over a year ago, a client of mine wanted an osCommerce website. I wanted to create a masterpiece of accessibility. I tackled osCommerce head-on and re-wrote most of the code that creates the HTML. It was a nightmare, but I created a nearly validating eCommerce website with osCommerce.
The experience was so scarring that I haven’t yet written about it 
Nearly every file was affected, so upgrading it would be a nightmare, but it’s truly an effort of love.
KWD presents: a nearly validating, tableless osCommerce website
Looking at this site after so long, it’s pretty crazy the amount of work I put into it. And get this: for the complete website (including design, breakdown, and customization of osCommerce), I only charged $2,000. Those were the days
Most of the products are default osCommerce, so the images look really small. Check out the Keyboards category for a few I added.
This project involved so many changes to the core that it’s pretty silly when looking back on it.
Some of the major changes I made:
- Improved the checkout process and user account page design & flow
- Lightbox integration (some image paths don’t work on this mirror site)
- Integrated product reviews on the product page, rather on its own page
- Created breadcrumbs and page titles that are SEO friendly and actually reflect where you are
- Created unordered list navigation that shows category children — the same code creates the drop-down navigation and the sidebar nav
- Rewrote the checkout process and account registration HTML (try signing up for an account!)
- Rewrote the pagination code to include more information through title tags, ie: “Displaying Results 1-6″ and “Results 7-10″ and “Previous 6 Results”
It’s still got some minor code issues before it fully validates (I was close on the live site — only one issue — but on the mirror site there are a few). If anyone knows how to modify the BASE tag in osCommerce, please let me know — I couldn’t find where it was generating!
If you’re interested in any of the files, let me know. Please leave your feedback, comments, criticism…I’d love to know what you think!
Related posts:
