2013 is an exciting year for the web design and development community. Browsers are faster than ever, and mobile phones and tablets are in the hands of more and more people every day. That means more opportunity for web designers and developers to have their content reach a wider audience.

This year we’re seeing a few trends cross over from 2010 and up, with some new design and functional pieces evolving.

Design

1. Adaptive and responsive design.

   Responsive design and adaptive techniques aren’t going anywhere anytime soon. They are current, cost-effective solutions to an evolving problem. Having a mobile site just isn’t good enough anymore, and in some cases can even hurt your web presence or business due to duplicate content and costly content management.

   Responsive design allows you to keep one content set for every device, while adapting the layout to give an optimal viewing experience for different resolutions. It’s an ongoing trend for 2013 that doesn’t show any signs of slowing down.

2. Emphasis on typography and content over heavy design.

   A few short years ago web design was trending toward ultra-glossy, apple-esque design. Not anymore. Jpeg-heavy designs are out; CSS3 and Font-Family’s are in.

   Smart devices are in almost every user’s hands by now. My grandma has an iPhone, and my even little cousins have either an iPhone or iPod touch. Website content should be able to be delivered to these high latency devices, but designers don’t want to sacrifice aesthetics.

   That’s where trends from the printing world come in: typography, clean lines, subtle patterns, and imagery only when it serves a purpose; less fluff, more value. This allows every device to have a focus on content, while feeling fresh and aesthetically pleasing to the end user. I think we can thank the print world for this trend.

3. Touch me. I’m mobile first.

   Mobile-first design accounts for the tough design architecture decisions up front.

   Big buttons are in. Hover menus are out.

   Design has to account for touch screens and desktop users, and the lowest common denominator is mobile. You can’t rightly hover on a tablet or phone, and skinny navigation is stress-inducing for phone or tablet users.

   Navigation should be quick and straightforward and not rely on a mouse pointer to get the job done.

   Tablets and phones can utilize swiping and other touch-centric navigation elements, and it would unwise to let these intuitive app-centric features go to waste on the web. Swipe it, tap it, and lastly, click it.

Development

4. HTML5 and CSS3CSS3 allows developers to use animations and other aesthetic elements that look great and cost next to nothing in terms of file size, which is great for page speed. It’s the new flash element that is high in reusability and low on bloat.

   Box shadows, gradients, and border radius’ are just the tip of the iceberg. 3D is now possible and a viable option, and techniques such as filters (think photoshop and 3D effects) are just around the corner.

   HTML5 gives developers semantics (hallelujah!), standards for movies, and more dynamic web support.

5. Ajax goodness coupled with HTML5’s “onpop” state

   Utilizing HTML5’s onpop state allows a developer to change the browser url without reloading the page. Simple, but extremely powerful.

   Using this ability allows a developer to create a website that no longer navigates from page to page, but from content to content, without ever reloading a frame.

   This saves precious http requests and initial document ready event handling. I’m still in testing phases, but I predict a 20-40% increase in page speed.

   If coded properly, the onpop state feature will allow developers to ajax in content while still having search engine friendly page URLs that are shareable and won’t break the web browsing paradigm.

   Search engines can crawl content normally, and links can still be shared, but the flow of the web can be smoother and faster than ever.