Interactive Hero

It's really important to have a properly constructed hero item on the landing page of a website to set it apart from all the rest.
Header
The header appears above both layers and can use a different font from the article which can be Google hosted. The logo is inserted at the left, has adjustable width and is configured as a link which would normally open the home page.
Image Layer
On load the image layer is displayed. The images are inserted in three sizes for computer, tablet and mobile phone.
The layer slides open using the action tab with adjustable vertical position and optional animation to draw attention to it.
Under Layer
The image is inserted in three sizes using an HTML5 picture element so that it can have alt text for the search engines.
The article has a heading, text and the option for one or two internal links. The article can be inserted to appear left, center or right above the breakpoint.

Toggle Info

$399.99

The container has a two column CSS grid layout with an HTML5 <figure>and an <article> and the relative column widths are adjustable.
The info button drops down a list for specifications or features.
The styled span for price/date or whatever has controls for font size, color and align.

More Info

Footer

The large ugly, footers packed with hard to find and read information seen on most web pages have no value really and should be removed - especially on pages that will be displayed on small tablets and mobile phones.
Show/Hide
The show hide bar with an action tab to slide essential items into view is a much better solution for those who still think they actually need a footer.