Posts Tagged ‘web development’

How I refactored CSS when redesigning a website iteratively

28th April 2019

Nowadays it’s thankfully common that any backend redesign of a system, website or service is done iteratively, bit by bit. I often hear that that cannot be done with the frontend, that redesigning the look of a website always means you have to do a so-called “Big Bang release“, the very risky practice of releasing all relevant changes in one go after months of working on it.
I can prove that this is not true, because I’ve done two iterative redesigns of a website twice in my last job.

When I was rewriting and redesigning most of Zopa’s website iteratively in 2013, I used a specific method to refactor the CSS. When trying to explain how I did that, I found it’s easiest to explain its principles by showing what I did in a simplified version.
Here is that simplified version.

(Note: This blog post was hiding in my drafts folder for a couple of years. Nowadays it is best practice to use encapsulated components to achieve something similar.)

(more…)

Pure CSS image lightboxes

13th May 2016

I don’t like using JavaScript unnecessarily. That’s why I love pure CSS solutions. As browsers are getting better and better at implementing CSS3 features, pure CSS solutions are getting slicker and more production-ready.

One of the few pure CSS solutions I built recently was a pure CSS lightbox. I built my solution first and then looked at the tens of other solutions out there to compare and check if I missed anything important.

(more…)

Happy Deathday, Internet Explorer!

12th January 2016

To celebrate the long-awaited, joyous death of Internet Explorer 8, 9 and 10 I baked a deathday cake for them.

The IE logo is made of blueberries which is crossed out with raspberries on top of a quark/mascarpone/custard cream on a chocolate/nut sponge base.

Going responsive or: The silent relaunch

28th December 2015

I wrote this blog post in December 2013 (and updated it in February 2014) for the company I work for, Zopa. But for some reason it never got published on Zopa’s blog. As I still think it’s valuable, despite being out-dated, I decided to publish it here on my own blog.


The Challenge

Take 5 different platforms and code bases (www|secure2|secure|blog|help.zopa.com) and make them responsive, i.e. ready for mobile devices. While doing that, redesign everything to look and behave better, make the code more accessible and don’t hold up any other work on those platforms. And do all of that on the side while working mainly on other projects.

Unify the frontend

The first thing that was clear to me was that those 5 platforms needed to share at least the same frontend code. It needed to be the same markup, it needed to have the same CSS and JavaScript and it needed to look and behave the same.

Other improvements along the way

Part of the changes would also include a redesign. The website design as it was at the beginning of 2013 was largely the same as it was back in 2006. 7 years are half an eternity in web years and some modernisation was needed. Naturally, a complete rewrite of the frontend code was required. But it was also clear that the site-wide coding quality and maintainability could be improved, along with making the site more accessible for users with disabilities.

Don’t disturb our users

Another thing our team made clear was that it needed to be done in an agile way, i.e. in small releasable chunks. That way of working also suited our designer who wanted the changes to consist of many small ones instead of fewer more radical ones, so that our users get used to the new design gradually without noticing too much of a difference. Not doing a so-called “big bang release” also minimises other risks.

(more…)

The trouble with HTML and CSS skills

15th November 2012

When talking to recruitment agents, I very often hear that having “just” HTML and CSS skills is no big deal as everyone is good at those. That’s probably because they hear and read so many times from web developers that they are really good at them. So, they think those skills are not very valuable.

But the truth is, while many developers say they have good HTML and CSS skills, most of them really haven’t. The problem is that the languages themselves are very easy (so, they might not be really lying as such). But applying them to real world projects isn’t easy at all. You could also say it’s the distinction between “CSS, the language” and “CSS, the skill”.
If it was easy, why is the quality of at least 90% of the web so crap? While working with other developers I have found that the vast majority (at least about 90%) of them are overestimating their HTML and CSS skills by far.

During the over 10 years of working in this business, I have worked with roughly 100 other web developers. And out of those only five were good enough in HTML and CSS so that I would rate them 4 or 5 (out of 5).

(more…)