A simple approach to web design...

TEXT - Works on a web page like a word processor. You can size it, color it, apply styles (bold, italic etc). Be careful of font choice because the person on the receiving end can set their own defaults...

Text Examples

IMAGES - Three simple rules

  • the images must be in one of the following formats: gif-jpeg(jpg)-png
  • the file names must have no spaces and be followed by the appropriate extension
    • dog.gif
    • car.jpg
  • the images must travel with the webpage. By inserting a graphic you are telling the web page to 'link' to the image, if the image is removed from the original location, the picture will not show up on the webpage. Move it from one folder to another... You will lose the link.
  • images can move - gif animations

Image Examples

LINKS - You can add a link to letters, words and pictures. You can link to other pages, images (open an image on a webpage) other websites (urls), movies and sounds. The links must be exact, spell it wrong, forget a period and it won't work.

Link Examples

TABLES - Tables allow you to place pictures and text in different locations on a page. They can be visible with borders or invisible. You can put a table in a table. Ever use a table in Word? If so, you will have a slight edge on understanding how they work.

Table Examples

TEXT EXAMPLES

Text that is left justified

Text that is centered

Text that is right justified

The default font

A different font (be careful)

A font set at +2

A font set at +6

A colored font

Bold

Italic

Back to the top


IMAGE EXAMPLES

Left justified

Centered

Right Justified

Picture with ten pixel border

A gif animation (Not moving? Hit the reload button)

Back to the top


LINK EXAMPLES

Click here to learn about the NBA

Click on Chris Webber to learn about him

Click here to see a picture of Chris in action.

Send email to Jeff

Back to the top


TABLE EXAMPLES

 

1x1 table with a border of 2 pixels

   
   

2x2 table with a border of 4 pixels

     
     
     
     
     

5x3 table with a border of 8 pixels

   
   

2x2 table centered - 20% of the screen

   
   

2x2 table centered - 40% of the screen

   
   

2x2 table centered - 80% of the screen

Text in the cell, left justified
Text in the cell centered
Picture in a cell Cell with a background color - text in middle

 

Text - bold, left justified, top
Color in a cell  

Invisible table, 2x2, centered, 40% of the screen.

   
   
 
 
   
   

Tables in tables...

Enough for now?

Back to the top