Denver Illuminations
Denver Illuminations is a local niche lighting company in Denver Colorado. They have been installing Christmas and Event Lighting for almost 20 years. Denver Illuminations is a local family owned Colorado business and they aren't a franchise. One thing that separates Denver Illuminations from other companies is they are lighting professionals and not landscapers looking for winter work.
01. Approach
This project had a wide open canvas to start with as there was no logo or color choices made. The company contracted with a local designer to create the logo. This logo was the basis for the color scheme and elements of the site. A big theme of the site was "elegance" . We wanted to make sure that all the pictures were originals and showed the high quality of work done by Denver Illumiantions. The owner Melissa had previously published the old website but it was about 10 years old and needed a refresh so that was the reason the logo and the website were scrapped in favor of a new look. The company needed to be able to process quote requests quickly so it was important to have a place where the user could upload pictures so we could get a response back faster.
02. Design
The new logo and input from Melissa lead us to the deep red being the main color of the site so we worked with Paletton to find accent colors that went well with the deep red color. Elegance was the theme so we utilized Lato for headings and Ubuntu for main body text throughout the site. Both of these fonts were sans serif but did a nice job of complimenting one anther. Animations were created on scroll down to draw attention to different elements of the website and we also added an SVG animation to slowly change the color of the logo as well as quotation marks throughout the site. This included schema.org and JSON-LD markup along with HTML5 to guide search engines.
#af1639
#84635b
#a58d80
#eae2d9
Lato
03. Technology
The Denver Illumiantions 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 Denver Illuminations 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 loading images and scripts for the purpose of speeding up the website). 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 about 1.5 seconds per page and has an outstanding page speed index score. 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
