online portfolio design

HOW PRINT MYDESIGNSHOP HOW DESIGN UNIVERSITY HOW DESIGN EVENTS HOW U Video

Register Log In

Download HOW's Best of Interactive Design Awardsto see the best of all past winners from HOW'srenowned Interactive Design Awards competition.

10 Essential Online Portfolio Design ElementsBy: Jessica Farris | March 23, 2015

Special Advertising Note: The following sponsored content is brought to you courtesy of Squares-

pace, one of HOW’s trusted partners.

I’ve said before that your online portfolio design is an essential aspect of your hunt for a job or

new clients. But building a portfolio site can be challenging for new designers and creatives look-

ing to rebrand themselves or establish a stronger online presence.

What all should go into your portfolio design? Check out our recommendations for these portfolio

design essentials:

Only Your Best Work

It might sound obvious, but simply assembling a gallery images of all of your design work won’t

help potential employers or clients determine what precisely you have to offer.

I once had a photography professor who said, “Your portfolio is only as strong as your weakest

photo.” That advice applies to design work too. If you aren’t 100% confident that every piece in

your portfolio represents your absolute best work, it may be time to pare down your gallery.

Jason Tselentis recommends featuring 8-18 pieces in your design portfolio. “Opinions vary widely

about the ‘right number’ to showcase online,” he says, “but keep in mind that you don’t want to

put everything and the kitchen sink there. This would leave you with nothing new to show come in-

terview time.”

Variety

While you certainly want to feature your best work, you also want that collection of exceptional

work to capture the breadth of your skill set. Are you a logo designer who also dabbles in editorial

design? Maybe you’re a web designer who has also launched a product line. In any case, showcase

work that reflects the same level of variety you’d include in the job descriptions on your resume.

Even if you only work in one medium—e.g., web design—you probably incorporate branding, ty-

pography, and layout design expertise into your work. It’s important to showcase your craftsman-

ship in all of these elements.

Unity

There’s plenty of debate over whether personal style trumps diversity in a designer’s body of work,

but when presenting your work in your design portfolio, you want to ensure that your portfolio

website has a sense of unity to it. Your work and your presentation method must flow nicely and

Home Design News Design Firm Interactive In-House Freelance Online Learning Events Competitions FREE Jobs Subscribe Shop

Enter Email

10 Essential Online Portfolio Design Elements http://www.howdesign.com/design-career/resume-portfolio/10-ess...

1 of 6 18/04/2015 9:02 pm

complement one another, or you might wind up compromising the overall quality of the website.

When the appearance of your designs is enhanced by the polished presentation of your work, the

results can elevate your potential clients’ and employers’ perception of your work.

PrintMag.com clued us into Jeremy Richie’s in-progress portfolio site. This design really pops,

thanks to the bright colors that complement his vivid work. jeremyrichie.net

The Perfect Platform

As Jason Tselentis explains, you might choose to create your website using a WYSIWYG editor such

as Dreamweaver, or you might select an online content management system. Thanks to easy-to-use

interfaces and responsive templates, a CMS is often the most practical choice for designers who

aren’t as adept at the intricacies of web design. Squarespace, for example, offers some great op-

tions and simple drag-and-drop functionality.

Responsiveness

As I mentioned above, responsiveness can make a CMS an attractive option for online portfolio de-

sign, but a responsive web design is actually a vital aspect of your website. These days, up to 70%

of all web traffic comes from mobile devices and tablets, so you want to ensure that you’re meet-

ing the needs of all of your site visitors by ensuring that the site adapts to every device.

It’s not just about the overall website design either—your images need to adapt as well. Save your

work as high-resolution images that have not been downsized to older standards for web images.

You can use various approaches—HTML 5, JavaScript, CSS3, or the simple functionality in your

CMS—that help you incorporate “responsive” images that seamlessly scale up to large screens and

down to small screens.Learn more about responsive website design from Chris Converse.

Personal Branding

While it may be easier to slap together a portfolio design that looks like everyone else’s, you’ll

stand out from the millions of other designers if your website reflects your personal brand.

Whether that’s a cohesive web design that reflects the essence of your work, or a unique logo de-

sign in your header, personal branding ensure that potential employers and clients remember your

website among the thousands of others they will encounter when looking for talent.

We’ve mentioned his work before, but Garrett Shaw really shows off his design work with a per-

sonal logo design that both shows off his design style and complements the presentation of the

logo design work he’s done for clients.


2 of 6 18/04/2015 9:02 pm

Custom Domain Name

It’s not generally a huge issue if the URL of your site is something like cargocollective.com/your-

name, but a custom domain (e.g., yourname.com) offers a sense of credibility and autonomy to

your website that you might not earn otherwise. You can get your own domain name for about

$20/year—or for free with your purchase on platforms like Squarespace.

Social Media Buttons

With its ever-increasing ubiquity, social media is a crucial element of your portfolio design. By in-

corporating social media buttons, you not only show that you’ve established a strong online pres-

ence, but you also enable your visitors to share your work and explore your online presence and

voice more thoroughly. Keep in mind that your social media accounts reflect your voice and your

brand, so it’s also important to ensure that you don’t put anything out via social media that you

wouldn’t want an employer or a client to see.

Blog

A design blog is one of the simplest ways to add more informa-

tion and character to your design portfolio site. Not only does it

provide potential clients and employers with more in-depth infor-

mation about your design process and values, but it can also

make your website more discoverable. Try your hand at some blog

posts that are optimized for the web and provide the design com-

munity with helpful tips in your area of expertise. The trick, how-

ever, is keeping up with your blog so that search engines can find

