Since we’ve introduced our new website about half a year ago we didn’t make many changes. We said goodbye to some team members, welcomed some new ones and occasionally added a blog post. But this week we released some bigger changes!
Why the change?
About a month ago we did some user testing. Watching these tests made us realize there were some things we could do to improve usability. We also took some steps in making the website more accessible friendly. And last but not least we improved the workflow of editing the website to make our own life’s easier.
So what changed
Here is a small list of the key things that we changed:
- A new header image on the homepage
- A lot of minor changes after user testing
- Added Grunt & Apollo
- Refactored colours to become WCAG 2 AAA compliant
- Removed jQuery
- Performance optimization
Efficiency
One of the first things we focused on was improving the workflow to edit the website. We are now using Grunt to do almost everything for us. Grunt combines and minifies our CSS and JavaScript files. Grunt is creating icon fonts for us when we add an icon to a certain folder. Grunt even serves Jekyll for us! And on top of that Grunt also checks all files for changes and refreshes the browser for us. And all we have to do is type one command in the terminal:
grunt
Usability & Accessibility
To improve accessibility all links are now underlined. We also added a clear :focus style to all the links and we added a “skip to content” link which only appears when it gets focus by using your tab key.
We also improved the content on our contact page, rewrote some pieces of content and added more internal links.
Speed
As a last step we wanted to make our website faster. One of the biggest resources we were using was jQuery. It was being loaded on every page even though we didn’t really use that much of the library.
We rewrote the responsive menu and the responsive Google map to Vanilla JavaScript and created a small JavaScript plugin to show an image gallery which can be seen in our blog.
Finally, we are also minifying and combining our JavaScript and CSS files so we have as little requests as possible. As a result the website is now completely loaded in under a second!
