I Teach PHP.com

Apache Apache1.3 to 2.0
Configuration Basics
Install Fedora C1
Install Red Hat 7.2
Install Red Hat 7.3
SSH Clients
Virtual Hosting
links
syllabus
apache-refcard-letter

Bash Bash Shell Tips And Tricks
bash

CSS CSS2 Reference
links
syllabus

DHTML syllabus

HTML Basic HTML Tags
Creating Images
links
syllabus

Linux Install Fedora C1
Install Red Hat 7.2
Install Red Hat 7.3
Linux Basics
SSH Clients
links
mailme

Linux Clusters Cluster Books
Install Fedora C1
Install Red Hat 7.2
Install Red Hat 7.3
SSH Clients
syllabus

Linux Security Install Fedora C1
Install Red Hat 7.2
Install Red Hat 7.3
PHP Security
SSH Clients
Security QuickRef
UnixSecurity2.0
syllabus

Linux SysAdmin Install Fedora C1
Install Red Hat 7.2
Install Red Hat 7.3
PHP Security
SSH Clients
Security QuickRef
UnixSecurity2.0
syllabus
show book

Linux for Business Install Fedora C1
Install Red Hat 7.2
Install Red Hat 7.3
syllabus
show book

PHP 4 page DB system
Install Fedora C1
Install Red Hat 7.2
Install Red Hat 7.3
Linux Basics
PHP Security
Password Protect
Perl CGI Problems
Perl vs. PHP
Yahoo Stocks
links
syllabus

PHP for Flash 1-Flash Intro
2-Flash-PHP Form
Flash-PHP FAQ
Linux Basics
SSH Clients
syllabus

Perl Perl CGI Problems
SSH Clients
syllabus

TCP-IP Subnetting Tutorial
links

WML Yahoo Stocks
links
syllabus

cgi-bin

E-MAIL
Beginning Web Planning & Design Using PageMill: Creating Images

Beginning HTML: Creating Images

Option 1: Find an Image

There are hundreds of sites for free images on the web. You can also use some clip art disks (with the warning that they are mostly designed for printing so some don’t look good on the web). Try these sites or search "free images" on Google.com:

Option 2: Scan an Image

Scan an image using one of the scanners in the lab.

Open your scanned image in Photoshop to make modifications (crop, color adjustment, etc.) and save as a gif or jpeg by using the steps below.

Option 3: Create an Image

Use Adobe Photoshop to create a Title Image and Background Image.

  1. Find Adobe Photoshop on your hard drive and double click the icon to open the application.
  2. File/New
  3. Photoshop now asks for the dimensions of your new document. Mode=RGB, Resolution 72 -max. screen res. Follow the suggested guidelines below according to the type of image you are creating.

Background Gradient: 1024 pixels wide by 5 pixels high. The image should span the entire width of the largest monitor. Because a background image is tiled, the height can be small. This decreases file size.

Title Image/Banner: 525 pixels wide by 95 pixels high. This is an average size used on the web. 525 is the maximum number of pixels that would fit on a printed piece of paper.

You should now have a new image window on your screen. Go to either "create a gradient" or "create title image" below.

To create a gradient:

  • Choose colors by clicking on the color swatches in the toolbar - a color table will appear, pick colors.
  • Then double click on the gradient tool in the toolbar. This tool looks like a box with a gradient from black to white - a gradient folder will open.
  • Specify if you want the gradient to go from foreground color to background color or to transparent. Choose linear gradient - do not choose radial.
  • Choose View/Actual Pixels from the menu bar and then use the scroll bar to scroll left.
  • Drag the mouse pointer from left to right across the image. If you don’t like your gradient choose Edit/Undo immediately. Repeat the process until you are happy.

To save as JPEG: Because this image contains a gradient, save in JPEG format.

  • Layer/Flatten Image
  • File/Save As
  • Name your image: backgd.jpg (remember the 8.3 character rule)
  • Pull down the format pull down menu and choose JPEG from the list. This is very important. If JPEG is grayed out your image may not be flattened. Repeat the previous step: Layer/Flatten Image.
  • Save backgd.jpg into your "images" or "pic" folder in your "yourname" Folder in the student’s folder on the desktop.

To create a Title Image:

  • Click on the text tool in the toolbox. This tool looks like a Capitol "T". Click on your new image.
  • Choose a font and font size from the dialogue text box and type your title in the box below.
  • Be sure that aliasing is unchecked. Click ok.
  • The text should appear in your new image. Arrange the text so that it fits in the image window. You can work on layers by going to Window/Show Layers.

To save your image as a JPEG follow the steps above.

To save as a gif:

  • File>Export
  • From Export drag mouse to Gif89aExport.
  • For Pallet select: Adaptive
  • Interlaced: unchecked- loads solid image; checked- loads image in sections. Click OK.
  • Gif89aExport automatically adds the .gif extension and saves as a gif format.
  • Keeping the .gif extension, name your images with fewer than 8 characters, lower case, and with no spaces.
  • Save to your "images" or "pic" folder in "yourname" folder in the student folder on the desktop.

This site contains files and links to support the free courses taught by James D. Keeline at the New Media Center / North City Center through the San Diego Community College District's Centers For Education and Technology.   A list of courses available at the center may be consulted.

The site will be updated throughout the semester both with new content and as a way to try out technologies used in several of the classes. This file modified 14-Jan-2007.