A website due three years ago

Posted: August 7, 2017

When I started my freelance career in 2014 I should’ve made a portfolio. It’s what you do as a new kid on the block, right? But I didn’t: I had clients who were waiting for me to get started on their website, and – as so often while freelancing – whatever gets money in the bank is what you’ll work on.

Now it’s (past!)mid 2017 and I finally managed to create something that resembles a site for my business. Yeah.

I suppose the biggest stumbling block was finding time to build something myself (because honestly, would you accept a developer who didn’t make their own site?) without losing focus.  There are always cooler, better ideas and newer code to play with. I can’t open Codrops without feeling a mighty need to tinker with a cute piece of CSS or Javascript. I guess the cliché is true; it is harder to design for yourself.

But here we are, at last!  Some points I discovered for myself after three years of trying to build this site:

  1.  Don’t use Photoshop/Illustrator for making full-page web designs.  Graphic programs are for – you guessed it – graphics.  I’m not saying you shouldn’t open it up at all just that you should use it for defining style elements (colors, typography, borders, details) instead of trying to create every screen of the site.
  2. Designing in the browser is slow but it keeps the process rooted in your technical toolkit. Somehow that makes it easier to push the boundaries and helps you learn things that you wouldn’t even have considered otherwise.
  3. Having a solid understanding of your brand is golden. I really recommend reading this article by Darius Foroux if you feel stuck at this point. He hits all the right points that are important about branding. Note: it’s not what you think.
  4. Design the most important page first. Guess what: quite often it’s not the homepage. In my case the portfolio (work) page and project detail pages were the key that unlocked the rest of the design.
  5. Take some time off from client work to build your own stuff: be it a website, product, new invoicing template, whatever. If it’s something you need you should invest in it.

 

Acknowledgments

Quick shout out to Duncan who was kind enough to help me with editing the site copy (not this post though, this nonsense is all me). He’s been absolutely great to work with and I recommend his work to anyone looking for a copy editor. You can get a hold of him on Twitter or via email.

In case you’re more technically minded: this website uses SmoothState.js for the page transitions and Chocolat.js for all lightbox related fun. Everything else is just some plain ol’ (well, not so old) CSS.