Creating this Page — In HTML
Before I add the completed menu graphic to the bottom layer of the page, I make sure of two things:
1. That the width of the menu matches the most common screen resolution used on the Internet today, which according to many experts is 1024 x 768. The dimensions of the menu graphic I use are 1024px X 149px.
2. That the hexadecimal color of the defining tab and the page below it match. I do this to give a seamless appearance to the whole page, so that it looks like the single inside page of a file folder. For example, I set the body background color of this page to hexadecimal #F0F9FE to match the color of the defining introduction tab.
I enclose the 1024px X 149px menu graphic, which includes logo & tabs, within division tags with the following attributes: position: absolute; left:-25; top: 0; width: 1024; text-align: justify; z-index: 1; It is especially important to make sure the z-index is set at 1, which makes this very nearly the bottom layer. Dreamweaver automatically assigns the next higher z-index to each new layer that is created. For instance, among its other attributes, the introtab division tag, a new layer, will have a Z-index of 2.
Introduction
Journal
Lyrics
Storefront
News
Contact Me
• Introduction
• Creating This Page
— In PhotoShop
— In HTML/CSS
Stretch Layout
The Body
Web Design Theory
The Fold
The Masthead
Resources
Sitemap
My Web Sites
About Me
Journal
Lyrics
News
Storefront
Contact Me
Previous Page
link to next page
In the illustration above, you see the HTML for the text layers over the bottom graphic with the introduction tab highlighted, the Dreamweaver design view of the menu graphic with Introduction tab highlighted, and style sheet attributes for the introduction tab that define its position on the page just over its corresponding tab on the graphic.
Introduction: Creating This Page Web Design TheoryResourcesSitemapMy Web Sites
Journal: EvaFrankOut of the MistThe New FrontierThe DawningIn DreamsThe SearchA Phantom Reality
Lyrics (1970-1996) • StorefrontNews — Tell the Truth and Shame the Devil • Contact Me
©2007-2008 Glen F. Nemeth • All Rights Reserved