Quantcast
Viewing latest article 4
Browse Latest Browse All 10

Tableless, accessible, nearly validating osCommerce — Rewriting the beast

Image may be NSFW.
Clik here to view.
Rocky Mountain Baggers

osCommerce accessibility stinks

osCommerce 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 Image may be NSFW.
Clik here to view.
:-)
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 Image may be NSFW.
Clik here to view.
:-)

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!

The post Tableless, accessible, nearly validating osCommerce — Rewriting the beast appeared first on Katz Web Services.


Viewing latest article 4
Browse Latest Browse All 10

Trending Articles