Colorado SEO Design Accredidations
Colorado SEO Design Accredidations

Armour Roofing

Armour Roofing Colorado, LLC is a local roofing company based in Evergreen Colorado.  They subcontract on roofs of new housing and also serve as the contractor on re-roofs of existing homes.  One of the things that sets Armour Roofing apart from other roofing companies is that the owner takes the time to meet with and provide in person estimates.  This attention to detail ensures that your home gets a full and complete bid.  Also all jobs are have a satisfaction guarantee because they stand behind there work and are confident in their results.

Armour Roofing  Website design

01. Approach

I met with Greg Holstein about his website and his internet marketing needs.  He contacted me because he was looking at different contractor sites online and found some of my work that he liked.  I was given a fairly wide berth to work with, but the colors needed to go with the choice of the logo.  Armour Roofing had started in Sarasota, Florida and Greg was opening up the local branch here in Colorado, but he wanted to continue the companies reputation for high quality work.  Since this business was starting from scratch there was no old website or any photography assets to use.  This meant we wanted to create a site that wasn't image heavy because we would be relying on stock pictures.  Greg is a retired police officer and felt strongly about giving back to the community so this was important to include in the website.  He also wanted to make sure that the site was helpful for users and therefore needed to be user friendly and easy to navigate. 

02. Design

We used the same logo of the company in Florida so we used the same color scheme of red gray and black.  We used choices that were strong solid to help describe the company.  After looking at a variety of different sites to get an idea of project direction we decided that it was best to utilize bold headlines with Kenyan Coffe font and an easy to read neutral "Limerick" font for the body.  Animations were created on scroll down to draw attention to different elements of the website without being overly distracting.  A great website can only be great if your potential customers find it so we made sure to do research and optimize specific pages for different keywords.  To help search engine optimize the site we included schema.org and JSON-LD markup along with HTML5 to guide search engines about the layout of the site and what was on each page.

#62b5b5
#62b5b5
#e03837
#e03837
#202021
#202021
Kenyan Coffee
Kenyan Coffee
Limerick
Limerick
slider 1 slider 2 slider 3 slider 4 slider 5

03. Technology

The Armour Roofing Colorado project is a totally responsive design based on CSS Grid Layout with a Flexbox fallback.  That means the project is not reliant on an outside library of code like Bootstrap to be fully responsive.  The starting point was HTML5 Boilerplate to make sure the project was utilizing current best practices and most browser based styling was reset using Normalize.css.  We don't utilize templates so all coding was done by hand using the Brackets code editor.  The Armour Roofing Colorado team is also able to add blog articles, maintain the verbiage and images on the site by utlizing Perch as the content management system.  Every page in the project was validated and confirmed to be W3C compliant, with the exception of lazy loaded images and script enhancements that make the site load faster.  All css files are modular in nature so Gulp was used to combine and condense all CSS files in the final project build in order to make the page load speed better.  The final page load speed averages less than 1.8 seconds per page due and is helped by utilizing the free version of Cloudflare as a CDN and site optimization.  CSS and javascript animation was created by using the following libraries Animate.css, Hover.css, & T-Scroll.  Other code and libraries used include Modernizr, jQuery, Akismet and Google Analytics.  Software utilized to create this project included Brackets, Photoshop, Perch CMS, VectorMagic.com and CompressPNG.com. 

The coding and software skills used by Colorado SEO Design to make this project take off included:

  • Photoshop
  • PHP
  • HTML5
  • CSS3
  • Javascript
  • JSON
  • Schema.org markup
The Website Technology that we use