Posted: Thursday 17th November 2011
Over the last couple of weeks we've been involved in putting a new face to the Pearson Schools and FE Colleges website. A great looking site in the first place, but now even more so - our team were required to put together the new HTML and CSS for the new look.
Building a new header and footer, and implementing these templates across a website with over 70,000 pages was initially a daunting thought of course but Contensis provided a controlled route to getting the template framework into a good place.
3 Easy steps
The first step involved building the new HTML and CSS locally - proving the concept on a number of dummy webpages from across the website. Secondly, we built the new templates into Pearsons existing development CMS to prove the concept. Thirdly, with a content freeze on the live website and the live server disabled for 1 week we built the new templates into their live CMS environment. Fourthly, for a seemless transition from old to new design you'll need to publish the website to a new server. Whilst working on the template side, quick previews can be made from the template to any webpage across the system to make sure your changes are panning out as you planned.
Pushing the changes through to the development server was a simple case -just submit each template to the "Content awaiting approval" console. Then bulk authorise these to the publishing server! Hey presto, a publishing server full to the brim.
Just to reiterate - this was a rebrand and not a new website. The changes needed to be kept to a minimum - days rather than weeks. This rebrand was a simple case for the most part.
So, why did it work so well?
It was fairly obvious from the start that the design had been analysed thoroughly, some reasons I believe this worked are:
The Pearson designers looked closely at the existing HTML before making design decisions
Some quick investigation of the base HTML structure before deciding your design ideas will pay dividends. From this, the approach was taken with Pearson to only change header and footer elements and a number of minimal elements within the rest of the website. Keeping template changes to a minimum - the CSS updates can easily merge into this approach.
Pearson kept major functional and structural changes separate from the rebrand
If possible keep these separate, it's not always possible but if you want a quick turn around then avoid mixing two very different types of task. These kind of changes can potentially introduce a unconsidered layout issues and a new layer of testing and will easily complicate a rebrand process.
Pearson tested each template, in every section
We tested every type of page template in the project at every level in the site structure. Each template can potentially bring with it differences in layout, the same goes for each section so ensure these are previewed at least once in all your target browsers.
Congratulations to the Pearson team for their hardwork with this, it looks fantastic!