Im/Migration & Culture
Web Workshop March 1, 2006
Taught by
John Wilson,
ASUW Information Technology, assisted
by Colleen Carmean, IT
GOALS
OF TODAY’S WORKSHOP: 1) Create a Web Portfolio ready and waiting
for your completed course assignments; 2) Learn web page basics in
FrontPage. 3) Learn image basics using Photoshop Elements
Assignment to complete in today’s workshop (√ when done)
______ A.
ALWAYS STEP ONE! Map
your drive on our course web
server site: Right click
on MyComputer; select Map Network Drive type \\westfile\classweb\koptiuch\Mig2006 VERY IMPORTANT!
______
B. Open
software. Open the software you will use for web page editing,
web browsing, and image editing: FrontPage, Firefox, Photoshop
Elements. Leave these open for easy access.
_____ C. How to find your personal folder.
To facilitate this workshop, a personal folder has been created for you
with a template of the web pages you’ll need for your web portfolio.
Find this at classweb/koptiuch/Mig2006/yourname.
You’ll see several project files and a folder called images. Using
these web pages will speed up your learning process and leave time for
you to learn some of the more creative aspects of web design. Post all
your materials to your folder.
_____ D. Web
editing with FrontPage. Using FrontPage, open your home
page, which is the file index.htm
inside your personal folder. John
will present an overview of using FrontPage. Take some notes for
future reference!
_____ E. Creating
Links. Using FrontPage, in the menu column of your index.htm
file, link the text of each
project name to the corresponding project file in your personal folder
(several ways to do this). Save
these changes to your index.htm file, and test your links in the web browser.
Now ‘copy’ all of your menu
items and ‘paste’ them to the
menu column in each of your web pages. When you change the project
titles later you will need to copy/paste again.
- Create a link to a file
outside your folder—create a link on your index.htm page to the
index.htm file inside a folder called, student_test,
in our main Mig2006 folder. Save, test the link! (surprise!)
- Add a link to your email
address in footer of your home page (tap globe icon> envelope
icon, enter email).
_____ F. Working
with Tables. The template used to format the web pages in your
personal folder uses tables to
organize the placement of text and images. You can also add tables to
your project pages to help in the placement of images and text. John to explain table principles.
- Create a table inside the main cell of your project pages.
_____ G. Image
Editing. Photoshop Elements
allows you to resize, crop, rotate, or colorize, distort, or jazz up
images. Using your browser first to get an image, open the Test Images web page in the Course
Photo Gallery on our course home page. Select an image by opening the
small thumbnail. Right click
on the large image and save to the images folder inside your personal
folder. Use a short file name you’ll
remember (not numbers!) for the image—but never put
spaces in file names! John
will explain how to use Photoshop Elements to resize, crop,
flip, and create links to your images. Save images as .jpg or .gif files only. Always save images to your image folder
before
you “insert” them on your web pages! (don’t “copy” and
“paste” images!)
- Insert a resized, cropped
image from your image folder onto your index page.
- Create a thumbnail
image and link it to a larger
size of the same image. (if time)
_____ H. Formatting
text and images. Get creative! Learn to format text, fonts,
images.
- Text. Later you
will change the menu headings to reflect your actual project titles.
For now, experiment with one or two of the titles in the menu, and on
the actual file. Don’t lose your link!
- Images. Learn
several ways to position images in relation to text. Do it on your home
page!
_____ I. Test
your links! If time, make a link to the home page of one of your
classmates.
