Site Inspiration

The Blue Havana Cigars site redesign inspiration came from two distinct sources. The first was the result of my reading about Web standards,CSS, SEO, and usability. The second was more about the images used. This site has been tested in IE6, FireFox, and NS7.

CSS and web standards

After seeing several beautiful sites that utilized the concepts of web standards and CSS layout I decided to try the method on a small site that would be managable. I had previously built a simple frames based site for Blue Havana Cigars, but it lacked something. The redesign goals were to keep content and layout separate for easier maintenance, to be standards compliant, and to function identically across all browsers. You can learn more about web standards by visiting w3c.org. For more about CSS design I recommend CSSBeauty.com or CSSZenGarden.com.

Imagery and layout

Initially I created a concept page for the store owner using an image of Havana's bay with a blue tone and torn edges for the header. He recommended I contact a friend of his who visited Cuba recently and obtain some images from him. Most of the images he had were snapshots but there were 6 that had potential and 3 made it into the design. I altered the images in Photoshop elements by adding a hue but erasing the hue where I wanted color to come through. The store owner really liked the angled point of view of the sign and cars.

The layout concept came about due to the large image size used in the header. I originally thought text might flow from the image area into the white space, but that was not as appealing as I had hoped without making the overlapping whitespace less transparent. Moving the menu into the image area gives me the important stuff at the top of the page without increasing height of the page.

If you would like to know more about the design of this site or the techniques used, please contact me at eric@esearing.com.

Note to developers and designers - The content of the site is protected but you can use my design concept or CSS. The CSS file is on the root as master.css (or newmaster.css).