Web Site Structure
|[ Design Home Page ]||The structure of the web site is one of the most important things to
get right! Without good structure, the management of your web site will be
difficult to say the least, and once you start to have a lot of web pages,
then it will become almost impossible to manage them.
Mine will never become that complicated, and so I don't need to bother with it, and any case, if it did, then I can think about it later.
No ! Do it now ! The longer you leave it, the more time consuming and awkward it will be to do it at all.
So.... what do we mean by structure? Well, think of filing pieces of paper - pages. There's a way to do it so that you can find them easily, and add more sheets (pages) as required, or, you can simply throw all the sheets into a room and sort them out later. People happily use filing cabinets, drawers and folders to file pages, but when it comes to computers, they often just throw the pages all into one room !
It just happens that the correct structure for filing pages, is the best structure for filing web pages too ! Your computer can do it very easily indeed.
Let's start with a simple system, and continue the analogy of the filing cabinet. The filing cabinet is the hard disk on your computer, (usually called drive c: ). We'll consider just one drawer in the cabinet. Your web pages drawer. Lets name it web
so we start with:
We may need to have more than just Rootsweb FreePages web pages at some time in the future too, for example something to do with business, or something on a different Internet file server, so lets create a folder called freepages now.
Now let's make some more folders, inside the freepages folder. The Rootsweb FreePages allows you to have lots of different topics: computers, genealogy, pets, etc. So let's create folders for them:
Why did we name them like that? Because the hard disk on the Rootsweb computer names them like that, and we want the system to be identical on our hard disk. This is where it starts to get important, because if the filing structure is exactly the same on your computer as it is on the Rootsweb computer (where you will be putting your web pages) then management of your web pages will be a piece of cake!
That's the basic structure. Now let's look more carefully at that genealogy folder (genealogy_html).
What sort of things will we be putting in there? Web pages, button and background graphics, photos of ancestors, and so on. So create sub folders for them.
The folder structure of my Rootsweb FreePages web site
(at the time of writing this - more will be added when needed)
and sub folders for:
Now I have a filing system, a filing cabinet with drawers, folders and sub folders, where I can store files neatly and where they can be found easily. What's more, I can add extra folders now whenever I need them.
If you don't have a good structure right from the start, then it will be a nightmare to change it later. That's because each web page file has links to other web page files, and if I move one page, then I would have to edit every page that has a link to it!
If I create a new web page file, then I create it in it's correct folder right from the start. Also, any graphics in that new page, buttons or photographs, are always where I can find them easily. The links from the web page to call the graphic are easy. All buttons are in \graphics\general\ and they always will be.
And I can easily have a link from here on this page:
back one folder to the main computing front page
Note: on this page where I write about my own hard disk on my own computer, I use folder names and file names with \ separators, and when I refer to files on the Rootsweb computer I refer to them with / separators. (They are just the "dividers" between the folders). It just happens that that is the conventional way of writing them down. In html web page code for web pages, links are always written the UNIX way with / dividers, because the Rootsweb computer runs on the UNIX system, and that's where your actual live web pages live.
But you keep an exact mirror copy of all of the web pages files on your own computer and on the Rootsweb computer.
You edit the page file on your own computer, test it with your web browser on your own computer, and then when you are satisfied, send it using FTP over to the Rootsweb computer. OK... I'm happy (I think!), so I'll upload this page using FTP. In any case, if I need to alter something, then I can do it easily on my copy on my computer, and then send it again, which will simply over-write the old version of the file on the Rootsweb computer. Quick final spellcheck using AOL Press.... here we go.
This page was created using AOL Press 2.0
It has virtually all of its content in a table with two columns. A narrow column 20% screen width (that only has a link in it to the home page, and the main column with all the main text in it. That's because I didn't want the length of the lines of text to be too long. Shorter lines are more easily readable.
Inside this column, there are a couple of places where I have "nested" another table, one with borders showing, and the other (describing my folder structure) without. That's how I managed to get the layout of that section correct. It is a table with six columns and lots of rows.
If you want to see the source code, and "borrow" it if you wish as a template for your own page(s), then on your web browser, on the top menu click on view | source. You can save that to your own hard disk if you wish.
Copyright ©2000 Rod Neep