What is responsive design and what does it mean for school websites?

Monday, 08 April 2019 | Written by Jonathan Wallis-Leggett; Digital Marketing Manager at PrimarySite

In brief

  • People access the internet on a wide range of device types that feature a variety of screen sizes
  • Responsive design ensures that a website looks great for every device type and screen size
  • If your school is considering a new website choose a provider who prioritises responsive design.

The way people view webpages has changed

responsive-large.jpg

Since we built our first school website back in 2002, there have been a lot of changes in the way websites are designed and constructed. Technology has improved, and processes have developed, but few changes have been as impactful as the rise of responsive design.

Responsive design is now one of the core elements driving every single website we create, but what is it and why should schools care about it?

In the past most people accessing the internet did so in one of two ways, on a desktop computer with a relatively standard sized monitor, or a laptop, meaning the vast majority of viewing experiences were the same or very similar. Websites, as a result, could be built around a limited set of needs and expectations as far as viewing experience is concerned.

With the rise of mobile phones and tablets, this has all changed, and people are accessing the internet on a broader range of devices, from small handhelds to specialised wide-screen monitors. Where there used to be a standard viewing experience for all users, there are now multiple that span a range of screen sizes and device types.

Responsive design means a good experience for everyone

The goal of responsive design is to ensure a website delivers a good experience regardless of what device someone is using.

Consider the example shown below; one image shows a website when viewed on a desktop pc, the other on a mobile phone. Both are from the same homepage, on the same site, using the same web address, but the layout is different.

Responsive blog example desktop.png

Example one: a website displayed on a desktop monitor

Responsive blog example mobile.png

Example two: the same website displayed on a mobile phone

While the two versions have a similar style, the layout has automatically adjusted to suit each screen. A bigger screen like a monitor or laptop suits the large, high-quality photography and still manages to provide quick access to important information via the navigation menus. A smaller screen, on the other hand, struggles to show the photography at its best, so prioritises information instead.

The layout on smaller devices isn’t just a matter of what fits best in the space available; responsive design also considers the needs of visitors at any given time. People using mobile phones to access a site are more likely to be on the move, and looking to find specific information quickly, so it is essential to place elements like the noticeboard, lunch menu, and contact links in a prominent place.

What does this mean for schools?

The biggest takeaway for schools is that people are accessing the internet in a wide variety of ways and using many device types. Modern websites cannot be designed primarily around a single viewing experience; they can’t even have just one mobile and one desktop experience. Instead, sites need building in a way that automatically adapts to the needs of any device type and screen size.

If your school is looking to redesign its website, we highly recommend you choose a provider who will consider the needs of responsive design and think about how your site prioritises its layout on smaller devices.

We recognise the importance of this for schools, so every single site we create features a fully responsive design as standard, if you are considering a redesign then get in touch on 01636 616 640 and speak to one of our experts.

Blog Categories

logo-footer5.width-800.jpg