internet Brothers internet brothers logo

Maggi Norris

22nd of July 2000

     Maggi Norris is webmistress of seven award winning sites, including her own Ask Nem5 Nemesis World Index, where you can find original literature displayed with original graphics and photography, web awards and more. Free resources for the new and advanced webmaster include: email accounts, web and desktop graphics for personal sites, several short tutorials, email greeting cards and an HTML help forum with a web design software review.

     She recently contributed an article titled Design Concept to the web site planning section of IB Helpware. Following are excerpts from that article.


     You now have an idea what you want on your site, where you want it to be, and how you want it to work. It is time to create the actual design using all this information. A friend taught me an important shortcut for getting the design right the first time. The first thing I do is draw a crude outline on paper. Then I use an imaging program to render that drawing on the computer. I use the image to make the first of two templates that will help put the final touches on a design.

     In your imaging program construct a new file the size of an open browser window. My browser uses the toolbar across the top and I view my computer at 800x600. So I make my files 800 pixels wide by 450 high since that is the size I see in my browser window. I use this new file to represent the area that will be my page in a browser and it becomes my Image Template.

     Make the background color of the template the same color you want on your site. Place your images on the template the same way you would want them on the page. Place your text and any other objects you would want on the model. The result will be your main Image Template. It should look like a screenshot of a web page. You can use the template to build the actual images that will go on your page. Simply crop them from the template. Using your Image Template will help you see how to set the spacing on tables and other HTML basics as you make your next template.

     After I finish the Image Template it's time to create the HTML Template that will help me layout each page of the site. The first thing I do is put the colors, fonts, head tags, logo and tables in place. Then I build the navigation system into the code. I name this page Template.html and use it to create all the other pages.

     Next, you can copy and paste the content from a text or document file into the HTML Template and once you name it, you have a new page. Placement of images and objects may require adjustments to the basic template, but most of the work will already be done.


     To view the entire article, please visit the web site planning section here at Internet Brothers. While there, avail yourself of the other features that will help you get a nice jump-start on this important phase of web site development. My sincerest thanks to Maggi Norris for her contribution to this expanding resource.

IB Community

Interviews

Lucid Confusion

IB Presents

Inspirations

IB Helpware

<<   <   ABD   >   >>

 


 

Support the Digital Divas

 

net.weblogs.com
...an experiment in freeform discourse

 

 

 

 

IB Community

Interviews

Lucid Confusion

IB Presents

Inspirations

IB Helpware

 

 

Archives

top       

Home     Community     Confusion     Awards     Links     Helpware

Copyright 1997-2000 Internet Brothers. Not that you'd want any of it.