I have been overhauling my website these last few weeks: adding content, improving the design of the layout, and re-writing the code from near-scratch. It was a steep and tedious learning curve. Forever will I be grateful to the technical geeks that litter internet forums and blogs, fielding questions that have been asked many or few times and making my life a little easier each time I hit a brick wall. Usually this wall is in the form of Internet Explorer, which I now despise. That should be too strong an emotion for a piece of software to induce, but I fully support .net magazine’s Bring Down IE6 campaign. This particular version is too old to be used in 2009, and its continued use is a burden to innovative website design; in their words the campaigners ask if it is “finally time to take IE6 behind the shed and shoot it”? Thankfully, I have now addressed my concerns about my website’s accessibility, as every page I host is now standards compliant XHTML. This means that every modern browser should render my website the way I intended.
Each project includes scans of the related sketchbook presented alongside; additional projects have been added and are now categorised by date with a separate category for competition briefs completed outside of university. This weblog has also been reformatted to match the rest of website. However, for me the biggest change is in the code, and ditching old habits to move with the times to create a more accessible website. These are my recommendations for creating a modern website:
1. Understand what the doctype means and does to make sure you are using the most suitable one. It can affect how browsers render your webpage and determine whether code is understood or not. For example if you are using deprecated html tags (like <font>) you may need a ‘transitional’ rather than ‘strict’ doctype.
2. Specify font sizes in ems or percentages. Web browsers have a default font size that individual users can change to suit their needs. It is commonly set to 16px. You can set all font sizes in relation to the default using ‘em’s or percentages, so for most people 1em would equal 16px and 0.5em would equal 8px.
3. Similarly, specify heights, widths and margins in ems or percentages where possible. That way divs in you layout can be scaled in relation to the default font size, and there is less chance of it breaking if someone increases the font size.
4. Don’t use tables to create your webpage’s layout. This was common before CSS was widely supported by browsers. Instead you should use divs to structure your content and leave tables for presenting tabular data. Your pages should load quicker and be rendered properly for years to come.
5. Don’t use javascript to create rollover effects. This is the method employed before CSS was properly supported. CSS can be used to create instantaneous rollover effects. This is better as the rollover effect works for internet users who have javascript disabled.
There is more information readily available on the internet as these issues have been covered and discussed for years, so go forth and make browser-friendly websites.
No comments:
Post a Comment