WordPress design and development services for an international private school

Building a private school website that could achieve online marketing and easy content updates

When I first met the director of this international private school, he was particularly interested in learning more about WordPress design and development services. He was searching for a new provider to help meet the school’s website needs. He asked me one very interesting question at the start:

“Why go with WordPress and not a standard based HTML site, or something along those lines?”

I let him know the following:

WordPress is much more powerful and easier to do e-marketing with. It makes it faster to do updates too. If you had a simple HTML site and didn’t know HTML you would have to contact your developer every time you wanted to do something very simple, like updating a phone number or fixing a typo in your writing.

On the e-marketing side, if you ever wanted to get into search engine optimization, it would make someone like me much more efficient because it’s less coding and manual work to do, so the amount that I (or another e-marketer) could produce in an hour would be maximized, resulting in more ROI for you.”

Shortly after, we were on an international call, discussing the school’s needs. I got to learn about the amazing work this organization does to advance education, and educational standards in their country. It was truly inspiring. And I was hooked.

He showed me their current site, and I let him know what I thought was wrong with it. It was crowded, and not focused. There was no clear strategy of where to take the site visitors after they landed on the home page. The home page contained everything – it was a hodgepodge of random bits of information.

But some very important information was missing on their old site: how amazing they are!

Talk about competitive advantage and unique selling proposition! This school had a low teacher-to-student-ratio, a high graduation rate, modern programming and more. They send kids to the world’s top universities. They’re accredited in this and that educational something-or-rather. The school director speaks at events on educational topics.

Most of all – they were the first in their region to implement iPads across the entire school. That meant, all students got an iPad. They used the flipped classroom model to teach with the iPads, and by using iTunes U. All teachers were trained in how to do this. No more textbooks. It was so advanced for their time, even Apple knew about them (so I was told).

They also had altruistic motives. They helped underprivileged kids by collecting school tuition donations. They also made some of their iTunes U courses available for free online, so other teachers with fewer resources could access them.

And, if that weren’t enough, they were running full speed ahead. In just a few short years, they implemented a French program, the IB Diploma program, and coding instruction as part of their core curriculum. Oh, and the students meditate once a week too!

Whatever’s up-and-coming, this school does. They are highly commended by educational evaluations too.

Ok, so, back to their website.

All of the above had to come across somehow. They also had a goal to do SEO on their site, to attract more registrations.

I helped them identify the core goals of the site. We decided on increasing registrations and collecting donations. These would help direct the ‘why’ behind the site features we’d implement.

The original site design, and all subsequent designs, made the call-to-action to register very visible. It showed up in the above-the-fold area of the home page, and at the top of the sidebar on all interior page template designs.

We also originally had a donation widget on interior sidebars. The client had later decided this wasn’t a primary goal for the website (plus, donations would require getting in touch – they couldn’t yet accept electronic payments).

The home page gave all the reasons why a parent would want to register their child for the program. At first, we had school statistics to showcase the results that the school had to show for itself. Later, this section was replaced with three columns to direct people to the core programs available at each school. This was important after the implementation of the IB program and the French program.

The home page also had large hero-section features, such as for displaying the iPad program, testimonials or the location of the school (which was also an attractive option for parents).

However, we didn’t forget that SEO was a goal. So, to make room for text (which would help SEO ranking), we made a section that would ‘expand’ and ‘collapse’. This long text wouldn’t get in the way of the design aesthetics, while still being there for anyone who wanted to know more.

The blog archives were custom-templated, using a 3-column layout. Each post had a call-to-action at the end of the a content area.

The team page used a plugin to showcase the bios of school leadership.

The design direction was also a big consideration for this client. The school really did their homework on web design. During the discovery interview, they scoured the Internet looking for the best web designs they could find. They had a pretty clear idea of what they wanted. One of those ‘wants’ was introducing new colours to their design. They were able to change their logo to accommodate a new colour palette. They also wanted pastels.

To add to the ‘education’ theme of the design, we created a repeatable background of iconography to do with education. This was subtle, and meant to fade-out, so as not to be too cliche.

The reiteration of the site into three separate websites was a different story.

Firstly, the idea was to be as budget-friendly as possible. We did this by utilizing a consistent template across all three sites, which would be similar to the original, but with new additions. It would create a seamless transition between the three sites. But, it would be able to adapt the aesthetics easily, so that a dominant colour would distinguish each one. Meanwhile, the colour palette for the organization was also updated to be a bit more ‘bold’ than previous pastel hues, which were used on the original site redesign.

The client also requested new branding on one of the schools. They wanted it to be more technology-focused, which had to come through in the ‘look’ of the site. But, it couldn’t depart too far from the main organization’s branding. And, let’s not forget budget was an issue! So, to accommodate this, the designer brilliantly implemented a new, thinner font, took out the iconography, and created cool geometric image tints for photos.

All three sites were ‘connected’ via a utility bar of links to each school’s website. The client insisted on using separate domains for each site. Though, I did suggest they go with WordPress MultiSite, like I did for this other education company (and for similar reasons explained in that other case study). That said, they certainly had needs to differentiate their sites with separate domains. And, it’s the client that has the last word!

After we did the web design and development on this WordPress site, the client got to work adding in their new content, which they were able to do on their own using the content management system available in WordPress.

And, I’m happy to say, I’ve been working with this client for years on other projects too!

Features of this school website project:

• WordPress design and web development, using the Genesis Framework.
• Typography, iconography and colour palette design.
• Correlated design schema to span across three sites, connecting a single brand, with three organizational branches.
• Calls-to-action widgets to help encourage registrations, including one in the above-the-fold area of each page, and another in the after-post widget area.
• Themed form designs, to match the rest of the custom school website design.
• Newsletter sign-up widgets to help build an e-mail list.
• SVG and high-density display icons, with a custom icon font, to avoid blurriness on retina screens. These included file-type icons to show for downloadable files (such as school newsletters).
• Static footer background image to appear during scrolling, for an interesting design effect.
• Google calendar embed for a simple way to display the school calendar while remaining in budget.
• Team member plugin implementation with overlay features to show bios of the school leadership team.
• Expand & collapse areas using JavaScript, such as for longer text on the home page, or the FAQs. This was to help reduce the length of the pages, and to allow users to only show information they want to see.
• Implementations for foundational, technical SEO.

Accolades from the client:

Joyce has been a gem to work with. She’s meticulous and extremely knowledgeable in internet marketing strategies; that has helped us build our websites with her. She’s a talented and detail oriented. We love working with her!

Michel Khoury

Director at Eastwood International School

Other work done for this client:

This client hires me for ongoing maintenance and updates to their site. That has included requests for new features.

They also hire me for some SEO, which includes comprehensive copywriting. This project is still in the works. So far, it has involved:

• Keyword research report to identify top searched for phrases in their industry.
• Selecting which pages to index or no-index, and to correlate that with the sitemap.
• Keyword edits to include searchable phrases in their web copy.
• Structured data implementation for each location site using JSON-LD tags, custom coded.
• Running a basic Adwords campaign.
• Advising on SEO best practices for the team.

And so on.