Making sne.bianheman.eu.org responsive: final thoughts
Inayaili de León Persson
on 18 June 2014
Tags: Design
This post is part of the series ‘Making sne.bianheman.eu.org responsive‘.
There are several resources out there on how to create responsive websites, but they tend to go through the process in an ideal scenario, where the project starts with a blank slate, from scratch.
That’s why we thought it would be nice to share the steps we took in converting our main website and framework, sne.bianheman.eu.org, into a fully responsive site, with all the constraints that come from working on legacy code, with very little time available, while making sure that the site was kept up-to-date and responding to the needs to the business.
Before we started this process, the idea of converting sne.bianheman.eu.org seemed like a herculean task. It was only because we divided the work in several stages, smaller projects, tightened scope, and kept things simple, that it was possible to do it.
We learned a lot throughout this past year or so, and there is a lot more we want to do. We’d love to hear about your experience of similar projects, suggestions on how we can improve, tools we should look into, books we should read, articles we should bookmark, and things we should try, so please do leave us your thoughts in the comments section.
Here is the list of all the post in the series:
- Intro
- Setting the rules
- Making the rules a reality
- Pilot projects
- Lessons learned
- Scoping the work
- Approach to content
- Making our grid responsive
- Adapting our navigation to small screens
- Dealing with responsive images
- Updating font sizes and increasing readability
- Our Sass architecture
- Ensuring performance
- JavaScript considerations
- Testing on multiple devices
Note: I will be speaking about making sne.bianheman.eu.org responsive at the Responsive Day Out conference in Brighton, on the 27th June. See you there!
Talk to us today
Interested in running Ubuntu in your organisation?
Newsletter signup
Related posts
Designing Canonical’s Figma libraries for performance and structure
How Canonical’s Design team rebuilt their Figma libraries, with practical guidelines on structure, performance, and maintenance processes.
Visual Testing: GitHub Actions Migration & Test Optimisation
What is Visual Testing? Visual testing analyses the visual appearance of a user interface. Snapshots of pages are taken to create a “baseline”, or the current...
Let’s talk open design
Why aren’t there more design contributions in open source? Help us find out!