 |
 |
 |
 |
| STRUCTURE | TABLES | WORDS | PICTURES | NAVIGATION | FORMS | HOME PAGE |
Web Guide Online
Your
computer
History
of the 'Net
Getting
Online
Plan
on Paper
Content/words
Content/pictures
Research
tool
Hello
Dreamweaver
Organise
& Define
Design
& Colour
Using
Tables
Style
& Templates
Adding
text
Adding
pictures
Navigation
& Links
Interactive
Forms
Simple
Animation
Arabic
translation
Test
and Publish
Marketing
PICTURES ON YOUR WEBSITE
Pictures
are a major part of your visual design but they can cause problems if
the file size is too big. On average people will wait no more than 5
or 6 seconds for a picture to download.
There are specified file formats to use with images on the web because
of this important size factor - keep the file size as small as possible
so that the download is not too slow. Use GIFs for logos and small pictures
and JPEGs or PNGs for photographs (half tones).
Adding pictures:
To add a picture or graphic to your page, click into the table cell
where you want the image to appear and select Insert > Image.
From the dialogue box which appears select your graphic from your ‘images’
or ‘pix’ folder. As it is downloading it will appear in
its original size - so it must be correctly sized in advance using a
graphics program called Fireworks. We will deal with this further on.
The picture will go into a default position and you can use the Align
option in the Properties Inspector to move the picture to align with
the text in different ways. The two options most commonly used allow
text to run alongside the picture - align either right or left.
You can also add space in pixels horizontally (H box) or vertically
(V box) in the Properties Inspector to move the image within
its cell. Note that when the picture is selected the Properties Inspector
is showing relevant information about the picture.
Altering the size:
The Properties Inspector also shows the picture's width and height dimensions
in pixels and you can force these to different sizes by selecting the
bottom right corner of the picture and dragging. However this is a NOT
a good practice for the following reasons:
• It will distort the picture (see opposite)
• If you are increasing the size it will reduce the sharpness
and quality of the picture
• If you are decreasing the size of the picture it will still
remain at the larger file size and download time will not be at its
optimum.
The picture below is badly distorted by stretching the depth of the original picture above.
