Trending: Responsive web design

By now, you've probably heard about how mobile device usage has skyrocketed in the past couple years. With this insane growth, comes a lot more people browsing websites on the web. When most people think of the mobile web experience, they think of people frantically looking up addresses and store hours on their iPhones at stoplights. However, that's not always the case.

As phones get getting quicker and more convenient, people are actually using them more and more in place of their regular computers. If you think about it, I bet you can remember a time in the not-so-distant past when you grabbed your phone to quickly look something up online, rather than taking the time to walk over to your computer.

The current mobile experience

Up until recently, if you wanted to give your users a mobile experience, you had to build a separate mobile site. Not only can building and maintaining a separate mobile site be expensive and tough to maintain, it can also be an awkward experience, as the site is often structured differently than the "full" desktop version of the site. As mobile usage increases, people are beginning to expect richer website experiences on their mobile phones. Having to pinch and zoom sites just doesn't produce a smooth browsing experience. If we want people to take time interacting with our sites, we've gotta find a way to give them a better mobile experience.So what if you could have one site that serves up both desktop, mobile, and even tablet-optimized experiences?Now you can. Enter responsive web design.

A new and improved mobile experience

Responsive design is a relatively new type of website design that is gaining a lot of steam, and becoming very popular. In a responsive design the site layout (and even content) is designed to change based on the size of the device it is being viewed on. A responsive website uses the same code for both mobile and desktop experiences, but includes additional styling that detects browser window sizes and alters the display accordingly. In fact, you can give it a try right now by resizing our site and checking out how the content layout changes as the browser window gets smaller.Responsive design isn't the answer for every site, but for a basic informational site, it can be a great way to go. It usually costs a little extra, since there is additional design, code, styling and testing to get it right. However, a responsive site is still significantly more cost efficient than creating and maintaining two separate sites.

what does a responsive site look like?

If you want to see a responsive site in action, just resize the browser on our site! If you want to view even more responsive sites, you can check out Mediaqueri.es, a gallery showcasing dozens and dozens of responsive sites.

Trending: Simpler websites

If you haven't yet noticed this trend, keep an eye out—websites are starting to cut the fat and get much simpler. People are becoming more an more harried, and simply don't have time to wade through dozens of menu options, or pages chocked full of lengthy copy.

Users are in a hurry and don't want excess information imposed on them—they just want to access the info they need, quickly and easily. In addition to users' increasingly busy lives, there are a few other things driving this change.

Social media diffuses dependence on your website

Don't get us wrong, it is still important to have a website in order to provide a consistent, branded experience for your prospects to learn about you. However, with the rise of Facebook, Twitter, Yelp, etc. over the past years, there are a lot more ways for customers and prospects to learn about and interact with your organization. Because social media has made it so easy to get in direct contact with organizations quickly, there is not as much need to provide an over-abundance of information on your website.

Users are in a hurry and don't want excess information imposed on them—they just want to access the info they need, quickly and easily.

Mobile browsing demands refined content

There is a growing movement called "mobile first" that urges web designers and developers to use the brief, often urgent tendencies mobile web users have as a litmus test for site content. Simply put, they focus on refining site content to the most basic items needed by mobile users before choosing to add additional content. With the recent surge in responsive web design, it is now possible to create one website that works perfectly in a desktop browser and also a mobile browser. However, with this comes a need to refine content so that it is brief and to the point. Increased mobile browsing is propelling the trend of simpler websites forward, as there is simply no room for fluff when you consider mobile users' needs.

So how are organizations simplifying their sites?

There are a lot of ways to simplify your site, and different steps are appropriate for different organizations. The best way to simplify your site is to revisit the content it currently holds and really consider if it is all completely necessary, or if it can be cut. This not a time to coddle pet projects, this is a time to be ruthless. Put yourself in your user's shoes—does your user really need to real full-page bios about all of your staff, or would a paragraph do? Is your about page really offering value to your users, or could the most compelling pieces be merged with other content? Sites are also getting simpler in their physical format. People are choosing single-page sites over multi-page sites, drastically reducing menu options, ditching their drop-down navigation, using shorter bits of copy paired with meaningful graphics and many other techniques to help their users get to the point quicker.

A few examples from around the web

Tired trend: Drop-down navigation menus

There was a time when drop-down menus were rampant across the web. You've probably seen them (and cursed at 'em), however, we're coming into a time when drop-downs are beginning to fade out of popularity in favor of simpler, more user-friendly navigation and content positioning.

Although there are times when drop-down navigation can be the best way to help a user navigate a site—possibly on a large, nebulous e-commerce site—drop-down navigation is often simply used as a crutch for poorly planned content. Usually, refining and streamlining the site's content would solve the problem in a much more user-friendly way.There are a host of reasons why drop-down navigation menus are on their way out the door. Here's a few of the most prominent reasons:

