Web Design Trends of 2012

Web Design Trends are something that all web designers should be keeping an eye on, if they want to stay ahead of their competition, but not all trends are needed or adapted, just a fad in some cases. Read More…

Web Design Trends of 2012

Web Design Trends of 2012: While you read this article, keep in mind that the shift in trends from one year to the next may be subtle, and you will probably recognize some of these trends already. But it’s our estimation that the concepts we mention below will grow and become even bigger in 2012.

One of our own personal growths this year has been Responsive web design, smart phone web sites, for the iPhone, and Android devices, we have taken the past six months to develop our skills with Mobile web design templates and frameworks, keep in Mind this is just a smaller version of web site that are on the Internet, with an extra few modifications for the CSS and Mobile platforms.

We think eventually the Mobile devices web sites will calm down and become a part of the normal way it is concept, we also have been developing with QR bar code, and custom designed applications for the mobile market.

Responsive Web Design:

We believe eventually, we’ll all stop talking about responsive web design – not because it will go away, but because it will become what’s expected. However, we don’t think this will happen in 2012. It’s still too new of a concept, and there are many web designers that are not familiar with it at all, so get learning the framework and stay ahead of your competition, there is a huge market out there, with not enough skilled designers to cover the demand right now.

The continued introduction and adoption of more an more mobile devices is what will make 2012 the year of the responsive web site, stay ahead and get learning if you want to cash in on this rapidly growing market.

Most Web designers and developers will move to the use of fluid layouts instead of fixed width, and media queries will find their way into many more style sheets – allowing more sites to easily be viewed across multiple screens sizes and devices, If you have any advice or need any further information send us an email…..

Fixed-Position Navigation:

Now this has become an Interesting topic the past couple of months, We have all run into this technique at some point in our web designer careers, mostly on personal websites or individual blogs. I have seen a large drop in this trend during 2010-2011, but a resurgence has been appearing over the last few months.

If your website doesn’t have a lot of main navigation then you only need to provide a few small links. So why not keep these visible to each user at all times?

This can dramatically improve website performance and even blend into the overall page layout with ease. The concept idea is to keep the navbar and internal links/logo locked in place as your visitors scroll through the content, get adding some to your site, and add some call to action areas, navigation is one of the most important aspects to offer the web site viewer.

jQuery has allowed for very rapid prototyping of this effect. And even without JavaScript enabled you can apply some fancy CSS code to replicate the sticky nav effect.

Most of the static navigation bars in 2011 have followed the user’s movement around from page to page. You never consider keeping your webpage content set into a slide-show-like panel for easy display. Not only does this remove the worry of screen resolution, but the navigation system is easy to work with and carries over nicely into mobile browsers. You may seriously consider this technique and all the major benefits during a 2013 site layout re-design.

Circles

This trend has actually been noticeable in web design for a bit, yet it recently had died down to lay low for a couple years. During the web 2.0 boom designers were focusing more on desktop-based trends such as drop shadows and rounded corners. But with CSS3 it’s now easier than ever to create these fancy box effects.

Additionally you can design circles and shapes without the need for any images. The impact of these features has caused designers to look at photos in another light entirely. I constantly check out portfolios for web designers and have noticed a dramatic increase in circular-shaped elements. These archetypes can be setup as navigation links, footer icons, or even displaying important portfolio works.

But the most extreme examples aren’t always the best. Circular shapes are smooth and encourage eye contact from your visitors. Use these to single out specific areas in your design such as listings to helpful resources and pages. Just the shape itself is pleasing enough to be dropped into the background and still hold a delightful effect.

Big Vector Art:

The goofy over-sized mascots you can spot throughout websites have begun to claim a brand of their own. Just a few years ago you could not find very much illustration work tied into web branding. But the quality of individual designer’s talent has improved greatly. And I can think of no better marketing brand than a lovable vector-based creature.

The many faces attributed to Mozilla and Firefox are just the tip of the iceberg. MailChimp is another great example which has set the bar higher than ever before. The infamous mailman monkey is featured all throughout the website and also throughout their iOS and Android apps.

There are a slew of unique vector dudes to be found in their layout. This kind of practice has adapted into a whole new realm of website aesthetics. And if the year 2011 has shown anything it’s that 2013 will be chock-full of these adorable vector logos!

jQuery/CSS3/HTML5 Animation

I have always recommended jQuery effects when applied in small portions. Web design must encompass the whole user experience as well as fancy aesthetics and bonus animations. Luckily advances in the jQuery library as well as CSS3 specifications allow for some really outstanding effects with much fewer lines of code than ever before.

In just this past year alone I have run into some educational tutorials to be found all over the web. jQuery is the master of front-end browser effects but unfortunately doesn’t boast 100% major support. Thus using a fallback method tied into CSS means your website is compatible with mostly all visitors and still provides an exceptional experience. I can only imagine what developers are planning for new ideas to roll out as we move closer into 2013.

Custom Font Faces:

The free online font library Typekit provides a free trial for any interested web designers. With this tool you embed a bit of JavaScript which allows you to write any custom font into CSS styles. In 2011 this trend has shot up in popularity, especially among WordPress designers trying to keep their blogs unique from the rest.

Typekit was however a buggy system with very little support up until a few years ago. Now Google Web Fonts has been giving them a run for their money, and it appears to be more popular than ever! You simply go through a library of supported fonts and Google will output the code you need to include. Then you simply reference each font by name when declaring CSS font-family properties on an HTML element.

What we find so exciting about this trend is how recently it has shot into the mainstream. It seems now even developers are creating free plugins to make custom fonts just that much easier to install. There is no uploading of fonts required, no stress involved and very little to go wrong. Blogger should take notice of this and check out some of the alternative fonts available to them.

Well that wraps it up for this post Today, we hope you found some interesting Information, and it sparked some initiative into your design thoughts, send us an email if you have any Interesting Info to share…. Until next time, Happy Designing….