Everlast.com: A Case Study
Tuesday July 24th, 2012
We recently launched the new Everlast.com, and we'd love to tell you why it's so exciting.
Everlast is the global leader and industry standard when it comes to boxing and other fight sports. Here’s a quick peek under the hood of the new Everlast.com and a little insight into why it was such an exciting and successful project for us. We’ll focus on three things. It’s responsive, it utilizes updatable HTML5 video, and it’s infinitely scalable as Everlast’s business grows.
It’s Responsive
First and foremost, the new Everlast.com is responsive. Not many large brands can say this (although that number is growing). The benefit for Everlast is that with one build and one launch, they have a beautiful, new website for all browsers, tablets, phones, TVs, and any new device that comes out in the future.
Everlast homepage, shown across a few different devices
Everlast athletes page, shown on desktop and on mobile (extended to show the scroll)
Furthermore, they update their content through the Brolik Dashboard, our proprietary CMS, which updates all devices with the new information at the same time.
View of the Brolik Dashboard for Everlast.com, editing an Athlete page
It Uses HTML5 Video
Built on top of the responsive framework is an infrastructure for completely updatable, scalable HTML5 video. This means that Everlast can upload a single video file, whether it’s Quicktime, a Flash video or any existing format they already have, and the website gets to work in the background converting that video into five different file formats, each with its own purpose for displaying video in different browsers or on different devices. We hooked into a service called Zencoder to help with encoding, and we’ve been nothing short of blown away by its power.
Screenshot of the Everlast.com Media page and the custom HTML5 video player
Furthermore, all video on the site scales and responds to browser size, with the option to expand into full screen mode. The player controls are all CSS-based, and even the Flash fallback for older browsers gets updated with that same, single stylesheet. For the guts of the player we used Video.js, another really impressive tool.
It’s Scalable and Flexible
The last thing we’d love to point out is future-proofing and scalability. Everlast currently has three main areas of focus when marketing their business and products: Boxing, MMA and Fitness. They were interested in potentially highlighting “women” as another key area of focus in the future, though, and they might want to add another sport down the road, as well. Instead of building them a hard-coded page for each sport with its own hard-coded “media,” “athletes” and “technologies” pages, we created a custom tagging system that allows Everlast’s website to grow seamlessly as the brand evolves.
On the backend, site-wide, Everlast can tag athletes, media and other content with different sports or mark them as “women,” so that the content gets displayed wherever is applicable on the front end. The tagging system is infinitely expandable. This means that in the future, the site can quickly and easily scale to fit the changing needs of their business, whether they add another sport or decide they need a section that shows Olympic-only athletes, for instance.
View of the taggin feature in the Brolik Dashboard for Everlast.com
In addition, tagged content is “page-agnostic” and gets displayed on the front end based on the tags. So, for instance, when Everlast uploads a wallpaper image and tags it with “boxing” and “Andre Ward,” that single piece of content will show up on the media page, the boxing media page, and on Andre’s athlete page. All with a single upload. Then if Everlast wants to change the title or blurb for that wallpaper, one edit updates that wallpaper site-wide.
We ended up with a product that merges a number of new technologies and smart systems. We’re very proud of it. As Everlast moves forward, they have the ability to quickly and easily update their site everywhere their audience will see it, and they can constantly control their brand in the rapidly growing and changing digital world. Keep watching them as they push their content out faster and more beautifully than ever before.
