web design portfolio courtney wilbraham

Designing My Portfolio

Recently, I created my first responsive portfolioIt was challenging, but rewarding. The hardest part of the whole process, for me, was coming up with the content to summarise my skills and personality, while still appealing to my target audience

The first step I took towards building my site was research – and a lot of it. Looking at so many other beautifully created portfolios, I didn’t know where to start. I needed to figure out exactly what I wanted to include – what was the purpose of my portfolio? I sat down with a notepad and pen and wrote down a few elements to include in my portfolio:

  • I am both a Web Designer and Front-End Developer – I wanted this to be prominent.
  • Accessible on mobile, tablet and desktop devices.
  • I wanted to use some of my photography in the design to inject some personality into my portfolio.
  • Bold, attractive colours with a generous amount of white space.
  • Focus on simplicity and usability.

Once I figured out what I was going to include, the hardest part was over. I sketched out a basic wireframe and headed over to Photoshop to create some mockups. Originally I had planned to use a more feminine, warm sunset colour scheme. Although this represented me, I felt it did not fit 100% with my target audience. After several revisions, I decided to go for a more calm, reliable colour scheme, incorporating energetic orange to command attention.

Early design mockup.
Early design mockup.

When I was finally happy with my design (or as much as a perfectionist can be), I did some more research on responsive design. After reading recommendations from the online web design community, I decided to work with CSS Framework Foundation. Working with Foundation took a little while to wrap my head around, but eventually I got the hang of it.

Most of my time developing my site was taken up by cross browser testing. My aim was to make my portfolio usable in IE8+, as well as mobile devices and all other major browsers (Firefox, Chrome, Safari, Opera). After working in a commercial environment, you quickly learn the importance of cross browser testing. Sadly, Internet Explorer is still in use, to the annoyance of many developers out there. But I guess our job would just be too easy without it. Who doesn’t love a challenge? Luckily for me, I didn’t have too many issues to iron out.

The journey of designing and building my portfolio has had its ups and downs, but overall has been a fun and exciting experience. I am proud of what I have achieved so far, and will continue to search for ways to improve my portfolio.

Any ideas or feedback is greatly appreciated.

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>