When presented with my first development project, my instinct was to jump straight into writing code. Turns out I was getting a few steps ahead of myself and Jeremy had to rein me in and take me back to basics.
I was refactoring the markup and CSS for the Silverback 3 site—a straightforward single-page site.
Step one was to break the task down into smaller chunks. First: thinking about the process and researching it; allowing time to consider the options. This is when I learnt that pen and paper are my friends! I put the HTML onto a diagram, wrote down the different image formats, marked out fonts and made a list of each step I needed to take during the build. Looking back, the funny thing is I always thought it was quicker to dive straight into code. Turns out that taking more time at the start saves time in the long run.
When coding, I learnt that focussing on the HTML first is a great place to start. With a quick glance in the browser it is very easy to see if the structure looks right. It also benefits to check the HTML on a mobile device. For example, this could reveal issues with adding the viewport meta tag.
This brings me to possibly the most challenging learning curve I think I will have to make. Class names. How long is acceptable to spend thinking about class names?! It feels strange for this to be the most difficult thing about coding, but it isn’t easy. CSS should be maintainable and therefore classes should be re-usable and specific. Again, this makes total sense and I can’t wait to work in this way again. Hopefully naming classes gets easier the more you do it!
Finally, one of my favourite lessons of the week was working from the smallest screen up. I started with fonts and checked that they worked on small devices. Then I added colours and styles. Once everything looked good on the smallest screen, I added a breakpoint and relevant styles, tested it, and so on. I read a brilliant blog post by Brad Frost who shared a quote by Stephen Hay that sums it up nicely - “Start with the small screen first, then expand until it looks like shit. Time for a breakpoint!”
I had a great first week. I learnt loads about Clearleft’s way of coding and thinking and I love it. Learning from the one of best people in the industry is pretty awesome too!