Building brandlogic.com
Exceptional user experience is the intersection of usability and performance. Brandlogic has always created Web sites that are unparalleled in their usability. We wanted to apply that same drive for excellence to making Web sites that are unparalleled in their performance.
Why performance?
Many reasons factor into why you need to ensure your site is fast–higher Google ranking, increased customer conversions, increased page views–but most important is the increase in user experience. When a site is fast, it’s enjoyable to use. Jakob Nielsen has extensive research on this subject.
Click on the various components of our site to learn more.
Content Delivery Network
Rather than funnel our assets through a single pipe, we chose to disperse our static content using Amazon CloudFront CDN paired with Amazon’s S3 service for storage. This solution provides:
- Unlimited space for hosting images, video, JavaScript, and CSS
- A global network of edge locations, so no matter where you are in the world you get the best possible performance
- Fail-over, redundancy, and backup
- Unparalleled bandwidth
The best part is we only pay for the storage and bandwidth we use and we are instantly ready for the future.
Web server
We chose to run our own Web server within our data center to afford the flexibility to create additional applications, tie into existing systems, and also provide an ultimate back-up if there were an unimaginable failure with the CDN.
Our Web server runs in a virtualized Linux environment that allows us to quickly move the site or re-provision space or speed for almost any contingency.
Static HTML
The fastest way to serve HTML is to publish prebuilt, fully static pages. We save the server from having to do this by using our publishing framework. This makes the server lean and highly optimized to serve up HTML as quickly as possible.
JSON
To harness the rapid acceleration in JavaScript engine performance in modern browsers, we chose to push as many dynamic portions of the site to the client as we could via JSON snippets. This alleviates strain on the web server making the site faster for everyone. For other dynamic services that require server interaction, we also run Ruby on Rails. This handles form processing and integration with our search solution.
Publishing Workstation
With the drastic improvements to speed of JavaScript engines made us rethink how to structure websites. A larger processing role can realistically be pushed to the client, making it faster for everyone. Our newly envisioned structure expands on that by considering every network transaction and every server call, arriving at the fastest possible page loads.
We do this by:
- Creating a static copy of every read-only page
- Deferred loading of scripts and images
- Highly optimized images
- Combining and compressing all CSS sheets into one master sheet
- Using Google Closure to optimize and compress JavaScript
- Compressing all static content using GZIP.
- Versioning all static assets. This allows us to set files in a way that browsers can aggressively cache them. If an asset changes, the browser sees it as a new file and will automatically re-download and cache again.
Our publishing server takes raw content, combined with Liquid templates, and outputs it using a modified version of Jekyll–a Ruby powered static site generator. The publishing engine automatically takes care of converting all linked assets to their CDN equivalent URL and inserting a unique version tag. This means no more issues with an image or CSS file that is stuck in the browser’s cache!
Version control
Using Git–the defacto industry standard for distributed version control–we save all incremental changes to the source files, including images and other assets. Using the Git repository, an older snapshot of the Web site, or any individual asset can quickly be pulled and published.
Retention
Keeping multiple backups is important for business continuance, but we chose to extend that to having a complete historic backup of any published version of our site. Think of it as a WayBack machine for our corporate Web site.
Content Management System
Although we can edit the raw HTML files–and actually enjoy doing it–creating a CMS that allows for oversight and automated workflow is an important part of the project. We wanted to create tools that allow Web based authoring of any page, combined with the ability to manage related content, navigation, and elements of the page appearance.