Apart from the appealing design, the rewritten engine, the vast amount of true web standards, a rather high level of accessibility and usability, Metro has gone from inform-the-public to actually service-the-public. The frontpage alone - providing direct station service info on a large AJAX enabled map - should eliminate a great deal of daily requests and frustration.

This - as well as the former - version of Metro is a product of Creuna Danmark A/S, in fact a 10-15 man job in total. The solution is based on Sitecore CMS plus a number of integrated custom build applications.

Metro offers an international website in english located at intl.m.dk as well as a mobile version at mobil.m.dk. Also, check out the nifty customizable widget offering service info directly within your own website.

This is as close to perfection as can be considering the usual cocktail of a CMS and .NET - personally I’m overly joyed with the result.

Run along now. Have a look at The Copenhagen Metro.

You’ll find a lot of eye candy and rich functionality and most importantly web standards and accessibility features throughout. Apart from the usual annoyances associated with a CMS and .NET I’m really satisfied with the final front-end result.

The entire solution, delivered by Creuna Danmark A/S, is based on Sitecore CMS with an integrated Microsoft Commerce Server to handle the product catalogue and potential online shopping.

Check out Royal Copenhagen, it has beautiful images!

• Headings for headlines? I just through in a ’span’ and style it!
• I have no clue about the difference between a ‘block’ and an ‘inline’ element and it’s never been a problem
• Contextual menus are cool when editing CSS, so Dreamveawer (or whatever application providing me options related to each element) is my best friend
• Structure reflecting the visual purpose? - Hey, I’m just the HTML-dude!
• My first priority is to transform a design pixel-perfect - I don’t have to think usability
• I always optimize for Internet Explorer
• If it validates, it’s perfectly usable and accessible

The good thing is, real front-end and working with web standards is far from rocket science - actually getting familiar with available HTML elements and corresponding CSS properties makes development more efficient and a lot more fulfilling on a personal level. Apart from personal satisfaction you’ll end up with an easier-to-maintain solution that provides actual value to your client and more importantly users and visitors.

Even though there will never be just one solution to a web project, there are definitely ways to go wrong. Usually the use of web standards will result in less inconsistency and bugs across browsers and platforms - even your CSS will benefit in size and become more manageable, as you are able to rely on default properties to a larger extent.

Why it matters

To ignore the concept of real front-end and working with web standards is simply saying you rather do it the wrong way, thereby to a degree ignoring all of the below-mentioned benefits, which again to a certain extend equals to the phrase I always optimize for Internet Explorer.

Unfortunately the We optimize for Internet Explorer 5.x and 6.0 sentence is much too often part of contracts or solution specs, which to me translates into We strive to bypass known standards by optimizing to non-standard based browsers. Being the number one browser in the market you can’t ignore it when composing commercial websites, meaning your layout has to render correctly - but that’s not at all the same.

What are the benefits

There is no reason whatsoever not to do real front-end. None. Working with web standards in just a few web projects will result in a reusable initial setup - over time you’ll discover that close to all commercial websites are based on that very same initial structure with some slight variations.

Benefits are endless and include:

• Improved performance (Less markup will result in smaller documents leading to faster loading and typically your CSS will be chached)
• Improved index and ranking in search engines, such as Google
• Maintainable code that you can actually share with a team, dig up and understand at a later point
• Accessible to everyone and not just what you think is the target audience. Remember, Google is just another blind visitor!
• Design updates/brush-ups in a flash, as all layout is (or should be) globally defined in CSS
• Standing ovations from clients and ecstatic response from excited users

So where do I start?

You start by investing in CSS Mastery by Andy Budd and if you are unfamiliar with Jeffrey Zeldman I recommend you get yourself a copy of Designing with Web Standards.

Since when did TDC share interest in horses and kids? was my first thought - but that was probably just that logo confusing me.

See, TDC just changed their cable-division name and profile to YouSee and to me it looks like someone got a little creative inspiration from their logo. I know this is far from a copy, but the horizontal colored lines, the letter rotation and all lowercased bold font type just made the odd connection.

Thinking of it the inspiration could just as well be originated from iittala’s Origo.

I wonder from where TDC got the idea to name their service YouSee… and if Thank You, who seems to take some part in the TDC design profile, helped them out…

On a side note TDC had their design profile updated (reviewed and questioned by Jacob Hage, in Danish) earlier this year.

Over the last couple of days I’ve been testing email design within Lotus Notes - table hell as it is. Playing around this application is really an outstanding experience, seems to me the entire ‘monster’ could have been replaced by Gmail, an online calendar, Backpack and a simple text processor, say Word.

This weird beast of an application is a usability nightmare, but a perfect example of how to not do it.

One of the numerous icon-packed toolbars contains both a pair of binoculars and a magnifying glass, who does what? At least I’ve seen these icons before, which leads me to belive they perform some kind of search - a simple tooltip would come in handy, but that has been left out. Needless to say, some icons are application specific and thereby non-recognisable.

I could go on and on and on, but there’s just too much.

It features a great deal of useful functionality not to mention lots of useful information. Unfortunately some validation errors will unfold, as with any CMS equipped with a ‘flexible’ editor, nothing too serious though. A great effort has been done to ensure usability, SEO, web standards and slick design through a number of various page types.

Ain’t she beautiful? Currently we are working on an English version as well as Norwegian. Ohh, did I mention this is currently where I am employed… Take a look around the Creuna universe.