Dragon School Website
The Dragon School, Oxford is one of the country’s leading preparatory schools. They asked Alberon to refresh their website’s design and make it more suitable for the wide range of mobile phones and tablets that are now so popular.
The brief
We redesigned the Dragon School website in 2010, so they weren’t looking to replace it completely, but they felt they were now ready to take the design to the next level with the “fire dragon” image we had previously proposed.
They also wanted to add more flexibility to the layout, so they could have more varied content, and to make the site easier to use on mobile phones and tablets.
Finally, they needed to make the site comply with the cookies law that came into effect in May 2012.
The solution
We kept the original Joomla CMS, but worked with the web team at the school to upgrade it to version 2.5, the latest stable version.
We built a new template using a technique called “responsive design”, where the layout is automatically adjusted depending on the screen size, so the site is easy to use no matter whether it’s viewed on a desktop PC, tablet, or a mobile phone, while the site administrators only have to update the content in one place.
We included several additional module positions, to give them more flexibility over the page layout, and created several new module layouts for different types of content – photos, text, quotes, news, and so on. These are organised into 3 columns on the desktop version, and automatically rearranged into 1 or 2 columns depending on the screen size.
The menus are also rearranged automatically to suit the screen size. On a desktop or tablet the top level links are displayed along the top of the page, and the sub-navigation on the left. On a mobile phone this would be too much to fit on screen at once, so they are combined into a single dropdown menu at the top. We then added another menu in the footer so the user doesn’t have to scroll back to the top every time they finish reading a page.
To comply with the cookies law we added a clear but unobtrusive banner above the site, where the user can quickly accept cookies (hiding the banner), or learn more about cookies and opt out of Google Analytics tracking if they want to. This gives the best balance between legal compliance, good user experience and accurate statistics – and of course this works on mobile phones too.
Technical notes
The site was upgraded from Joomla 1.5 to Joomla 2.5.
During the previous redesign we created custom components and modules, which we upgraded for Joomla 2.5 and improved upon to give the site administrators more flexibility.
Are you looking for something like this? Why not get in touch with us?
