HOMEDay 1
(7-17-01)
Day 2
(7-19-01)
Day 3
(7-24-01)
Day 4
(7-26-01)
Terms
LINKS |
DAY
2
Build Your Own Web Page
I. Basic page elements (Guided
Activity)
Use Format Tools on toolbar or Format Menu
choices to help you do the following:
Background Color & HEX code
<color>
HEX (meaning SIX) numerals or letters placed in code to create color on page
RGB (like colors of the light spectrum) values for each letter
0 (zero) is absence of color (e.g., 000000 is black-- no red, no greens, no blues)
http://www.barnonline.com/colorwheel.html
Alignment <align>
Breaks <br>
Pushing Enter key will skip a line between entries (double-spaced)
Using SHIFT + Enter will drop you down only one row (single-spaced)
Text
Use the formatting tools on FrontPage Express to change these attributes like a
word processor
*Font <font>
Drop-down menu or Format/Font
* Size <size>
Use A or A
to make text become larger or smaller or use Format/Font and choose a size
*Color <color>
Use the Color pallete on the toolbar to choose a color or use Format/Font and make
a selection from the menu
II. Graphics (Lecture
& Guided Activity)
Remember that each graphic is a
SEPARATE file in your directory!
Use the "yellow sunset picture"
button on the toolbar or Insert, Image from the menu bar to add a graphic.
Types of image formats &
their capabilities/limitations
A. GIF -- can be transparent or animated, tends to lose some
of color value, good for "cartoons" or "drawings"
B. JPG -- no transparency or animation, excellect color value,
good for photos
C. BMP -- good color value, but take up LARGE amounts of
memory space; some BMPs can take up to SIX times as much memory as the same picture in GIF
or JPG form
D. other -- TIFF, PDS, etc. Tend to be program-specific, that is, they
can only be opened or viewed by the program that created them or software by the same
manufacturer.
Horizontal Rules (Lines) <HR>
Good separator lines without having to use a spearate graphic file. Color,
alignment, and size can be altered.
Graphics as backgrounds
Tiled backgrounds will repeat all over screen. Best to use a small GIF or JPG
in a light color.
Click format, background, background image (browse for the file)
Border backgrounds also "tile" on the screen, but they are made long
enought to fit the picture area only on one side of page. You will probably need to
adjust your page alignment so you don't have text or images covering the border.
"Free" graphics
There are many free clip-art and web graphic background collections on the web.
Be sure to read the rules or terms of use for each image you decide to
"take".
FREEWARE -- you can "take" the image without paying a
fee
LINKWARE -- you can "take" the image if you place a link or
logo back to the source's page
SHAREWARE -- share your credit card with them and they'll share their
images with you!
ClipArtConnection -- http://www.clipartconnection.com
Moyra's Web Jewels -- http://www.moyra.com/jewels/minentrance.html
Barry's ClipArt Server -- http://barrysclipart.com/
ClipArt.Com -- http://www.clipart.com
The Graphics Ring -- http://www.graphicsring.com
To copy & take an image from the web: Right-click on the picture, click
"Save picture as" on the pop-up menu, choose the location and directory where
you want to store your new copy of the picture, click "Save"
Editing Graphics within FrontPage Express and
with free software programs
Microsoft Paint (Start, Programs, Accessories, Paint)
Microsoft Photo Editor (C:\Program Files\Common Files\Microsoft
Shared\PhotoEd)
Microsoft GIF Animator (Download: http://www.keyscreen.com/KeyScreen(s)6/MicroGIFanimator.htm)
A. sizing graphics & images
Image size is based upon the number of pixels (little squares of color) that make
up the picture you see on your screen
B. transparency
C. animation
D. brightness/contrast
III. Break
IV. Lists (Lecture &
Guided Activity)
Lists tags can help you indent and organize
the layout of your page.
With FrontPage Express, you can create
numbered lists that will automatically give you the next number in the series
when you click Enter, or bulleted lists that you can format with different shapes of
bullets before each entry.
Dave's Interactive HTML Tutorial (MiniChapter
about List tags) -- http://www.davesite.com/webstation/html/chap07.shtml
(If you go to this site, be aware that you are only allowed to print out ONE copy
of each tutorial for free...after that there is a $5 fee for "extra" copies that
you print)
V. Links (Guided
Activity)
Use the globe/link button on toolbar or
Edit, Hyperlink to create a hyperlink to a specified location
Text Links <a href>
Graphics as links <img src> and
<alt>
Bookmarks or "targets" and
"anchors" <#>
Target frames (why and when to use them)
MFISD Continuing Education Course
Instructor: Shelli Spruiell
sspruiell@marblefalls.txed.net |