Drop-downs conceal users' options

By it's very nature, a drop-down is designed to hide additional options until activated. Because things are hidden, it reduces a user's ability to be able to scan the content. Once they decide to click on a menu item, they are often surprised that it triggers a drop-down, rather than the new page they were expecting. Consequently, this can be very frustrating for a user. Imagine you're navigating a website: after having made a decision to click on a nav item, you're anxiously awaiting to find the information you are looking for on the next page. However, instead of finding the information you're searching for, you're confronted with having to make another decision when a new menu drops down. This frustration is compounded when some sites add second or even third layers of drop-downs! Research shows that users "decide first, move second," which means they make a decision, then act on it. Instantly throwing up a second decision to be made can cause users to lose confidence in their decision making, question themselves, and ultimately give up on navigating the site.

Drop-down menus are difficult to use

We've all experienced the irritation of trying to click on a drop-down menu item. Drop-down menus are often extremely sensitive to mouse-overs. This means, you've gotta be in the exact correct place to click on the menu item or else the drop-down quickly scurries away, and you're faced with having to try again. This sensitivity is easily compounded, as drop-down navigation menus are notorious for acting different in different browsers. Although every site will differ slightly between browsers, it is especially tough to get all of the states of a drop-down to match properly across all browsers. The least user-friendly part of drop-down menus are that they are not as accessible for screen readers or users who have a low level of dexterity. Considering that over 25% of internet users have some sort of disability, accessibility is a very real fact to be considered.

Drop-down menus get in the way of browsing

Because of the sensitive, skittish nature of drop-down menus they often pop out when least expected. Often users "bump" the navigation when trying to get to other content, and the drop-downs fly out unexpectedly. This interrupts their flow of navigating the site and prohibits them from achieving what they are trying to do. Additionally, when a drop-down menu expands, it covers other content and obscures it from your user's view.In addition to these larger issues, there are several other peripheral issues posed by drop-down navigation:

• Drop-down navigation is not as SEO-friendly
• Drop-down menus are cumbersome to use on mobile devices (phones, tablets, etc.)
• Drop-down menus encourage navigation creep

How to avoid drop-down menus

So now that you're sold on the perils of drop-down navigation, how do you restructure your site to avoid using them? There are two steps you can take to avoid the dreaded drop-down.The first step is to have an honest-to-goodness, come-to-Jesus conversation about your website content. Is it all absolutely necessary for your users? Or is there a bunch of fluff content included to either pacify your internal team's inability to really refine the content or give the impression that you have lots to say (if you think more content equals more credibility, think again). You need to work hard to refine your content down to only what is necessary to your users. Now that the internet has invaded every nook and cranny of our lives, user are actively looking for companies whose websites give them exactly the info they need (and nothing more) in a concise, no-nonsense way.The second step is to implement a better way of navigating deeper sets of content. This can be done by using a category landing page. A category landing page enables you to give your user more information about their options, which helps them navigate smarter and make better (read: less frustrating) decisions.

More reading on this topic

• Users decide first
• Drop-down menu disadvantages
• The problem with drop-down menus in website navigation

Alphabet desktop wallpaper

Who doesn't love looking at the beautiful shape of letters? Now you can spend your days gazing at this type-tastic alphabet desktop. Available for download as a desktop or ipad wallpaper.

Download the desktop wallpaper

Download the iPad wallpaper

Why is visual consistency important to my design?

Why is visual consistency important to my brand? Branding expert Marty Neumeier explains in his book that a brand is not what you say it is, but that it is what your customer says it is. This means it is incredibly important that you are transmitting the values you want your customers to associate with your company. Once your customers start understanding what your company is really all about, it is important to continue to maintain that impression. This is where consistency comes in.

It is important to unify the entire customer experience so that it aligns with the company's values and mission. Your should do this not only for your visual design, but also at every customer touchpoint from the design of your retail or office space, all the way to how you treat your customers. President Obama's 2008 campaign branding is a great example of this consistency in action. Obama had a unique platform based on bringing change to our nation. To visually illustrate this concept, his marketing team worked to create a logo and overall visual look that was a radically departure from what most presidential campaign logos look like. To take it even further, President Obama's team demonstrated his mission in dozens of other ways, including the candid interactivity of his online presence, which attracted youthful, change-hungry supporters who rallied for him.Obama's marketing team took the core of his campaign and consistently reinforced it through every single touchpoint. Because of this, his mission occupied a distinct place in citizens' minds and drew like-minded supporters to him like a moth to a flame. No matter how small your organization is, you can achieve similar effects with your clientele by consistently reinforcing your brand through every opportunity you have—including every piece of visual design. This consistency helps develop brand recognition and fosters your customer's trust in your company. Over time, they come to know exactly what they'll get when they choose to work with you, and this reliable experience is what builds the loyalty that keeps them coming back over and over again.