your blog posts. Google’s search function is more likely to list

your site higher in its search rankings if your website has fresh,

optimized content. Most content management systems enable

blogging, so find a platform you like and utilize this feature as of-

ten as possible.

Blogging can also improve your credibility as a designer, according to Roberto Blake:

Creating a design blog is a great way to establish yourself as an industry expert. While you

may not feel that you are an expert in your field, you may know something that clients and

non-designers don’t. Sharing your expertise can help you establish your credibility both

with clients and with your peers in the design industry. Creating value for other people and

passing on your knowledge and skills is the fastest ways to build credibility and to differen-

tiate yourself as a graphic designer.

Read more thoughts on blogging for designers from Roberto Blake.

That Extra “Something”

There are quite literally hundreds of thousands of portfolio websites on the web these days. In or-


3 of 6 18/04/2015 9:02 pm

der avoid that sense that you’re talking to yourself in a crowded room, I advise adding a little

something extra to set your portfolio design apart and increase engagement.

For example, Alyssa Potter’s portfolio site includes a few brief but highly professional case studies

that provide a unique and thorough look at what she offers.

ZSO, aka Sara Blake, created a gorgeous site for her illustration and design work that also includes

an extensive shop where visitors can purchase items featured in her portfolio.

There are endless ways you set your portfolio design apart from the multitude of others on the

web, but your approach is up to you. You might like to incorporate a unique animation, video ele-

ments or an interesting scrolling feature. In any case, the more you can do to differentiate your

work and your online presence, the more successful your portfolio design will be.

Still hunting for the perfect platform for your design portfolio? All of the sites above were

created using Squarespace:

While there are many web platforms that enable you to create a design portfolio, we’re particularly

fond of Squarespace, both for its versatility and its beginner-friendly usability. After all, even if

you’re not a web designer, you still need a great portfolio website where you can display your work

and demonstrate the breadth of your abilities.

Squarespace is a publishing platform that allows users to create stunning portfolios, online stores

and blogs—or all three in one. With dozens of gorgeous, customizable templates to choose from,

you can create a website that demonstrates your abilities and impresses employers and visitors

alike, all without writing code.

Once you create your site, Squarespace’s super simple drag-and-drop functionality helps you cus-

tomize the design and upload your work in no time at all. You also get a ton of handy perks, like

all-in-one service provides content management, hosting, domains, social integrations, e-com-

merce and 24-hour customer support.

The new Squarespace 7 update offers even more awesome features, including a redesigned inter-

face, new templates, a partnership with Getty images, Google Apps integration, and the Cover

Pages feature, which lets you put up a one-page website in minutes. Give it a shot with a 14-day

free trial, and use the exclusive offer code HOWMAG10 to take 10% off.

Online Course: Preparing Your Portfolio with Denise Bosler

Is it time to create or refresh your portfolio? Are you ready to switch jobs or attract a freelance fol-

lowing? Then whip your portfolio into shape in this intensive portfolio design course. During the


4 of 6 18/04/2015 9:02 pm

REGISTER

FEATURED WORKSHOP

How to Create GreatInfographicsWhen: Apr. 20 - 26This workshop offers astep-by-step guide to

creating graphs in Adobe Illustrator. Learn thevalue of infographics in this week longOnDemand Workshop.

See All Workshops

LOWEST PRICES ANYWHERE ON PANTONE®!

course, design expert Denise Bosler will help you navigate the process of creating a knockout port-

folio that not only reflects your talent, but also puts your work in front of the people who need to

see it. At the end of the course, you’ll be armed with a fresh portfolio and poised to take the de-

sign world by storm. See an excerpt from this course here.

CATEGORIESContent Management Systems, Design Careers: Industry Advice & Job Search Tips, Design ResumeSkills & Portfolio Tips, Featured, HOW Interactive: Web Design & Interactive Web Design Tips, Uncat-egorized

TAGSportfolio design

RELATED POSTS5 Ways to Present Your Online Design Portfolio [http://www.howdesign.com/web-design-resources-technology/6-ways-present-online-design-portfolio/]August/September Graphic Design News [http://www.howdesign.com/how-design-blog/august-september-graphic-design-news/]Design Trends: Case Studies in Online Portfolio Websites [http://www.howdesign.com/web-design-re-sources-technology/design-trends-case-studies-in-online-portfolio-websites/]Portfolio Design Trends: Demonstrating Left + Right-Brained Work [http://www.howdesign.com/web-design-resources-technology/portfolio-design-trends-demonstrating-left-right-brained-work/]Design Trends: Matching Your Digital Portfolio Design to Your Personal Style [http://www.howde-sign.com/web-design-resources-technology/design-trends-matching-your-digital-portfolio-design-to-your-personal-style/]


5 of 6 18/04/2015 9:02 pm

$595.00

$499.00

BUY NOW!

PANTONE® ColorSpecifier and GuideSetIdeal for non-fabricmaterials, Color Specifierand Color Guide havebeen redesigned for theultimate ...

COMPETITIONS

More Competitions

GOOGLE SPONSORED LINKS SPONSORED LINKS FEATURED LINKS

How to make a websiteWix.com

Spotlight: Company Folders' Pocket FoldersBroad selection of quality products sold by ateam of friendly, skilled experts.

Save Up to 60% on Graphic Design BooksWeb, Logo, Packaging Design & More!

Online Graphic Design Training @ HOW UGet the skills needed to compete in today'sgraphic & web design careers

Become a Design Rockstar!Subscriptions, DesignCasts and Much More


6 of 6 18/04/2015 9:02 pm

online portfolio design

Documents