OZONE Asylum
Forums
Stupid Basic HTML
Good Grief...
This page's ID:
22622
Search
QuickChanges
Forums
FAQ
Archives
Register
Edit Post
Who can edit a post?
The poster and administrators may edit a post. The poster can only edit it for a short while after the initial post.
Your User Name:
Your Password:
Login Options:
Remember Me On This Computer
Your Text:
Insert Slimies »
Insert UBB Code »
Close
Last Tag
|
All Tags
UBB Help
You're right, in that <div>s are used [sometimes] for positioning...but really, only when it is appropriate. <h1>, <p>, <dl>, <ul>, <address> and a whole host of other tags are also used. The idea is you mark up your document according to *what it means*, first. Then, and only then, do you go about figuring out *how it looks*, and on what platforms and clients. The truth is, your document is going to look differently depending upon the client (or, at least it should!) You probably do not want your documents to look the same on a PC as it does on a handheld. Nor would you like it to look the same on a printed page as it does on a cell phone. Different platforms, different viewing environments = different views! Same document, same mark up, different looks appropriate to the medium being used. So, your [url=http://www.amillionlittlethings.com/shopping/products_new.php]new products page[/url], I'd probably mark up something like this: [code] <body> <h1>A Million Little Things</h1> <div id='newProducts'> <h2>New Products</h2> <h3>Product #1</h3> <img src='' alt='product 1' /> <p class='description'>lksl slsld dkd gkditi eke dsid diewo wwke did ekleke deid dke di deie eie skdiw aldl.</p> <h3>Product #1</h3> <img src='' alt='product 1' /> <p class='description'>lksl slsld dkd gkditi eke dsid diewo wwke did ekleke deid dke di deie eie skdiw aldl.</p> <h3>Product #1</h3> <img src='' alt='product 1' /> <p class='description'>lksl slsld dkd gkditi eke dsid diewo wwke did ekleke deid dke di deie eie skdiw aldl.</p> <h3>Product #1</h3> <img src='' alt='product 1' /> <p class='description'>lksl slsld dkd gkditi eke dsid diewo wwke did ekleke deid dke di deie eie skdiw aldl.</p> </div> <ul id='categories'> <li><a href=''>7 Gypsies</a></li> <li><a href=''>Autumn Leaves</a></li> <li><a href=''>Bazzill Basics</a></li> <li><a href=''>Chatterbox</a></li> <li><a href=''>Creative Imaginations</a></li> </ul> <ul id='mainNav'> <li><a href=''>Home</a></li> <li><a href=''>Shopping</a></li> <li><a href=''>What's New</a></li> <li><a href=''>Coming Soon</a></li> <li><a href=''>Idea Gallery</a></li> <li><a href=''>Design Team</a></li> <li><a href=''>About Us</a></li> <li><a href=''>Contact Us</a></li> </ul> <ul id='breadcrumbNav'> <li><a href=''>Top</a> <ul> <li><a href=''>Catalog</a> <ul> <li><a href=''>New Products</a></li> </ul> </li> </ul> </li> </ul> <ul id='auxNav'> <li><a href=''>My Account</a></li> <li><a href=''>Cart Contents</a></li> <li><a href=''>Checkout</a></li> </ul> <form> <fieldset> <legend>Search</legend> <label for='search'>Use keywords to find the product you are looking for.</label> <input type='text' id='search' name='search' /> <button type='submit' name='searchSubmit'><img src='searchIcon.png' alt='search' /></button> </fieldset> </form> <ul id='information'> <li><a href=''>Shipping & Returns</a></li> <li><a href=''>Privacy Notice</a></li> <li><a href=''>Conditions of Use</a></li> <li><a href=''>Contact Us</a></li> </ul> <p id='copyright'>Copyright © 2004. A Million Little Things. All rights reserved. Site by Silver Gear.</p> </body> [/code] Now, I did that very quickly. It's likely I left something out. Furthermore, a lot of my decisions were semantic in nature and could be argued about till the end of time by all sorts of well-meaning and intelligent people. For instance, should you products be listed as I have them, or as part of a <dl>? Should all your nav be contained within one <div id='navigation'>? Should your nav lists have <h*> before them? In what order should your elements go in the document? Make your own decisions on those things. That's not really the point. Once you have your document marked-up, then you can work on styling it. With your design, styling it "cross-browser" shouldn't be too difficult at all. If you're interested, mark up some of your pages sematically, then come back here and ask about style and positioning. There are tons of people (I'm certainly one) who would be happy to help.
Loading...
Options:
Enable Slimies
Enable Linkwords
« Backwards
—
Onwards »