As you see, it has all the classic examples of doll layouts. A header, an iframe area, and a couple of links areas. Just suited to our usage here.
Below, You can see the basic layout of a website.
The dolling community is one of the most sickly in the world as regards their site layouts. Sure people have lots of pretty ideas for backgrounds, but they are all implemented the exact same way! "slice slice slice iframe lol slice". This makes making a website far more difficult than it needs to be! It also makes maintaining a website far more difficult than it needs to be. I will teach you how you can make a website with two sections in the middle without having to resort to slicing and all kinds of terrible table things!
Note: If you have a proper webhost, then you should consider using PHP to make a template for your site, rather than resorting to IFrames. I am going to assume here that most people reading this tutorial are on free host such as Geocities and don't have access to such things. Something along those lines might come up later:)
If you look at any random doller's site code, you'll see a jumbled mass of tables, trs, tds, and a million little numbers proclaiming the size of each. I know this because I have helped many a doller make a success out of their layout by getting rid of that mess and replacing it with something that is sensible to the human eyes. We call this something Cascading Style Sheets. CSS is a marvelous tool, and by using something called a <div> tag, we can eliminate almost all of your table needs! In fact, the only thing you should need a table for afterwards is well, tabular data like spreadsheets:}
I made a little example page in photoshop very quickly with one of my favorite dolls thrown into the background just for variety so it's not boring. This is what I'll be using.
As you see, it has all the classic examples of doll layouts. A header, an iframe area, and a couple of links areas. Just suited to our usage here.
Below, You can see the basic layout of a website.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html><head>
<title>Snowy-day</title>
<meta http-equiv="content-type" content="text/xhtml; charset=ISO-8859-1" />
<style type="text/css">
<!--
-->
</style>
</head>
<body>
</body>
</html>
You have a Declaration at the very top saying what kind of document the web browser should expect (you don't have to use strict, in fact, visit the W3C and find out what you should use!), an HTML tag to start off the web-pagin', a Header tag, a Title, a Meta tag which tells what kind of encoding that the file is in,(this isn't important, and you can just use the one right there in most cases. Other meta tags tell search engines about what is on your page. They aren't as important anymore, but they're a good place to put information), the Style tag is the important one for this tutorial, but we'll get to it later. Just notice that it has something called a "Comment" in between its start and finish. Comments are not shown on the web; if you put one in your body, you can type whatever you want and no one will be able to read it unless they look at your code. Then there's the meat of the webpage, the Body tag, and then you're done!
I'm sure most of you readers have heard of CSS, if only because you read about it above! (lol). This CSS is the stuff that goes in that Comment. It doesn't have to go there, there are other ways to use CSS ( instead of everything in that style tag (the comment too), you could just put <link rel="stylesheet" type="text/css" href="style.css" /> and put all of your styles in style.css,) but embedding it like this makes it easier to show you!
First, find out some more about terms used in CSS/HTML. Then, the next page teaches about how to use CSS.