Dreamweaver Tutorials

DCSD | Staff Devlopment | Catalog
Hypertext | HTML | Basic Page Layout | Start | Menus | Properties | Panels | Objects | Document | Editing | Prefereneces
This area not open yet
Fair Use Guidelines | Inserting Graphics | Page Design |
Elements of Design | Proximity | Contrast | Repetition | Alignment | Creating a Page | Using Headings | Creating Text | Making Links |
Tables | Layout Tab | Layout Tables |
File Structure | Remote & Local | Creating a Site | Manage Sites Menu | | Options |
Tools Home Page |Templates | CSS | Course Builder | Advanced Options |

Lesson 2: Starting Out

small logo

Graphic Types

Since even very small pictures make very large files when stored, the internet uses compression algorithms to make the file sizes smaller. There are two main types of graphic compressions used on the web - Graphics Interchange Format or GIF's, and Joint Photographic Experts Group compressions, or JPEG's. GIFs are used for vector drawings (line drawings and clipart). JPEGs are used for photographs. JPEGs can still be somewhat large but provide much better resolution. While GIFs are smaller and load faster. GIFs can also be animated or have transparent portions. Any graphic used in your site must be original work or fall under the fair use guidelines.

Inserting Graphics

With dreamweaver it is always best to save a copy of the picture in the images folder first. The program links your page to the graphic much more simply than if you copy and paste it onto the document window. Once your file is in the images folder, click in the document where you want your image located and select Insert/Image from the menu bar. The dialogue box will usually open in the images folder, but if not navigate there using the look in drop down box (1). Select the file from the list (2). And select OK (3). You can also find an image in the files window to the right, click on the image and drag it into the document location you choose. Once you release the mouse the image will drop into the document window at the point you selected.

Justification

Justification is not as simple as a word processor. You will find there are basically only two ways to make text flow around an object. The first style, left and right, are the only two options for text "wrapping" The other option, top/middle/baseline, breaks the line as the name suggests. They are exemplified below.

Right Justification:
Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt.Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem. Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis suscipit laboriosam, nisi ut aliquid ex ea commodi consequatur? Quis autem vel eum iure reprehenderit qui in ea voluptate velit esse quam nihil molestiae consequatur, vel illum qui dolorem eum fugiat quo voluptas nulla pariatur

Left Justification:
Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt.Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem. Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis suscipit laboriosam, nisi ut aliquid ex ea commodi consequatur? Quis autem vel eum iure reprehenderit qui in ea voluptate velit esse quam nihil molestiae consequatur, vel illum qui dolorem eum fugiat quo voluptas nulla pariatur

Top Justification:
Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt.Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem. Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis suscipit laboriosam, nisi ut aliquid ex ea commodi consequatur? Quis autem vel eum iure reprehenderit qui in ea voluptate velit esse quam nihil molestiae consequatur, vel illum qui dolorem eum fugiat quo voluptas nulla pariatur

Middle Justification:
Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt.Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem. Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis suscipit laboriosam, nisi ut aliquid ex ea commodi consequatur? Quis autem vel eum iure reprehenderit qui in ea voluptate velit esse quam nihil molestiae consequatur, vel illum qui dolorem eum fugiat quo voluptas nulla pariatur

Baseline Justification:
Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt.Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem. Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis suscipit laboriosam, nisi ut aliquid ex ea commodi consequatur? Quis autem vel eum iure reprehenderit qui in ea voluptate velit esse quam nihil molestiae consequatur, vel illum qui dolorem eum fugiat quo voluptas nulla pariatur

About Me | Site Map | Contact Info | ©2004 eewii