In the spirit of fairness and equal time, I’ve pulled together 10 examples of some private and independent schools who really have it going on when it comes to their websites. Like the article I recently wrote on the top 10 school district website design examples, this one’s for the private school administrators who’ve decided they need a new website and want to review some of the best and brightest out there.
What makes great website design even more critical for private schools is that they are under more pressure to create compelling websites, for, frankly, they are in a much more competitive environment than their public school counterparts. Next to cranking out stellar graduates, enrollment marketing is a top priority for private and independent schools faced with the economic pressures that won’t be relieved by that next tax levy or DOE grant.
While to a degree some public schools are competing for students in the school choice/open enrollment landscape, private schools have to attract the students and families they need to survive. Whether it’s getting more students or – in some cases – improving the quality of the enrollment, schools are employing the full mix of communications tools, and a solid website is at the heart of their efforts.
Top 10 private school website design criteria
Besides avoiding the seven fatal mistakes in school website design, all of the schools in my top 10 do several things right. Responsive design (adapting to any mobile device) and social media integration are driving many of today’s best designs. Because your website needs to be ‘readily’ viewed on any number of mobile devices, a clear, well-organized navigation is critical to being compatible with responsive frameworks. Visitors should also be given many opportunities to engage via your popular social media channels.
Many of today’s savvy school websites are taking a queue from the commercial websites that feature a grid approach and card layout (think Pinterest), that relies on scrolling to create a descending order of priority that schools want to use for their messaging. This best-practice formate allows website visitors to determine what order they want to read the content. Also, high-quality feature images (more faces the better, right?) and videos score high points in my eyes.
In addition, an overall simplicity should permeate your site design (think Apple products); quick links and frequently accessed information – news and calendar information, for example – should jump out at you.
Here's my top 10 private school website designs:
This 1,100-student school is celebrating its 60th anniversary this year in the high desert, and its website reflects a grasp of not only history, but the power of modern online communications. A strong social media emphasis, including an about page laid out in Pinterest fashion, makes it natural to engage with this site. One of things I like about the quicklinks menu is a link to the blog by the head of school. It’s important to make your school’s leaders accessible, and a blog is the perfect forum in which to do that. Although the main navigation is quite intuitive and well thought out, a prominent search window cashes in on the preferred way people tend to seek information these days.
Summit Country Day
This gem of a day school in Cincinnati uses student progress and achievement in a compelling way on its homepage to herald its 125-year anniversary – a mark few schools can boast. In a very competitive market with many good options, Summit takes an almost business-like approach to telling its story, including a page that touts customer satisfaction results from both student and parent perspectives. The school website features a well-organized video library, with comprehensive overviews of the lower, middle and high schools, respectively, and many vignettes featuring alumni, parents, staff and current students.
This all-boys school’s homepage features a bright and inviting collage of photos on a roomy grid (see card layout) with rotating images and teaser headlines pointing to upcoming calendar events. The school’s other key content hubs – admissions, fundraising, and alumni community news – are also featured on the main grid. The colorful drop-down menus from the mega menu make it easy to find what you’re looking for. Gilman’s social media component is obviously strong, as evidenced by the cool “Greyhound Nation” section of the website, which features look-ins to the school’s live Twitter and Instagram accounts, interspersed with admissions and calendar listings.
St. Joseph's Prep School
The opening video sequence on this homepage alone is worth the trip. Let’s face it: people love video – whether it’s the authentic, user-generated stuff anyone with a phone can create, or the higher-end, produced versions that lead off the homepage welcome video on St. Joseph’s. There’s even some aerial shots that I would bet might’ve been captured using a drone-mounted camera. An all-boys Jesuit school located in Philadelphia, St. Joe’s follows the lead of many of its Jesuit counterparts with a decidedly fraternal feel, with community service and athletics results/schedules calls-to-action quite accessible. An amazon.com tie-in enables a percentage of any online purchase to benefit the school.
The Blake School
Branding is especially important to the private/independent schools competing for that next student (and his or her family), and Blake does a great job articulating its unique position in the Minneapolis market. A distinctly international feel permeates the Blake brand from square one, as the homepage greeting is in several languages and the school’s global and cross-cultural educational mission is made clear. The site further reinforces its international profile with a ‘Global Focus’ page that’s easy to find and features links to its Global Online Academy and service-abroad options that are encouraged for all students. Like every good website design, there is an uncluttered openness to the Blake site that, besides looking great, allows it to work well across all mobile devices
The Archer School for Girls
This one’s a personal favorite of mine, for its use of simple design elements and bright, snappy colors combines to make it fun to view and easy to navigate. Besides a utility menu that sits atop the header, the color-coded main navigation is boldly presented smack dab in the middle of the screen, superimposed over featured photos that depict typical day-in-the-life-of scenes from this all-girls school. The color code is carried out through each main section, making it super easy to know where you are at all times. Archer recognizes the importance of family when it comes to support and decision-making, so the school has a page just for grandparents – pretty cool. The school also gives visitors multiple ways to connect to school leadership with links to head of school’s Tumblr, Twitter, blog and videos.
St. George's School
A small school with a larger-than-life website for sure, St. George's School nails its brand. In addition to the main navigation, which scrolls up from ‘under the fold,’ this website’s homepage embeds aspects of the school’s strengths in a storytelling menu that captures the culture of the school. Things like rigorous academics, a spectacular seaside campus, and a quintessential eastern boarding school show clearly that this is no ordinary school, nor ordinary website. Cool roll-over calls-to-action on the admissions page simplify the choices for the visitor with direct: A. inquire, B. visit, and C. apply options to qualify the prospective student or family member. The site also utilizes an automated pop-up to alert visitors to some very timely, sensitive legal issues currently surrounding the school. Very savvy.
Mentone Girls Grammar School
We had to go down under to find this one. The Mentone Girls Grammar School uses white space exquisitely and incorporates lively red accents throughout to take you where you need to go. The designers put some major thought into the red theme (e.g., red blazers in photos, social media buttons, etc.) but it doesn’t come across as overdone. I’m apparently not alone in my high praise for this site either. The Web Marketing Association bestowed best school website honors on it. Another cool aspect of this site is the red button at the footer of the homepage that invites you to explore the site, then takes you to the site map. This saves valuable real estate, but still affords visitors to see the big picture on what’s where. Great use too of contrasting (blue) color for key call-to-action buttons for tours and applying.
St. Timothy's School
This site does what every great school website should do: tell a great story (or stories, as the case may be) about the school. Your website is your best avenue to share your stories. Testimony too is one of the most powerful examples of support you can bring to any case being made, and St. Timothy’s School uses it prominently. Select pull quotes from alumni and parents appear across the bottom of the homepage, providing some compelling words. They spent some time on the featured key photography too – it's very good. Another great part of the school’s website is the Headmaster’s Blog, which is written not just by the headmaster himself, but by various contributors. Here at Campus Suite, we’re big believers in blogging as a great way to share ideas and your organization's personality, all the while encouraging engagement.
The First Academy
This website is designed for interaction, making it one of my personal favorites. From the start, the visitor is given so many options to engage using seven separate calls-to-action that rotate through. Short headlines, simple teaser, and a clear, clean CTA button for such items as: download the new mobile app; watch a live stream of the Christmas production; sync the school calendar with your personal calendar; news, giving, special recognition and even a call for hiring teachers. I love the design of the homepage, which is laid out like a comprehensive infographic, including compelling stats and figures and CTAs that make you want to scroll.
What are some that you like?
I must admit that there is nothing scientific about how I chose my personal top 10 best private school website design examples. I do pride myself, however, on staying on top of web design (and larger design) trends, and am continuously seeking to hone my craft. One of the requirements of any good designer is to keep an eye out for who's doing it right.
I'd like to know if you've any favorites you'd like to share with me and my readers. Leave a comment below or email me. Tell me what schools are knocking it down when it comes to their website design – and why you think they are.
Also, Here's a follow up article you might want to check out this article that explores five tips for a great school website design.
As co-founder of Campus Suite, Steve believes behind every great school is great communication. His tech savvy and passion for design fuel his desire to help administrators understand, embrace and seize the power of web communications.