When it first launched back in 2003, WordPress was regarded as just a blogging tool. Very quickly it took off, becoming a fully fledged CMS used on millions of sites across the world. And creative professionals have been pushing the CMS’ boundaries to create complex and beautiful WordPress websites ever since.
For those of you who still think of it as a tool for amateurs and hobbyists, we’ve picked some of the best WordPress websites around to show you just what this incredible content management system is capable of.
01. Sea Harvest
When Canberra-based seafood market Sea Harvest needed a new brand identity and smart digital presence to match, it turned to Australian web and branding agency ED. The WordPress website sports a striking newspaper-style layout with plenty of quirky touches to explore.
“When we think about seafood, many of us are taken back to a memory of eating fish and chips by the beach with friends and family,” says designer Cam Tidy.”Often these takeaway joints would wrap your food in newspaper, so it felt natural to explore that as a visual idea.”
Replicating a static, print layout on the web wasn’t without its challenges, though. The team used CSS Flexbox to reposition content while maintaining consistent spacing, regardless of screen size. Nearly every measurement is based on a responsive scale using REM units, making it easier to maintain control over type and image proportions as the browser scales.
Developer Bryn Shanahan favourite feature is the fact that users can ‘draw’ on the site, including via an interactive wordsearch. “We achieved this by covering the site with an HTML5 Canvas element which then used to draw the users drawings onto,” he explains.
ED uses WordPress for a lot of its website projects, finding it user-friendly and intuitive for clients. “[WordPress has] easy back end development, which allows more time to focus on front end to bring the design to life,” adds developer Adam Forcucci. “The ability to make it headless, using the WP Rest API, allows us to use frameworks such as React, which is becoming the core of our future development on the platform.”
noformat is a strategic design studio based in New York. The homepage features an animated eyeball design that follows the visitor’s cursor around the screen, while overlaid text cycles through all the things noformat can create. To create the eyeball, the team first explored the design in After Effects CC, before using three.js to build an interactive version, explains Ian Brewer, founder and creative director of noformat.
“We used vertex and fragment shaders to optimise for GPU rendering and make it pulsate and flash the noformat logo inside,” continues Brewer. “We then applied post-processing effects to give it a more organic and less 3D look by blurring the edges and adding bloom to the highlights.”
The rest of the site lives up to the impact of that first page, with slick on-scroll transitions and subtle parallax effects showing off tech skills without impacting usability.
“We chose WordPress for our site for speed to launch and flexibility,” explains Brewer. “Over the years we have built our own libraries and module-based editing systems that allow us to create or edit a site faster than any other CMS solution.”
03. Femme and Fierce
Dutch experience design studio Wonderland has delivered ecommerce with sass for Femme and Fierce. The WordPress website’s in-your-face, clash-tastic colour scheme delivers the online fashion retailer’s brand message from the off. Animated ‘stickers’ – twirling lollipops, jabbing arrows, licking lips – create a cheeky feel and should resonate with the Snapchat/Instagram generation at which this range is aimed.
04. Puree Maison
Purée Maison is a creative and strategic studio based in Paris. Its WordPress website stands out mainly thanks to the sunny yellow animated scribbles that appear on hover, inject personality into boring brand statements and liven up transitions. They also help the visitor find their way around, and encourage them to explore and interact with the site.
05. We Virtually Are
When your business is all about enthralling people using virtual reality to tell emotive stories, you need a site that draws people into your work. And boutique VR studio We Virtually Are has managed that and then some. Its site, built by Herdl on WordPress, uses plenty of cutting-edge techniques including WebGL and 360-degree video to give you an irresistible taste of its immersive services. Check out its VR test drives for Audi, complete with unexpected celebrity guests.
Built by Copenhagen-based design and branding agency Stupid Studios, the site for Denmark’s Design Museum not only showcases the museum’s archives, collections and research, but also presents it in a bang up-to-date style. From its opening SVG animation of the museum’s logo, through to eye-catching parallax scrolling and mood-enhancing palette swaps as you scroll through the content, it’s the perfect online presence for an essential design destination.
Want further proof that WordPress isn’t just for amateurs and small companies? Global giant Disney has used none other than WordPress to create its slick site. The pared back site design keeps things simple with plenty of white space, while rainbow accents on the text boxes add a hint of that Disney magic. The mission of The Walt Disney Company is to be one of the world’s leading producers and providers of entertainment and information. Via its professional website, it can showcase its portfolio of brands to help differentiate its content, services and consumer products.
The Chicago Sun Times is an eight times Pulitzer Prize winner and the oldest continuously published daily newspaper in the city of Chicago. It takes a solid site framework to cope with the daily influx of hard-hitting investigative features, in-depth political reports, sports analysis, entertainment reviews and cultural commentary the paper has to offer.
Although a very basic template, the site offers everything you want from a newspaper – it’s easy to navigate, clear, concise and not bogged down by animation and effects, meaning you can quickly and seamlessly get your news updates.
09. Katy Perry
Pop princess Katy Perry uses none other than WordPress to host her official website. Focusing – understandably – on visuals and social media cues, the site utilises high spec portfolio shots of the artist to make a bold statement. Scroll down to see tour dates, merch and more, or use the icons to discover more.
It’s a clean cut yet edgy site that manages to blend the artist’s distinctive bubblegum pop personal image with a user-friendly, glossy mag style functionality. Gone are the days of busy band sites packed with too much animation and music you can’t stop. Perry’s website proves you can pack in plenty of personality using just a simple white background and easily navigable links, giving fans the option to listen, watch and learn easily and at their convenience.
10. The Ink Tank
Starting out in 1989 as Collins Inkjet, a one-man operation supplying ink for Kodak continuous inkjet printer, today Kao Collins is one of the world’s leading suppliers. And if you’ve never really thought about ink (beyond cursing when your printer runs out), Kao Collins’ site, The Ink Tank, is about to change that.
Built by DBS Interactive, The Ink Tank is an eye-catching WordPress site that pulls out all the stops to bring you cutting-edge news from the ink industry and showcase some of the creative ways businesses and artists are currently using ink. The highlight as far as we’re concerned is its History of Printing section: a gorgeous parallax single-pager packed with animation and effects, taking you all the way from clay tablets to today’s high-speed single pass printing, and looking ahead at some of the future possibilities of printing.
Public service websites don’t have a great record of being beautiful or easy to use. Luckily, that trend is beginning to fade away, and Greenwich Library’s website is a great example of how to do it right.
When creating the site, the visual design wasn’t the priority, however – as a public service, usability comes first and anything else is icing on the cake. The current design is the result of two years’ worth of research, user testing and design. In a statement, library director Barbara Ormerod-Glynn explained that the site update was vital because it meant the library could provide its services 24/7. It also addressed issues people were having when trying to find what they needed in a sea of content.
The stereotypical university website tends to be a pretty sterile and dated affair. However, the Harvard Graduate School of Design’s site, designed by Upstatement, sets the bar much higher. “The GSD is a fantastic place where all kinds of amazing ideas are being generated, and we wanted to really bring out the stories and topics inside the school and surface them in a way that showcases the ideas and energy of the community,” says Mike Swartz, partner at Upstatement.
GSD’s design is striking, playful and aggressive, though it stands back and enables content to show through when it needs to. Thoughtful animations are intertwined at the right moments, without being overwhelming. Every hover state invokes an animation, helping users to interact with the content. The use of images is purposeful – none are used as a backdrop or a texture. All have a function and most are presented with a comment.
On top of all of the visual complexities, the development team behind the site took this project to another level. “Mike Burns, Upstatement’s engineering lead on this project, worked with the school to collect and modernise their infrastructure, combining it all into an API powered by WordPress,” says Swartz.
This is Your Kingdom is a site that brings together style and substance to help UK visitors find activities and attractions in their local area. Although simple in its concept, the site’s true complexity is revealed when you start to delve into its inner workings and potential.
Designed by This is Your Kingdom and robustly developed by Kim Lawler, the site is built to handle growing levels of content. Lawler used WordPress to allow site editors and guest bloggers to update content easily and regularly, giving visitors plenty of reasons to return.
The delicate, playful design hints at a wide range of activities shared on the site, and does a great job of being appealing and eye-catching, without being twee or niche. Illustration plays a big part in the appeal of the site, paving the way for imagination and exploration.
14. Travel Portland
Travel Portland aims to inspire people to visit Portland in Oregon, US, and to help them plan their trip with tools and content highlighting the unique opportunities in the city. Every page of its site has been designed cleanly, with images capturing the Portland experience – from waterfalls to food trucks.
The beautifully responsive site is built on WordPress and uses a customised responsive theme based on Zurb’s Foundation framework. Third-party APIs are also utilised throughout the site, including Storify, MapBox, Weather Underground and ChooseCulture.
The team used MaxMind’s geolocation API to enable them to customise content on the homepage based on the location of the visitor. This lets them serve different information for in-town visitors versus those in the planning phases. Clever.
Ghosthorses is the portfolio site of Stephen Fairbanks. This lovingly crafted site is laden with visual treats sure to appeal to both the casual observer and the web-savvy.
When choosing the CMS for his site, Fairbanks knew it had to be WordPress. “I’ve been using WordPress for as long as I’ve been building sites because I like how malleable it is, and the fact that it’s so popular means there’s a really good community of support behind it. Also, the Featured Image function does all the legwork of cropping, resizing and embedding my images.”
He’s also felt the blight of WP’s limited media handling capabilities, but has found a suitable solution. “I’ve moved the Multiple Post Thumbnails plug-in into my functions.php file by default now for all my sites to easily add scrollable galleries.”