Portfolio Design Tips for New Developers

A professional, attractive portfolio is an essential component of every developer's online presence. In Week 6 of our 16-Week Immersive Bootcamp, we dedicate three days to working with you to create a portfolio that is the very best representation of the skills you've worked so hard to develop over the course. Each student also receives a comprehensive review of their final portfolio, including comments and suggestions on design, content, and structure.

New developers often spend so much time ensuring the functionality of their sites and projects that they neglect the aesthetics of their portfolio. While functionality is, of course, the most important thing to consider, you also want your portfolio to be interesting and memorable. The hiring manager is going to look at a lot of portfolios when considering candidates to fill a position, and you want yours to stand out when she thinks back over her day. Does this mean you should agonize over color schemes, and overload your portfolio with animation, super-high-quality images, and a gallery including every project you've developed? Not necessarily. A good portfolio pays careful attention to the balance between content and design.

Content is King

You've probably heard this phrase in reference to marketing, but it applies to your portfolio as well. It's easy to get carried away with fun elements like animation and wild color schemes to try to wow the visitor. When done well, elements like these can certainly add a bit of personality and fun to your portfolio, but proceed with caution. First and foremost, the purpose of a portfolio is to introduce yourself to a hiring manager and showcase 2-3 of your best projects. Slow-loading pages, hard-to-read fonts, and buggy animation will be frustrating at best, and a deal breaker at worst. If you find yourself spending hours trying to make a certain font look good, but ignoring live demo links with 404 errors, maybe you need to focus a little more on content, rather than design. Ultimately, design elements should function to highlight and complement your projects, not distract the visitor's attention away from them.

Don't Overwhelm with Information

The old adage "less is more" definitely applies to portfolios. It's often a new developer's instinct to include every single project they've ever done in their portfolio. We understand -- you're proud of your work and want to show it off! However, remember, the purpose of your portfolio is to showcase your best work. Hiring managers are busy people too; they're not going to take the time to click through a gallery of nine projects to find the best one. The truth is they're only going to look at 2 or 3, max. It's your job to guide them to your best work: the last thing you want is for them to miss your awesome final project because they're distracted by the buggy game you developed in week 1! Make sure your best projects are in the top and/or left side of the Project page, or better yet, only include 2-3 of your most impressive projects in your portfolio in the first place!

The same idea applies to your About Me page: If a hiring manager is confronted with five paragraphs of your life story, they'll probably just read the first two lines (if that). Two to three paragraphs of relevant, interesting content that introduces yourself and your interests and clearly outlines what you can bring to an employer. Remember visual cues as well -- don't be afraid to use bold, italics, and bullets to quickly guide the visitor to the parts you want to make sure they don't miss.

Stay Professional

You want your personality to come through in a portfolio, but don't forget who your audience is. Avoid oversharing in your About Me page ("After my last terrible breakup, I decided to start over by moving to Atlanta and applying to DigitalCrafts"), and make sure that if you include an image of yourself (something we strongly encourage), it's professional. No need to pay someone for an expensive headshot, but a picture of you with beers in both hands and “sleepy” eyes doesn’t do anyone any good.

In addition, be wary of design elements that could be considered "cute" or childish. Hiring managers are looking for adults: pictures of puppies, cartoon hearts, and teddy bears won't inspire confidence in your coding skills.

Would you hire this guy?

Optimize Your Images

Website user research has shown that a visitors abandon sites if they take longer than about three seconds to load. A hiring manager might wait longer, but she'll certainly take note of just how long. Don’t include any images that are over around 400 KB, as it will slow down your load time and is considered very basic front-end best practice. We’ve had an employer partner turn down a student for this very reason – it’s a red flag.

It Should Look Good

Finally, does all this mean that you should just have a sparse, white portfolio with two projects, and an About Me that just lists your development skills and no personal information? Of course not! The key is to find a balance. The bottom line is that your design elements should enhance your portfolio, not detract from the visitor's experience.

Remember, your portfolio is a work-in-progress. It is important to keep biographical information current and your projects section up-to-date as you grow as a developer.