Website Structure Overview

Website Structure Overview - Hopefully by now you have read
through all of the webpage’s that form part of the things you need o create a good website template.

1. Just to recap a few things I have spoken about when designing a template make sure you use a well designed table that doesn’t have the format change from one webpage to another. This is important so that your look and feel will be identical throughout our website. 2. The importance of understanding the concept of what a Tier 2 and Tier 2 webpage is. As a general rule for a website to attract lots of traffic your website structure overview must have:

  • A minimum of 10 Tier 2 webpage’s
  • A minimum of 10 Tier 3 webpage’s for each tier 2 webpage

This may sound like a lot but ideally its best to have between 125 to 250 webpage’s. Just imagine how many of these will be spidered by search engines. Attempt to keep your content between 300 to 380 words and don’t make your webpage’s all identical word counts.

3. You can also follow the advice I have given you about setting up your website folders identically on your PC or webhosting account on your server or you can use direct url links to your images and webpage’s.4. To manage your color scheme use colored images and anytime you want to alter the colors of your website just update your images.

5. Use software that works well with you and creates the html coding for you but make sure you can copy or edit your html code just in case you need to do access this code in the near future.

6. Use an image or text based navigation setup on your website. This works the best because of it’s search engine friendliness.

I hope you have picked up a few new tips and tricks that will help you build a better website template for your website. Just remember the key is to build one great template and then save this file to your webpage names and by doing building your website this way your look and feel will be identical throughout your website.

Tags:

Using Website iFrames

Using Website iframes enables you to add dynamic content via
a webpage linked to your webpage via an iframe. iframes are handy to use if you want to display identical content in every webpage with the emphasis of changing the data dynamically.

For example if you want to build a website about a city and want to add the monthly average of the pasts month weather you can add this info into your average weather webpage and then you can link this webpage to your other webpage’s by using an iframe.

Anytime you want to update the pasts months weather average you can do so by simply updating the average weather web page.  Upload your updated past months weather average web page refresh your web browser and the changes should be seen immediately.

Lets take a look an example in .

Which below example has a webpage embedded into this webpage using an iframe? The answer is both.

Using website iframes example with webpage embedded into iframe with no properties set.

iframe example with webpage embedded
into iframe with properties set.

Your iframe properties include your border thickness and scrollbars visibility ( iframe horizontal scroll bar).

If I need to change Is this cool to this is not cool I do not edit this webpage. Instead I edit the is this cool webpage and once I have done this all I need to do is upload and replace is this cool webpage and the changes should be visible once I refresh My web browser.

Adding an iframe to your webpage.

There are 2 things you will need. You will need a webpage that will display your iframe content and the iframe code itself. Create a webpage and add the content on the far left hand side right up top so your content sits perfectly in the top left hand corner.

You might want to make some code changes to your body tag by adding the left and top margin settings. These tow settings are highlighted in blue in the below html code.

<body bgcolor=”white” text=”black” link=”blue” vlink=”purple” alink=”red”
leftmargin=”0″
marginwidth=”0″ topmargin=”0″ marginheight=”0″>

iframe Source Code

<iframe name=”ifrm1″ src=”http://www.websitebuildersguide.com/iframeexample.html” width=”330″ align=”top” frameborder=”1″ scrolling=”yes” height=”75″></iframe>

All you need to do is just add the above source code to where you need to place your iframe. All you need to do is change the src url address and alter the width and height to suit your content area and you have added an iframe to your webpage. An idea is to add an iframe in a table cell so your webpage formatting does not change.

Using Website iframes - Adding to a webpage

Don’t use an iframe as means to distribute your advertising because there is no content available in the iframe itself hence it will not show any relevant adverts.

An idea where you can use an iframe is maybe in your navigation links.  Be warned if you’re going to use this method make sure on the bottom of all of your webpage’s you have a majority of your Tier 2 webpage’s text links showing and make sure you add a site map to your website so the Search Engines can spider your website.

I don’t think it is possible for a search engine to spider your website so be cautious when using iframes. They have there positives and negatives.

Tags:

Website Navigation Links

