I thought that hell would have frozen over long before I ever blog about a Microsoft product, let alone Internet Explorer, let alone looking forward to it, but here I am - blogging about Internet Explorer 9, the latest soon-to-be-released version of Internet Explorer.

Even though the much improved Internet Explorer 8 was only released over a year ago in March 2009, Microsoft are already hard at work (and not too far off releasing) version 9 of their controversial browser application. You can even download the latest preview of the browser from their test drive microsite.

It was also announced that the first official beta of Internet Explorer 9 will be launched on September 15th 2010, that's just 3 weeks away from today.

Having just switched to Google Chrome after years of being a Firefox fanboy, there is no worries of me jumping ship to Internet Explorer as my browser of choice anytime soon. However, the main reason for my excitement is the possibilities it opens up when developing websites.

Though we hate to admit it, Internet Explorer is probably one of the most influential browsers in terms of the technologies we decide to build our websites in. Due to the large market share, we have to make sure that what we build is compatible. This meant that using exciting new technologies such as CSS3, and HTML5 was not as possible as the more standards compliant and frequently updated browsers like Mozilla Firefox, Google Chrome and Opera.

As of the fourth preview release, Internet Explorer has surprisingly good support for CSS3 selectors (43 out of 43) and properties, scores 93/100 on the Acid3 test – a much higher score than the 20/100 IE8 receives, a faster JavaScript engine and supports new HTML5 tags such as <video> and <header>.

With the end of Internet Explorer 6 coming more of a reality day by day, we are likely to see a big surge in people upgrading and therefore allow us to use these new technologies which the latest browsers are now supporting.

As an industry we are steaming forward into a more standardised playing field, meaning our web designers and developers are happier and the web will become a much more competitive and exciting venture.

As designers who code and developers, we like to shout about writing semantic HTML as a standard in our work, but a lot of the time we then get asked "What does Semantic HTML actually mean?"

In short, it means the HTML tags we use imply meaning to the content, rather than presentation. This in affect means our HTML is cleaner, easier to understand, more accessible for screen readers, and should no custom CSS be applied to the document – the content is still readable in the manner it was intended.

Some examples of these would be using: <p> tags for our paragraphs of text; <address> for, you guessed it, an address; <h1>, <h2>, <h3> for headings and sub-headings – increasing the number as the heading decreases in the page's hierarchy.

When writing semantic HTML, we also tend to use <em> and <strong> tags rather than <i> and <b>. Earlier we stated we want to use HTML tags which imply content, not presentation. In this case <em> and <strong> imply that the content should be emphasised and have strong meaning, whereas if we were to use <i> and <b>, they are a presentational instruction for the content to be italicised and bolded – which can just as easily be done through CSS, further separating visual style from content.

The above are just a small handful of the tags we can use, and with the continuing development of HTML5 we are seeing even more tags created to make our templates even more semantic, removing the need of copious amounts of <div> tags (a <div> being just a container, implying no meaning to its content).

Headings and SEO

On the topic of semantic HTML, the conversation about the use of headings and its impact on the SEO (Search Engine Optimization) of a page is often raised – and one tag which causes confusion and a plethora of opinions, is the <h1> tag.

The <h1> tag is intended for the most important heading on the page. Most of the time designers and developers wrap the site title and/or logo in the <h1> tag as they deem this piece of information as the most important. However some SEO specialists disagree, and would rather the current page's or blog post's title should be within the <h1> as this holds the most weight about the information that is on the page. So who is right and who is wrong?The answer is there is no right or wrong way, and there is a lot of grey area, just personal preference and different SEO strategies – hence the reason for difference in opinions and implementations.

Personally, I agree that the page title should be in the <h1>, and the site title should then be within a link to the site's homepage.

But what about the home page, that doesn't necessarily have a title? After a recent discussion with other developers we came up with a simple solution. This solution can also be found in the recently released Twenty-Ten default theme for WordPress 3.0.

On the home page, the most important heading on the page is the site title, correct? Well on this page, we wrap the site title and/or logo within a <h1> tag, giving it the highest priority on the page in terms of structure, and search engines will recognise this.

When moving onto a subsequent page, the <h1> tag will then be used for the page title as discussed earlier, and the site title will then be wrapped with a link.

