What better way to redefine one’s image than launching a brand new website. With the recent launch of our new VPS product line, we wanted to look like the serious (yet fun) company that we are. Funio.com is barely recognizable!
We are gradually standardizing all our interfaces to this new look. Soon, it’ll be the turn of our Customer Hub, our newsletter, our blog and our welcome emails. Our website is now more user-friendly, clearer and quite frankly much nicer to look at.
If you want to compare with the old website, click here.
Behind the Design
We can contemplate the new funio.com website all day, appreciate its graphical esthetics and ergonomy, but what lies behind the site is just as important, if not more. When we determined our new website needs, we already knew that an attractive design that corresponded to our identity was important. Then, we identified 3 priorities:
- Loading and navigation speed
- Mobile access
- Cross-platform
Making a Fast Website
Since we already use high-performance servers, we had to concentrate on website components to optimize loading speeds. The first important decision was made: create a static website. What’s the difference between static and dynamic websites?
- Dynamic: Your web browser asks the server for the website; the server interprets the request based on several parameters (for example, if the user is connected), then returns content adapted to these conditions. PHP websites are dynamic.
- Static: Your web browser asks the server for the website; the server returns the content immediately, not considering any parameters. Therefore, the server always returns the same content, regardless of the user. Since there is no intermediary, the website content is sent back faster to the user.
After making this wise decision, we needed to find a platform that would allow us to dynamically manage our static content. We opted for Middleman, an application that allows you to create a static website, but that also uses all the shortcuts and tools of modern web development.
When optimizing the website, we decided to use a font to replace the icons located everywhere on the website. This allowed us to reduce the number of elements loaded on the web page. For example, these icons on our VPS page are a font.
We are planning on making several additional optimizations very soon, including the use of sprites and modifying image sizes based on the browser’s size when loading a web page.
Cross-platform & Mobile
Nowadays, it’s primordial to have a website that can be easily viewed on mobile devices. We opted for a responsive design, the most recommended method by web professionals.
A responsive website uses a technique that requires only one base code for all platforms (web, mobile, tablet). The content on the page adapts to different screen widths through pre-defined breakpoints. To help us build this type of site, we used powerful libraries that are already optimized for multiple platforms, including Bootstrap and Sass (CSS).
We still have a few optimizations to make before our site is 100% mobile-friendly on all devices. Nonetheless, as I am writing these lines, our website responds very well on all devices.
Comments
Here are several of the comments made by the Funio staff when they saw the final version of the website.
- Woah! Awesome!
- Really good work, guys. Really.
- That’s our website?
- Are you sure the CTA located there will work well?
- Wow! I really have the impression that our website truly represents who we are now.
- We’ve been playing in the major leagues for quite some time now. With a site like that, we are now showing it too.
- Fantastic! What’s next?
What are your comments? If you feel like sharing, contact us by using the assistance section of your Customer Hub, or talk to our representatives via LiveChat!
