So Just what is “Metro” anyway?

It turns out, that this is in fact quite a hard question to answer, let me explain…..

I’ve been doing a lot of research of late, because well it seems everyone wants “A Metro Style Website”.  As you can imagine I’ve goggled, and binged and read lot’s of blogs, and forums and talked to other devs, and it appears there simply just isn’t one single pure definition of “Metro”

Sure there are elements that most agree on, such as high use of typography and low use of images, and the fact that a sans-serif font is the agreed typeface (Which generally means Helvetica, Arial or similar) but beyond that there’s almost no uniform agreement.

Windows Phone 7 Started it……

How so, you may ask?

Well first off there was the whole, Black text on White vs the White text on Black debate, and which of those schemes was right for the life of the battery on the device.

MS-s recommendation from what I recall was that White on Black was the approved guideline.

Then windows 8 arrived on the scene with it’s flat colour scheme and “Live Tiles” so all of a sudden it was cool to add small images in again.

Then navigation bars 64×64 pixels wide with mono colour icons on them started to appear on every site that was supposedly “Metro” , why… probably because they appeared on the MSDN site, and as is always the case many jumped on the band wagon, rather than come up with an original idea.

Not long after, nav bars became a reasonable size again, but posts started to be opened with mono Icons where the symbology reflected the nature or the topic of the post, rather than the more traditional dropped caps.

Following this, a few daring designers decided that it’s all starting to look too flat and boring, and so started to put large images back into the document flow, and some started to use backgrounds other than white or black, which strangely enough picked up with the push on Writing Metro Apps in Win8 and a lot of the demo videos writing flicker and other “Picture” related apps being produced.

SO What does metro mean to me?

To me personally, metro means a clean attractive and well balanced page layout, nothing too flashy, but with a reasonable amount of colour and graphics in too.

Functionally, metro or not, every web site should ALWAYS follow great usability and aesthetic principles, and should always be easy to read.  Navigation should be easy to find, and it should be obvious where it will take you, page content shouldn’t cause eye strain, and you should break your text up when paragraphs start to get too dense.

Metro as far as I can see is just the buzzword of the minute that many people are trying to tie to many things that are not really metro in order to simply gain more exposure or ride the band wagon.

Back when I first started my career in coding, we had a different word for “Metro” it was called “Minimalistic”


Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )


Connecting to %s