This might require a bit more code from the server side point of view, but the result is a lot more efficient for your semantic HTML, and it will definitely make SEO consultants and specialists happy.

For many designers and front-end developers, another hot topic of conversation is the @font-face CSS declarations which now allow us to use any font we like in our websites as if it was installed on the users computer.

Before we were restricted in which fonts we could use, relying solely on the fonts which most users would have installed on their computers; Arial, Verdana, Times New Roman, Courier New – to name just a few.

Now we can upload the required font files to our server, reference them in our CSS and we are all set.

I bet I know what you are thinking – what about browser support? It goes without saying that everything we do is affected in someway or another by the browser support of the features we want to use. The good news is that @font-face is currently supported by all major browsers: Firefox 3.5+, Chrome 4+, Safari 3.2+, Opera 10.1+, even Internet Explorer 6+.

But hang on, isn't Internet Explorer 6 (IE6) over 10 years old? Yes it is, and even though @font-face is officially a new declaration within CSS3, it was originally planned for CSS2 and therefore was implemented by IE6 – when it came to @font-face being removed from the spec (for reasons I am not quite sure of), support was never removed from IE6.

For more information on the code required and how to create a bulletproof @font-face declaration which is cross-browser, check out Paul Irish's article on 'Bulletproof @font-face syntax'.

However, though in theory @font-face allows us to use any font we like – we are restricted by the font's licenses whether font embedding or sharing is permitted. This is mainly down to the fact that if we are linking to a font file in our code, it means anybody can just download the font and then is it on their computer.

Therefore, it is important to check if the font you want to use is permitted to be used on the web.

Alternatively, there are a few resources which I have come across and found extremely useful in getting @font-face fonts and making sure they are permitted to be used.

• Font Squirrel

  The Font Squirrel website lists 'hundreds of @font-face font kits' which are 100% free for commercial use. The kits provide all the necessary fonts and code needed to be implemented.

• Fontspring

  If you wish to have even more of a selection of font, and have a more unique feel to your website - Fontspring provides purchasable fonts along with @font-face licenses, all very reasonable prices.

• FontDeck

  Whereas the last 2 services allowed you to select individual fonts, and in the case of FontSpring, purchase @font-face licenses, FontDeck allows you to pay a subscription and have full access to their library of fonts to use on your website. Great alternative if you want to use a lot of fonts, or as a freelancer you love to use unique fonts for all your clients' websites.

• TypeKit

  Like FontDeck, TypeKit allows you to pay a monthly subscription allowing access to their library of fonts and use them on your website. The higher level your account type is, the more fonts you can use and the more website domains you can use the fonts on.

So when you are next designing a website, or even as a client looking to have a website designed, look into the possibility of using more custom fonts to get more aesthetics and edge on the web. Stand out, be at the forefront of new technologies and trends.

The iPad has been released for just over a month now in the UK, and we are now starting to see some fantastic apps released to the App Store and though it may seem we are talking a lot about Apple's latest gadget, we thought it would be nice to take a look at our favourite iPad apps.

In my desperate search for a simple to do list app which didn't have the £11.99 price tag that the popular app Things has, I found this week's app of the week: Sorted. For 59p, it surely is a bargain.

Sorted allows you to maintain multiple lists, great for if you are running different projects, or just list to separate your items:

You can also set a list item's due date and priority:

Using the tabs across the top, you can filter your list by List, Priority, Date and Completed:

If items need a bit more information, you can enter some comments for the item:

Sorted for the iPad makes your to do list easy. The user interface is clean and feels great on the iPad. The creators have also tried to make use of the core iPad actions such as swiping your finger across an item will mark it as complete, where this could have just been a simple button.

Having used the app for a while now, my only fault is it proves quite difficult to delete an item. The action is supposed to be easy in that you swipe the item using 2 fingers. Either I am doing something wrong, or I can never get it to work and just end up marking the item as complete.

Overall, this is a nice and well thought out app. There is room for improvement, such as the delete item item, and maybe introducing a badge count on the app's icon would be nice – to see how many items are due soon, or overdue. Though for 59p, I cannot really complain!

Or one can hope.

With the beginning of any new month comes the release of new statistics, and on Tuesday, StatCounter released the new set of results for the browser market share war in May 2010 with quite surprising results.

