A Guide to Responsive School Website Design

Written by Pano Savvidis // October 29, 2018

One of the most difficult decisions parents make is choosing which school their children will attend.

We all want the best for our little ones. We all want to know they’re learning in a safe, productive environment that will help cultivate their development and, ultimately, give them the right skills to build a successful future.

Researching any school your child may be able to attend is a crucial step, and the first port of call for the majority of parents is the school’s website — which is why it’s so important to get it right.

A website is a school’s chance to essentially shake the parent’s hand and prove why it’s the perfect option. Building a responsive school website is essential to deliver the best browsing experience and demonstrate everything that makes your school special.

But what does that mean and how can it be achieved?

In this guide, we’ll explore the power of responsive school website design, beginning with the basics.

 

What is Responsive Design?

Responsive Web Design (RWD) is an approach to crafting websites that provide a high-quality experience across multiple devices. We live in a world of 24/7 connectivity now: we’re not just browsing the internet at our desks anymore — our smartphones and tablets allow us to go online at any time, any place.

As the number of searches performed on handsets has overtaken those through desktops, websites have to perform to a high standard on any screen a visitor may use. Responsive Web Design focuses on running a single site incorporating elements which respond in a different way to suit the device in question.

An old-fashioned website might be made primarily to fit large monitors but is totally unaccommodating for mobile users. For example, if a page displays a table containing multiple blocks of data, this would have to be adapted to suit a smaller screen to prevent a cumbersome layout. Anyone trying to scroll across the page to read the table’s contents could become frustrated and look for the same information elsewhere.

Responsive Web Design ensures websites present visitors with the most user-friendly experience every time. Responsive design is vital to give parents the most accessible gateway to your school, offering an effective way to discover everything they need to know without a single moment of irritation.

The more you embrace this approach, the less reason you give parents to leave the site.

 

Key Features of a Responsive School Website

Responsive school websites tend to share certain elements. These combine to create a browsing experience that suits parents and prospective students alike, catering to the mother who’s researching your school at her office computer just as well as the child doing the same on her tablet.

So, what are these features and why do they matter?

Lots of whitespace

Whitespace is not just the empty parts of a website — it’s actually a major aspect of great design. Whitespace helps to make your text and images appear less cluttered, allows visitors to understand what they’re reading better and makes scanning for relevant information much easier.

Responsive school website design ensures your whitespace will remain proportionate and content will appear formatted just as well on tiny screens as bigger ones. This makes browsing far more comfortable.

Optimized visual content

Images must be optimized to display properly on all devices and load as quickly as possible. Loading times can make or break your browsing experience: if parents or children are searching for information but can’t access text because your images are slowing the site right down, they’re unlikely to keep waiting. If they do, they’ll become frustrated and be reluctant to return in future.

Image sizes must be reduced to facilitate fast load times.

An intuitive approach to navigation

Good navigation matters. Users will never appreciate having to constantly click back and forth through slow-loading pages because they tapped the wrong button or were misdirected.

Your visitors want to find exactly that they’re looking for with the bare minimum of hassle. Your school website should be built to allow for smooth, simple, intuitive navigation on all devices. Clear menus are a must, with obvious category titles and page layouts.

These key elements should guide you in building or overhauling your school website. Always keep the parents or children visiting your site, and their journey, in mind. Put yourself in their shoes and consider what would help you get the most out of the experience.

 

Helpful Pages your Responsive School Website Must Have

Your website should look and feel unique to your school. It should reflect your school’s values and goals as much as possible.

The tone of voice, images and colour scheme all need to capture the character of your school. Providing all the information parents and students require throughout the year is crucial, and there are certain staple pages you should incorporate to do so.

Calendar

Always keep your school calendar updated with relevant events, such as holidays and special occasions. Give parents at-a-glance information they can find within seconds.

Letting your calendar go out of date may indicate to visitors that your school is unprofessional and disorganized.

Teacher profiles

Parents want to know who’s teaching their children. Include a brief bio and pictures of your teaching staff to help build a closer bond and cultivate a sense of community.

Contacts

Who should parents call if their child is too sick to attend school one day? Who is in charge of organizing field trips or a school event? How can parents reach the head teacher?

Make sure you always carry up-to-date contact details on your school website, to give parents exactly what they need to reach your team. This is vital in emergencies.

 

School Jotter is an innovative platform allowing schools just like yours to build custom websites. More than 3,000 schools across the UK work with School Jotter, creating and maintaining their own domains with simple, user-friendly tools. Upload images and videos, reach out to parents with emails, host quizzes and more to engage with your community.

Please don’t hesitate to contact Webanywhere if you wish to learn more about how School Jotter can help you create the perfect website for your school.

Get In Touch:

Your Full Name *

Your E-mail Address *

Your Telephone *

Enter your message here *

Thank You, your message has been sent.

Academy Schools

access

access device

Activities

advice

affordable

anti bullying

anti bullying month

Anti-Bullying Week

app

apps

assembly

assignments

Attainment

attendance

auditory

Augmented Reality

authentic learning

bbc micro bit

beatrix potter

Becta Guide

behaviour

Behaviour Management

behaviour management software

bespoke lesson content

best

Best Practice

BETT

BETT 2014

better

birthday

blog

Bloganywhere

blogging

blogging in school

blogging tools

Blogs

Bradford

brainwashing

budget

bullying

careers

ceop

charles dickens

children

christmas

Christmas message

class

classes

classroom

Cloud Computing

