Responsive Portfolio Design

Written by
Category: Design, Portfolios

With so many internet-ready mobile devices available to consumers today, how can creative professionals ensure that their online portfolio is optimized for all screen sizes? This article outlines the change that we’re seeing in today’s online world and provides a solution for this change that’s becoming very popular.

A new era

Enter any cafeteria, mall, school, or public transit system and you’ll see the next step in the evolution of personal computing – mobile. In 2010, smartphones outsold the personal computer, meaning more access to the internet via mobile devices than laptop and desktop computers combined. Also in 2010 traffic to mobile sites grew by over 600% – tripling from the previous year*.

What does this mean for your website and online portfolio? It means that an ever growing number of mobile users are visiting your website each day. Have a look at your site’s analytics to get a clear number of these visits. It’s a good bet that it’s up from the previous year.

Responsive design

With desktop, laptop, tablet, and smartphone visitors to consider, what can be done to ensure that your site is performing well at all screen sizes? The best way to accommodate all of these different devices is through a technique called responsive design. A responsively designed website has the ability to adapt to a variety of widths. It ensures that your content is being delivered in an easy to view format for your site’s visitors, regardless of their screen’s size.

For creative professionals this means that potential and existing clients will be able to view your online portfolio from any device. A responsively designed portfolio adjusts page layout elements to maximize the use of available screen real estate by:

  • scaling images to fit the screen
  • scaling text for better legibility
  • making navigation easier to use with fingers vs. a mouse
  • hiding non-essential content to prevent clutter on smaller screens

To respond or not?

Responsive design is a great idea for the modern website. However it’s not an essential component for all online portfolios. It’s a good idea to review your site’s analytics and decide if the investment is essential – do you have a significant number of visitors that are on mobile devices? How will a responsive website benefit your clients? It’s important to discuss whether or not to make your new site responsive with a professional web designer. Their experience and insight will help you make the right decision about taking that next big step online.

Responsive design examples

For examples of Responsive Design visit: Here you can see a variety of sites displaying the adaptations that a responsively designed site makes from wide to narrow screens.

* Stats taken from Mobile First by Luke Wroblewski

10 Principles of Effective Web Design for Architects and Engineers

Sign up for our newsletter to receive a copy of the
10 Principles of Effective Web Design for Architects and Engineers infographic.

Developed by Simple Square for the A+E industries, this checklist makes it easy to understand the web design process.


We can provide simple advice for taking the right steps to online success.
Connect with us by phone, email, facebook or twitter.

+1 902 452-3417