As rightly Mashable pointed out, and was music to many people's ears, the market share for Internet Explorer 6 in the UK and United States was at an all time low, roughly 6%. Great news considering in 2003, IE6 held a 90% market share!

You may have noticed that the 6% market share is for the UK and US, what about the rest of the world? According to StatCounter, the worldwide market share for IE6 is still at 13.74%, which doesn't seem a lot in the scheme of things. However when compared to other popular browsers such as Firefox 3.5, which still only has a 12.42% market share, we come to the realisation that the end isn't here, yet.

Why do we want to see the end of Internet Explorer 6? What was great at the time of its release, is now old news and holding us back.

IE6 is not only full of security holes, but as a digital agency who strives for cross-browser compatibility, the browser definitely has its fair share of bugs in terms of code interpretation and lack of transparent PNG support.

Moving forward, we can use the statistics to say that supporting Internet Explorer 6 isn't as important as it was back in 2003. Support for this out-dated browser should be decided upon the audience of the website you are building.

If the website is lucky enough to have tracking statistics such as Google Analytics, you can begin to look at what browsers its users tend to use. Is only less than 1% of your users using Internet Explorer 6 to view your website? Great, consider not supporting it then.

So for us designers and developers who are too often pulling their hair out because of a bug with the design in IE6, dropping support is not quite here, but soon. Patience, there is light at the end of the tunnel.

On the whole, people responded very well to the 100+ new user features, which were revealed during the event, but there are a few which stand out - particularly to me.

Multitasking
One of the most highly anticipated and speculated features. iPhone OS 4 will allow users to open multiple apps and seamlessly switch between them; using a docking system similar to Mac OS X.

For example, users will now be able to browser a website in Safari whilst taking a Skype call.

Unfortunately, multitasking will only be available to 3GS users, leaving 3G users without; could this be a clever act of marketing by Apple to sell more 3GS phones?

Folders
I know it is hard to imagine, but there are some iPhone users who manage to fill up all eight homescreens on the iPhone OS 3. Taking this into account, the OS 4 will enable users to organise their apps by sorting them into folders.

“You used to be able to see 180 apps on your phone, now it’s over 2000” Steve Jobs, during the keynote. - That’s a lot of apps!

Improved Mail
The iPhone Mail app has not been updated since 2007, so this update has been a long time coming. The new iPhone Mail app will provide threaded messages, the ability to open attachments using other apps and a unified inbox for all of your accounts.

Custom background
Users have been jailbreaking their iPhone’s since the very beginning in order to apply custom background images rather than the default black.

The recent release of the iPad already shows off customisable backgrounds, and Apple will be bringing this feature across to the iPhone OS 4 when it is released in the summer.

What about the iPad?
Seeing as the iPad runs off the same operating system as the iPhone, iPad will also be getting an upgrade to OS 4. However the upgrade will not be available until this autumn, so we will have to wait a few months before being able to multitask on our iPads.

We recently launched a new campaign website for WRVS with the purpose of raising awareness of how older people struggle to get to the places they need to on a daily basis without the support of community transport. With the theme of hitchhiking proposed by WRVS, Creative Jar put together a very unique campaign website.

Viral
To coincide with the campaign website, a viral video was shot and put up on YouTube. Together with some willing volunteers and people who use the services of WRVS, Creative Jar shot a video which presented the unrealistic image of older people having to hitchhike in order to get to their destinations. The aim was to produce a quirky way of showing what might happen if community transport was not available for older people across Brtiain. Why not check it out?

Speedometer Flash
As part of the build, the creative team were required to build a flash element in the bottom left of the page which would count the number of volunteers that had registered as a result of the campaign.

To tie in with the transport theme, the creative team produced a speedometer which would count the number of volunteers registering with WRVS. Below you can see a screenshot of the flash showing a total of 23 volunteers. As you can see the number is counted both within the mileage gage in the centre, and also the speed dial (pointer) moves depending on the volunteers. To the right of the speedometer are two call-to-action buttons styled like the indicators of a car. Hovering over them adds some nice moving animation.

