CSS

'Why Study Languages' is a site which forms part of the Routes into languages initiative. It's aim is to provide fun materials to enhance language learning which teachers can use in the classroom.

The site was intended to remain fairly static once launched, so the Drupal CMS was selected as a base platform due to its familiarity to the content editors and the speed at which the site could be deployed. I translated the photoshop design to an XHTML and CSS Drupal theme, utlising jQuery for various interface enhancements including table-of-contents scrollers, image carousels and a floating social media box. The design specified some custom fonts, which I was able to implement by integrating the TypeKit font library into the site. Client-side integration with the twitter and facebook APIs was also included to help spread the word via online communities.

The site content made extensive use of video and Adobe Flash quiz content. The fancybox jQuery plugin was used to present this content in a popup (with a fallback link to the file for those without javascript). Looking to the future, video was implemented using the HTML5 video element for browsers supporting it, presenting both Theora (OGV) and H.264 (MP4) formats to support all current HTML5 video browser implementations. For older browsers with no HTML5 video support, the script falls back to the flowplayer flash video player using the same H.264 encoded video. Complex javascript and CSS was needed to keep the various popup and video overlay elements from conflicting with each other.

Links into languages was a UK government funded project to provide CPD courses to UK school languages teachers.

This was a big project, with a wide ranging remit and feature requirements. Regional teams required identical subsections on the site, separately access controlled. The site also needed to provide user accounts for customers to sign up to mailing lists and register for events, and a CRM to manage and deal with customers efficiently.

After extensive collection and analysis of the customer requirements, the site was implemented using a Drupal and CiviCRM combination. Extensive customisation was done on both pieces of software. I created drupal modules to collect custom signup information integrated with the CRM and provide navigation for some of the more complex site sections. The login form was highly customised using AJAX techniques to cope with extra custom fields and choosing from a database of over 40,000 organisations. CRM customisations included search alterations, a customised access control system and many custom reports. Integration between the public facing event registration system on the website and the CRM was also developed. An automated mailing system was also implemented to send mailshots to customers along with HTML email templates.

A custom drupal theme was produced to match the design with web standards and accessibility in mind. In particular, progressive enhancement principles were used to make sure the interactive parts of the site worked with and without javascript and/or css.

Since there was a large staff base for the administration side of the site, extensive template and css customisation of the back-end and CRM was also performed to slim down and simplify the options to the administrative users.

Routes into languages is a UK government funded project to increase the takeup of language learning among schoolchildren via providing increased support for language teachers and educators.

Working closely with the designer, I was responsible for selecting the CMS platform and implementing the technology for the basis of this site. I led a critical analysis of the client and end-user needs, and on this basis, evaluated a number of possible content management solutions. Important factors for this site were:

• The editing process needed to be very easy to use for the content editors, many of whom would not have web experience.
• The project included many partners often in other locations and organisations, and the system would need to support their remote login and access control.
• The site would need identical sections for each of the regional partners, with appropriate access control.
• The site would be a central database of events, resources etc. but registrations and content production would occur on the local level.

As a result of this analysis, the Drupal open source CMS platform was chosen for it's flexibility and ease of use for the project partners, many of whom would not have web experience.

The implementation included a custom drupal theme and extensive custom modules to support the remote registration features. All markup was designed with semantic web standards in mind.

A later update to this site via user testing and feedback brought improved navigation and graphical interest. At this point, I also implemented a jQuery image carousel into the home page.

I worked on this site over a four year period whilst employed at LLAS.

Originally a bespoke .NET CMS, I was initially responsible for the maintenance of this CMS and adding new features which involved extensive use of VB.NET and HTML/CSS. Significant work included rewriting the public facing part of this CMS from scratch to incorporate a page templating system to make the pages to be more consistently themed and easier to update. I also implemented a system for administrative staff to create monthly aggregate e-bulletins from existing material on the site.

In late 2008, the site received a major visual overhaul, and working in concert with the designer, I implemented new standards compliant and semantic XHTML and CSS for the design, incorporating strong use of jQuery for navigation and UI elements. This design incorporated a em based fluid width, which scaled the layout elements with font-size. Accessibility and standards compliance were important goals for this project. As part of this redesign, I also implemented this design as a google blogger theme which was used as an accompanying site.

In the winter of 2009, the ageing .NET CMS was beginning to show it's age and could not keep up with the client's modern requirements for it. I led a project to migrate the entire content and design into the open source content management system. This would enable the client to tap into the extensive array of community features provided for drupal, as well as provide much more flexibility for future feature requests. The migration involved extensive database migration from the old MSSQL database to a new MySQL based one, primarily through a custom drupal module to access the old database. Extensive work was also done to migrate the large taxonomies and metadata from the old system. I also reworked the HTML and CSS into a drupal theme. To ease compatibility and maintainable in the future, standard drupal modules such as views were used to generate most of the pages on the site.

As a drupal CMS, I also added several custom modules for the client, including modules to generate specific search pages per content-type, a new CCK field module with a textarea box and title, and to handle event registration. The drupal system also allowed the creation of more features desired by the client, including event registration, custom landing pages for important project themes, and integration with the University of Southampton online payments system to pay for events and conferences.