Hungerford Web Design Blog

It’s beta, let me point that out for those who don’t know. Hopefully my comments will be null when the final release version arrives (I’ll not be betting my house on it though, or my car, or a fiver).

There are numerous posts elsewhere regarding the individual supported/unsupported tags and features of IE8 so I won’t go over old ground.

What I want to do is moan, why? To tell you the truth it is purely down to the amount of work that IE costs me on a daily basis. I develop a site, I test it in firefox - everything renders as expected, I test it in opera - everything renders as expected, I test it in safari (guess what) - everything renders as expected…..now - I go to IE:
I have to test in three different versions as they are all different……
IE6 - Moves all my nicely centred divs to the left of the page
IE7 - Except for the extra spacing in linebreaks it’s not too bad - useable
IE8b - WTF! - My two lowest divs (my footer and lower section) are both moved and set infront/behind other divs.

My code all validates, my css validates, my design appears as I want in every other browser I have but IE - OH NO! Then I head to a company which use a very large intranet, I try to login with firefox but I get a blank page…I ring their internal support, only to be told that it’s all developed for IE as are all their internal systems, it doesn’t work with anything else.

IMHO IE is such a cut-and-shut that instead of all of these half-hearted attempts, it should just be scrapped! If my site is standards compliant and every other browser displays it a certain way then what on earth gives MS the right to decide that my site should look different in IE?

Ok, a bit of a deep breath and step back for a sec…I am shouting and pointing the finger at MS, but for all I know, I could have a terrible code syntax which IE doesn’t know how to interpret. Perhaps the other browsers are all being more forgiving and IE is sticking to the rules…. Problem is, I have no way of finding out, every method I have for checking my code says it’s fine. Testing shows it’s fine and I taught myself HTML before MS (and most of the world) knew what standards were……thanks microsoft, rather than reduce the browser footprint to allow developers to develop ONCE….you have just introduced yet another browser with yet more differences. I’ll be adding the firefox download button to my site shortly!

If for any reason you want the heathen software, you can download IE8 Beta

If you are a developer and have found that your site displays poorly in IE8, you can consider adding the following meta tag:

<META http-equiv=”X-UA-Compatible” content=”IE=7″> Which will revert the rendering to that of IE7 (which has it’s own issues), good luck.

Technorati Tags: Attempts, Beta, Blank Page, Compliant, Daily Basis, Deep Breath, Divs, Drawing Board, Firefox, Fiver, Footer, Ie7, Ie8, Infront, Intranet, Opera, Pointing The Finger, Safari, Syntax, What On Earth

Firstly I would like to make sure we are all singing from the same page. What is a breadcrumb?

Home > Blog > Post

Breadcrumbs are a navigational trail. It shows users what category or section of your site they are in as well as an easy way to traverse your site.

The usefulness of breadcrumbs can vary. On a small site with 5 pages I would argue that they are not particularly useful. On a site with many sections or areas of information they can be invaluable.

Why are they useful?

From an SEO point of view they can be extremely useful for ensuring that your category areas are listed as well as the actual page. From the point of view of an accessible user with sight difficulties they can give context to your page where images are not available (likewise for users with text-only browsers). Additionally they are often preferred over static menu bars.

The simplest way to implement a breadcrumb system is from the ground up. All sections of your site are within their own directory. For a car sales site this would be similar to the following:

index.html
/carsales/
/carsales/index.html
/carsales/carsforsale.html
/carsales/carssold.html
/servicing/
/servicing/index.html
/servicing/prices.html
/servicing/booking.html

etc etc.

In this example our breadcrumb would look like this if we were on the servicing page:
Home > Servicing
If we then looked at the prices page it would look as follows::
Home > Servicing > Prices
If our user then wanted to navigate from the prices page back to the main serving page they would simply click the “servicing” link between Home and Prices.

Doing this manually can take some time……my next post will be a way of automating this so that the links are created dynamically. For a huge site, automating it can make a big difference. If your site is fairly small you may wish to just manually create the breadcrumb trail. To see an example of breadcrumbs you can view our main site: Hungerford Web Design

Technorati Tags: Blog, Breadcrumb Trail, Car Sales, Carsforsale, Category Areas, Firstly, Images, Point Of View, Sight Difficulties, Static Menu, Web Design

Simple CSS tabs:

It started with the mac (let’s not get into that debate) but a lot of people are now used to using tabs and they are increasingly used to seperate content on websites.

My personal view is that they can actually clutter up a navigation system but some people like them so here you go…..

(more…)

Technorati Tags: Background Color, Color Cccccc, Css File, Element, External Css, File Extensions, Li Class, Liking, Lt, Navigation System, Padding, Personal View, Php File, Style Sheet, Tabs, Text Decoration, Ul

Everybody has to start somewhere. I remember trying to optimise my first site for search engines. It was a site I had written about 6 months before and I was pretty yound and very uninformed. I had written this site in one of the worst WYSIWYG site design programs ever (you can probably guess which) and even now I can remember just how difficult it was. Here are a few tips to start you on a journey considering Search Engine Optimisation (Optimization to those on the other side of the Atlantic).

(more…)

Technorati Tags: Google, Javascript Frames, Journey, Key Point, Optimization, Pita, Reason, Search Engine Optimisation, Search Engine Robots, Search Engines, SEO, Single File, Source Code, Two Ways, Visual Component, Visually Impaired, Wysiwyg

CSS stands for Cascading Style Sheet. In it’s simplest form, it allows you to seperate content from style. That is to say that all of your text “Welcome to my site” etc is totally seperate from the fonts, colours, sizes and heading tags.

(more…)

Technorati Tags: Benefit, Cascading Style Sheet, Colour Changes, Css File, Css Href, External Css, Fonts, Heading Tags, Link Rel, Lt, Mce, Personal Preference, Server Side, Simplest Form, Style Type, Stylesheet, Two Ways, Web Content, Welcome To My Site, Xhtml