404 Page
Though not a lot of people will see this page (we hope!) the team also created a unique Error 404 page (displayed when a page cannot be found). Styled to look like a person holding a sheet of cardboard, carrying through the hitchhiking theme, this visually makes the user quickly aware they are not looking a page within the intended site map.

These are just a few of the outstanding elements which can be found on the WRVS Give Us A Lift campaign website. Why not visit the site, explore and find more for yourself?

Twitter Competition
Alongside the campaign, WRVS are running a twitter prize draw and competition to give away two Flip Cameras a week for four weeks. The first five winners have already been contacted, which means there are a further three cameras to be won. Find out more by visiting the Twitter page.

It’s time to blow the dust off this blog and announce some rather exciting news for Creative Jar. Previously this year, Creative Jar launched Phase 1 of Cranfield School of Management's new website and was received with huge success. Recently, as part of the second phase, we were required to build a powerful search tool for the website much like Google – a scary comparison, but a challenge Creative Jar set out to achieve.

Your average search tool consists of a keyword search which displays a generic list of results relating to your search term. Leaving users to flick through link by link for what they were searching. However, the SOM Search uses your search term and returns results in an array of categories; images, videos, documents, website sections.

Directly from this results landing page, the user can watch videos, play audio files and read snippets of content. Alternatively, the user can select to view your standard results page if they wish to do so.

All of this is powered using Cranfield's custom CMS, giving the client full control over their content and their search... a powerful tool for any website – and very exciting for use techies to build!

Check it out and find out for yourself by visiting the Cranfield website!

I am currently in the process of packing up my belongings to move house - and let's face it, you inevitably will find stuff which you had misplaced about 6 years ago behind a book or in a box deep within your cupboard. One thing I did find was a box of untouched floppy discs and it got me thinking: when was the last time I used a floppy disc? With CD's, DVD's, Memory Sticks and External Hard Drives polluting every computer users repository for file storage, floppy disc's don't even get a look in.

So with the 'fate of floppy discs becoming apparent' what will happen to the Floppy Disc Save icon that we see on every computer application that has saving functionality? Will it be modernized to suit the advancing technologies that we now use to store our files? Or will it be standardized as one of those all-time-favourites that just don't need changing? Well I did a bit of googling on the matter, as you do, and found this interesting discussion: Modernizing the Save Icon?

You will find a few comic jokes thrown in here and there but some very valid points are raised about why should we both touching something which has become such a standard?

"Quick, off the top of your head, what does a red octagon with a white outline represent? How about a button on a GUI that looks like a pair of scissors? What about a red circle with a red line across it from the lower left to the upper right? A button on the corner of a screen window that has an X in it? Do *any* of these things actually look like the object or process that they
represent? Does it matter?

A good icon is simple, visually distinctive, easy to recognize instantly, consistent across many interfaces. The floppy disk icon for save is all of these things, and it's also familiar to almost every experienced computer user. It could be simplified a little (removing some superfluous details, like the label and the little readonly-lock thingydo), but the basic visual is already
quite simple and distinctive. Nobody's going to mistake it for (say) the paste button. Sure, it's an anachronism, but the standard icons for cutting and pasting are scissors and paste, respectively, and nobody's used *that* method of cutting and pasting since word processing came into vogue. So what? The icons are visually distinctive enough (well, the scissors are; they should
probably have used a roll of transparent tape for paste, but it's too late to change that now) and their meaning is well established."

I think the above nailed the point really: an icon is something which is easy to recognize instantly, consistent and requires no thought. Just because the technologies that we use nowadays look different and are structured differently physically doesn't mean functionally they do not have the same purpose - to save your current file

We have recently been working on a multi-lingual website - one supported language being Korean. Thankfully, on Windows Vista, we have a pre-installed language pack which displays all of the Eastern language characters. However we were running into a problem on some Windows XP machines, that even after installing the language pack, some elements (primarily select drop-down menus) were rendering with square text rather than the Korean language.

After researching into whether or not it was the DOCTYPE of the page, if the font being used supported Korean characters, or it was infact a browser issue as the problem only occured in Internet Explorer. I was able to fix  the problem by setting the language charset for the page to Korean by using a meta tag:

<meta http-equiv="Content-Type" content="text/html; charset=euc-kr" />

So simply place this in the <head> tag of your web page and the problem is fixed. Hurrah!