First started in February and launched in December of 2018, this was a re-brand of the existing Eclipse website which was last re-designed in 2013.
Since 2013 the web industry, tools and trends have changed drastically. This new design features the latest web software stack: WordPress, Bootstrap v3, SASS, Bower, Asynchronous loading of files (CSS and JS), Content Delivery Network, Google Maps JS API, Schema markup, web and icon fonts.
The homepage features a large header which automatically transitions into a video if supported by the user’s browser. The design is based on a modular layout with ‘blocks’ setup in the back-end with Advanced Custom Fields Pro.
WordPress was altered with Custom Post Types (Case Studies and Careers), along with a custom WP Nav Walker which allows for a mega-nav.
The custom WordPress theme was developed in SASS, with each area broken down into it’s own SASS file (E.g. _nav.scss, buttons.scss, etc). I also developed a range of custom Mixins and Functions to help with the on-going edits to the theme. You can see one of my blog posts which shows a CSS3 gradient mixin here.
By leveraging Javascript APIs such as Google Maps, a custom map was able to be created for the contact page which uses a custom style and map marker. By using Javascript, I was able to queue the CSS and JS files so they can be loaded Asynchronously.
This new site has kept the Eclipse brand relevant and up-to-date, along with helping to reduce bounce rates from visitors landing from search engines.
