Over the last three years, responsive web design has been gaining popularity and is now considered to be one of the best ways to design websites that look great on any device, from smartphones to smart TVs.
Since your content is now being viewed on more devices and browsers than ever before, you have to design it with that in mind. We had recently covered this via a technical insight article on responsive sites.
So we thought, perhaps it’s time to review what our top favorite responsive websites are. We hope you enjoy.
Starbucks Corporation is an American global coffee company and coffeehouse chain based in Seattle, Washington. Starbucks is the largest coffeehouse company in the world, with 20,891 stores in 62 countries.
Starbucks is a great example of responsive design done well in a corporate framework. Noticing that more users were accessing the site from mobile devices, the international coffee chain fully delivered a phone ready design. Appropriately detailed and well branded, this site demonstrates how well Starbucks knows its online audience.
Nurun brings together human and new technology to design brilliant products and services for tomorrow to help businesses thrive in a connected world.
The simple layout and understated menu and graphic elements presented against beautiful images communicate that excellently. This site just says ‘good design’ whether you’re viewing it on an iPhone or on an iMac and its very popular on Social Networks.
Sony, is a Japanese multinational conglomerate corporation headquartered in Kōnan Minato, Tokyo, Japan. Its diversified business is primarily focused on the electronics, game, entertainment and financial services sectors. The company is one of the leading manufacturers of electronic products for the consumer and professional markets.
Sony has done a good job of building a site that responds well on mobile devices while keeping the integrity of the design intact. We appreciate the shallow and straight forward content structure to make it very easy to find your item of interest.
- TREEHOUSE BLOG
Tree House is a software company that creates simple interfaces with spicy code.
This site is put together very well. Whatever platform you are viewing it on, you get an easy to use navigation structure. The breakpoints correspond well with the layout requirements and the result is a sharp looking site that does not degrade at any size. The main menu always looks good even when those sweet little icons go away to make room on smaller screens.
Mashable (Mashable Inc.) is a British-American news website, technology and social media blog founded by Pete Cashmore in 2005. The website’s primary focus is social media news, but it also covers news and developments in mobile, entertainment, online video, business, web development, technology, memes and gadgets.
We love this site. Mashable takes advantage of horizontal screen real estate like few responsive sites do. This is one site that has looked beyond the standard size (not just towards the smaller screens) and takes up the white space like none of the others do. Go ahead expand your browser window out as far as your screen allows and it just maximizes the space without feeling cluttered. Furthermore, the strength of the layout and menu structure does not degrade at smaller screen sizes. Nice work.
- WEB DESIGN DEPOT
Web Design Depot is a popular blog about web design and development, news, tutorials and hot topics such as responsive design, usability, typography, freelancing and much more.
We love this site mainly because of the beautiful use of typography. Notice how the menu, headline and body text resize subtly to achieve optimal legibility on all devices. Good design is all about the details and this site has the details dialed in. They are also not afraid to lose some features that would clutter a mobile screen. Advertising – gone. Tweets – gone. Polls – gone. Give the user what they want and they will appreciate it more.
- DADAAB STORIES
Dadaab Stories is an evolving online documentary and ultimately a collaborative community media project. It is a place for refugees to share their stories with the world. It’s an initiative of FilmAid, a humanitarian media organization that has been making, teaching and screening films in Dadaab since 2006.
This site is awesome! It’s the kind of responsive innovation that makes you go ‘wow’. The Dadaab Stories website actually transports you to the Dadaab African Village through the use of movie-like headers and wildly attractive design features that seamlessly transform over a variety of mediums. Take a quick scroll through the straightforward screen options and you will see for yourself the impressive attention to detail. Now that is design you can feel good about!
The Walt Disney Company, commonly known as Disney, is an American diversified multinational mass media corporation headquartered in Walt Disney Studios, Burbank, California. It is the largest media conglomerate in the world in terms of revenue.Disney was founded on October 16, 1923, by Walt and Roy Disney as the Disney Brothers Cartoon Studio, and established itself as a leader in the American animation industry before diversifying into live-action film production, television, and travel.
Nothing makes a Disney fan happier than seeing their favorite character on display. Disney’s site does a fantastic job of showcasing the company’s greatest animated stars across all screen mediums. Go ahead and resize your browser to see how seamlessly Simba and Mickey change with you. Simply magic – Disney magic that is.
- HARVARD UNIVERSITY
Harvard University is a private Ivy League research university in Cambridge, Massachusetts. Established in 1636 by the Massachusetts legislature and soon thereafter named for John Harvard (its first benefactor), Harvard is the United States’ oldest institution of higher learning,and the Harvard Corporation (formally, the President and Fellows of Harvard College) is its first chartered corporation.
Harvard’s website is well organized, simple and classically designed. You won’t find in-your-face logos or loud color schemes here: just tasteful touches of crimson red and concise, thoughtful headlines. The website’s current yet focused approach makes it a perfect example of the difference between layout and design.
- SOCIAL REACH
Last but not least, something that we are personally involved with. SocialReach is one of the websites we helped to turn into a responsive solution. Simple, but elegant. SocialReach is a new service that helps find prospective customers and lead generation using the Social Media outlets.
Again, mindful of the space available, we incorporated well sized typography and images, to help make this site work well in the space that it was designed. It also includes a “been here” memory, that allows us to prompt the user to complete the enquiry form as soon as they have reached the bottom of the page and have started scrolling back up again.