Friday, March 21, 2008

Web Design and New Browsers

Hi folks, it's been a long time between posts. We've recently seen a wave of new browsers including Firefox (soon to be FFv3), Safari (newly minted 3.1), Opera (9.5 is coming). Blimmin' heck, even the dreaded Internet Explorer people are dabbling with standards with the impending release of IE8.

So I thought I'd restart this blog with my experiences with web site development and internet browsers. Developing my own web site started simple enough and probably mirrors the path that many of us follow.

Crawling
The first version of my web site was hosted for free by my ISP and used a template based on frames. Yeah, I know, nasty huh?!

While this allowed me to build the interface I wanted, including a sliding menu, I was concerned that it wasn't accessible to all types of users that might come across the site. I knew that frames were also poorly regarded amongst the web developer community. It was only while I was testing the site from various devices and browsers that I noticed that frames were completely unsuitable.

Walking
Computers, phones and PDAs would all behave very differently. After a bit of research and more experimenting, I decided that a table-based layout would provide me with both the look-and-feel and the browser compatibility I wanted. Unfortunately, at that time, IE5.5 was common and IE6 was becoming a defacto standard so implementing a standards-based web site seemed too hard and too far out of reach of the part-time hobbyist developer.

However, with the release of Firefox Beta I was suddenly hooked on standards. Not only was Firefox faster than other browsers, it was also capable of displaying HTML using mysterious layout grammar called cascading style sheets or CSS.

Up and Running
With a lot more research and some serious testing I was convinced that separating the style from the content on my web site would make it more compatible, more accessible and more easily upgradeable that any other method.

At that point my web site had grown to several hundred pages and several thousands images so I was relying heavily on both Dreamweaver and the developer tools built in to Firefox to provide guidance. Most, if not all of the HTML authoring tools I tried had very poor support for CSS so development was very much a trial and error affair.

This was made a lot worse by the fact that many workarounds (hacks) were needed to make sure that various web standards-breaking Internet Explorer versions were able to view the site. However, it also provided a way of allowing devices that do not recognise CSS to view all the content without the layout, nice!

Brave New World
Now, even Microsoft are building browsers that are compliant with internet standards, but you'll have to wait until they release IE8 before that promise becomes a reality. I'm pleased to report that most new browsers released since 2001 have worked well with my web site. Initially most of the time taken in the conversion from tables was getting the site to look the same in all the mainstream browsers as they all implement the W3C standards differently and sometimes, not at all.

I encourage all readers to check out the new browsers from Mozilla, Apple and Opera. You won't be disappointed. Safari in particular has made huge steps forward in speed and usability and is also available for Windows. There are now no excuses for using an out of date browser :-)

Even though I'm always tweaking it, the site no longer needs the care and feeding it every time a new browser is released. This frees me to focus more on the content and less on the layout. If I want to change the layout, the content will no longer need to be changed just to make it look right . That's what I call, a win-win.