Collaboration

communication

Competition

confusing

continued professional development

CPD

Create your own character competition

creative school resources

cyberbullying

cyberbullying in school

Department for Education

Derbyshire

design

design your own egg

Differentiation

don'ts

dos

dropbox

e-learning

e-learning advice

e-learning events

e-learning in the classroom

e-portfolio

e-Portfolios

E-Safety

e-safety experts

e-safety in schools

e-safety survey

e-safety training sessions

Early Childhood Education Degrees

Early Years

easter competition

easter egg competition

easy to use

Ebacc

edtech

Education

Education and Technology Conference

education experts

education products

education technology

Education Tools

educational apps

educational technology

elearning

elearning apps

elearning competition

English

Enterprise day

eportfolio

esafety

esafety survey

Events

evernote

evolution of technology in schools

expert

experts

free e-learning products

free moodle events

free resources

free teacher events

free teacher webinar

free worksheets

French

Funding

gamification

GCSE

GDPR

Google

Google Apps

government

government guidelines

grades

Guest Infographic

guides

Handheld devices

Hardware

head office news

head teacher advice

head teacher of the week

help

helpful

History

Holy Family Catholic School

homework

homework block

homework month

homeworkanywhere

how to learn faster

how-to

ICT

ideas

IMLS Framework

improve

influential schools

Infographic

integrated e-learning solutions

Interactive Whiteboards

iPad

iPads

iPhones

jargon

Jobs

jotter

jotter mobile

Jotter Mobile app

Keighley

keynote

kids

kinesthetic

Laptops

laughing

LCMS

learn faster

learn faster advice

learn faster tips

Learn module

Learnanywhere

learner device

Learner Journey

learning

learning experience

learning faster

Learning Light

learning management

learning management system

learning management systems

Learning Platform

learning platforms

Learning Services

learning solutions

learning technologies

learning technology providers

Leicestershire

lesson plan

lesson planning

lesson plans

Literacy

literature

London

m-learning

Maths

mathsanywhere

message

messaging

microsoft

mindfulness in the classroom

missed

mlearning

Mobile

mobile app

mobile apps

mobile apps for schools

Mobile Friendly Websites

mobile learning

mobilegeddon

Modern Foreign Languages

money

MOOC

Moodle

Moodle 2

moodle 3.1

moodle 3.1 new features

Moodle 3.2

Moodle 3.4

moodle birthday

Moodle Conference

moodle experts

moodle lms

Moodle partner

Moodle SIMS Integration

moodle updates

moodle vle

most popular school website

Multi Academy Trust

Multi Academy Trusts

multiculturalism

national curriculum

Netbooks

new e-learning products

new elearning products

new elearning tools

New Ofsted Framework

news

newsanywhere

North East

North Yorkshire

Nottingham

Nottinghamshire

NQT

Numeracy

office 365

Ofsted

ofsted e-safety inspections

ofsted requirements for websites

ofsted school website requirements

online

Online Collaboration

Online Games

online learning

online learning solutions

online rewards system

online safety

online spellings tests

online tools

parent

parent communication

Parent Messenger

Parental Engagement

parents

passwords

Personalised Learning

Persuasive Technology

phishing

phone

Phonics

photos

Pi

pizero

planbook

podcast

Podcasting

poems

Poetry

powerpoint

presentation

press releases

Primary

primary education

primary lesson plans

Primary School

primary school competition

primary school website

primary school websites

primary schools

Prize

Procurement

product

professional development

promoting e-safety in school

PTT

pupil premium

pupil premium webinar

push notification

push notifications

quickvoice recorder

Radioanywhere

Raspberry

raspberry pi

RE

recruitment

reducing stress

Resources

responsive websites

revision

Riots

Safe Social Networking

Safeguarding

safety

save

school

school blogging

school blogs

school broadband

school competition

school eportfolio

School Information Regulations

school internet

School Jotter

school mobile app

school mobile apps

School Payments

school tips

School Web Design

School Website

school website design

school website help and advice

school website offers

school website system

school websites

Schoolanywhere

schools

schools technology

Science

scores

Sean Gilligan

Secondary

secondary learning platform

Secondary School

secondary school teachers

Secure Social Networking

security

SEN

senior leadership team

sharepoint

Shift Fatigue

silliness

SIMS

SKE

smartphones

SMS

Social Media

Social Networking

South Elmsall Carlton Junior & Infant School

spelling software

spellings

St Andrew’s Junior School

Studen

student engagement

Student Jotter

study

studying

studying tips

style

substitute teachers

Sugata Mitra

summary blog

support

tablets

teacher

Teacher Engagement

teacher resources

teachers

Teaching

Teaching Resources

tech savvy techer

technology

technology in education

technology in school

technology in schools

technology in the classroom

Test

text

texting

The Academies Show

The Achievement of Pupils

The Behaviour and Safety of Pupils

The BETT Show

The Quality of Leadership and Management

The Quality of Teaching

timeline

tips

tom starkey

top tips

Totara

totara lms

Tour de Yorkshire

training

training courses

tricks

Twitter

University

USA Moodle Partner

usage

useful

Video

video tutorials

Videocasts

virtual learning environments

virtual learning platforms

visual

VLE

vles

ways to save teachers time

Web Design

Webanywhere

webanywhere birthday

webanywhere events

webanywhere history

Webanywhere new products

webanywhere news

webanywhere office

webinar

Website Content

West Yorkshire

World Citizenship

York

Yorkshire