Website Navigation Links - This is the most important part of our website. It is important you do this correctly and you make t search engine friendly. A method I suggest using is either text based links or image based links (with or without mouse over over effects) and if possible avoid java applets and flash files for our navigation.

Search engine spiders love to filter through web page content and html code and one thing they search for is links to your web page’s. So you need to make sure your webpage links are visible through out your html and two ways of making sure you do this correctly is by either by using text links or links with images.

Another important aspect of your website design is to always keep your navigation links in the one area of your webpage’s. It’s important that you do not move these around from webpage to webpage because it may confuse and frustrate your website visitors. The best website design approach is to always keep things simple and by doing this you can avoid creating any problems that may arise from this.

Website Navigation Links and Your Webpage Structure

As a reminder when you create your web pages make sure these are saved in your main folder and keep all of your web page’s in this folder. The reason behind this is that you make it simple for yourself to create links from one web page to another.  You may create a mess if you have your web page’s saved in different folders and if you build your site this way you need to make sure the structure you have setup on your computer is the same structure you have setup on your web  hosting account.

Tags:

Website Folder Structure

Website Folder Structure - Before you start building your website template it’s important that you set up your folder structure correctly if you haven’t done so already for your new website. You can start doing this by creating a folder. Create this folder anywhere on your PC or Mac.

Once you create this folder open the folder by either clicking once on the folder or double clicking the folder (depending how your operating  system is configured)

and create a folder by the name of images inside this folder you created. The purpose of this is that the main folder will be where you save your webpage’s and you will place or save your images in the images folder.

So if you created a webpage and placed an image in your webpage the path would be /images/myimage.jpg

It is very important you setup your website folder structure correctly and there are important reasons for this. The main one is that when you design and build your website on your computer your website webpage’s will use the same image path that you will use on your webhosting account when you upload your website.

When you have finished building your website you will need to login to your hosting account and create a folder in your main directory and give it a name identically to your images folder you created on your computer in this case being images.

Below is an example of an actual website I designed and how I setup my folders on my pc and how I used the same folder setup on my webhosting account so all my links will work for my webpage’s and images.

Computer Folder Setup

Below is a screen shot of a folder setup on my PC. The main folder name is called www.affacademy.com and high
lighted in light blue is the images folder I have created to store the images for the website.

website folder structure

PC Folder Setup

Webhosting Account Setup

Below is a screen shot of a folder setup on the webhosting account for affacademy.com. On the left hand side you can
see I am in the www folder which is the main directory for this webhosting account setup type which may vary. In this folder I have created the images folder.

build a website

Website Webhosting Server Folder Setup

The Idea behind this is that your image path will be identical so it will work on your website once everything has been uploaded and created. If you use a folder mapping path for example like c:\mysite\images if this is the path being saved in the webpage’s the site will work on your PC but no one will be able to view the images even though you have uploaded them into the images

Tags:

Free Website Making

Free Website Making - Using Tables - When you’re creating a template for your website its highly advisable that you create a table and place your contents within a table so you can keep the formatting of your template perfectly aligned within a table. This is the best practice to follow when you’re creating a template for your website.

You can design this template however you like however I suggest you keep your navigation on the left hand side so its viewable no matter what screen resolutions and settings your website visitors have. There is more information about this throughout my website.

Below is an example of what a table would like for a website template.

Top Banner


Navigation Links

Content

 

 

© mywebsite.com

The above template example is identical to the
one used at Website Builder’s Guide

 

 

Rows and Columns

Before you create a table its important that you understand the difference between rows and columns. The identification of rows and columns is the same for Tables created in document writing software programs.

1. The black colored cells are called your rows.

Rows go across a table.

2. The light green colored cells are called columns.

Columns fill the areas between rows and generally go up and
down a table.

Banner - In this example if you were designing a template you would place you banner image here.

Navigation Links - In this example if you were designing a template you would carefully design and implement your links in he navigation links column I have highlighted in light green above.

Content - In this example you would place your content in this area.

It’s important you understand fully the concept to building your free website making template. Design and plan your template carefully. Make sure you add the correct navigation links because if you need to update these latter it will require work to make the changes.

Colors, border thickness etc are all entirely up to you to decide how to implement these or whether to use them.

Tags:

Next Page »