Just in time for the start of the year, we released a responsive version of the design for the new student section.
It’s a first step into switching the entire site to a responsive design and over the next few months, we’ll look into rolling it out to other sections. We will also be improving the design and functionality as we go along.
CSS media queries target different screen sizes and adapt the design to the size of the user’s screen. We opted for an approach favouring fluid transitions: rather than using fixed breakpoints set by specific hardware device sizes, the elements are rearranged to fit any screen size.
We introduced Bootstrap with the release of this new design, to handle the grid, scaffolding and responsive functionality. We also took this opportunity to switch this section to HTML5. A change that has previously been made elsewhere on the site and that we will continue to apply across different sections.
If you want to learn more about responsive design, A List Apart published an interesting article on this design process.