Portfolio: AntarcticGlaciers.org
Brief
Build a website for science outreach, allowing the authors to easily change content, blog, add new pages and images, and analyse their website in Google Analytics (~50 pages).
Solution
The website was built on WordPress as this allows the authors to easily update the content. The theme was originally based on the Twenty Eleven theme. A slideshow with fading images and images with hover effects were prominently placed on the front page, to entice the users with interaction. Customisations to the image galleries and an “ask a scientist” contact form. The Facebook and Twitter widgets are prominently placed, as social media plays a key role in outreach. The styles were modified to ensure that they wrap round to fit on mobile devices.
Phase 2
The site was re-visited after it had grown to ~200 pages. The drop-down menus had grown and were becoming hard to use, so the site was re-structured with index pages listing the sub-pages and displaying their featured images. Greater emphasis was placed on the hierarchical navigation in the left sidebar generated via a customisation of the “Pages” widget. Old page URLs were redirected the new hierarchical URL structure, to ensure a consistent experience, via the “Redirection” plugin. The author name and Google+ profile was added to the pages, so that the author could be associated with the content in Google search results. A customisation of the “Recent Posts” widget was added to the home page to include both posts and pages.
Quizzes were added via the “SlickQuiz” plugin with styling customised. FAQ pages were added via the “WordPress FAQ Manager” plugin. The FAQ shortcode provided was customised to give more control over the FAQ list generated. Cookie information is provided via the “Implied Cookie Consent” plugin. Several improvements to the performance were made, including the use of “W3 Total Cache” plugin and serving the images from a CDN. As the references lists were often quite long, people would often not scroll down to read the comments. A shortcode was added allowing the author to mark the references section, this allowed special styling and a show/hide could be implemented in JavaScript.
You can see the screenshot of the website homepage as viewed on mobile devices (which have a narrow window) below.