Lecture Summaries class 14
Prepared by: Anthony Larrain
These notes serve as an outline to the lecture, they are not intended to
be complete. Attend class to get more details.
Discuss Design Checklist
designchecklist.html
Inline Styles
- Adding a style directly in an element's HTML tag:
This heading will be magenta
- Very specific, the style applies for this one time.
- Avoid over using inline styles.
- This example uses an inline style to indicate the current page the user is visiting.
Project Template
Video
- Images,audio(later) and video can add allot of value to a web site.
- These multimedia aids can also be a major distraction.
- In lab we saw the
embed
tag can be used to place video in your web document.
- You should never have audio and video play automatically, allow the user the option to start them.
- Example
Check out my video clip: A Walk Through Lincoln Park
- Video Types:
- Streaming - video begins to play almost immediately after the request is made. User does not have to download the complete file before the video will play.
- Non-streaming - the entire file must be downloaded to your system before the video plays.
- Web Video File Formats:
- AVI. Audio Video Interleave. Created by Microsoft.
- MPG or MPEG Moving Picture Experts Group. Created by an independent committee of audio and video experts that created the MPG file format.
- MOV or QT Quicktime Movies. Quicktime is the video format devised by Apple.
- SWF Macromedia: Flash
- RA or RV or RAM
Real One is a streaming video format.
- WMF Windows Media Format, Microsoft's latest streaming video format.
- Video Players
- Quicktime
- Windows Media Player
- RealPlayer
- Macromedia Flash
- Plug-ins
- When a browser detects a file that it cannot handle, like an audio or video file, it calls a "plug-in" application. That application deals with translating the file for the browser.
- Video Editing Software
A plethora of programs, here are a few
- Adobe Premiere
- Pinnacle
- Ulead Video Studio(A walk Through LPC was made with Ulead)
- Final Cut (MAC)
- Imovie (MAC)
- Windows Movie Maker, Free with Windows XP. We will work a little with this in Lab.
Working with ZIP files.
- A ZIP file is a "compressed" file format.
- One or more files can be compressed in size and then stored in a single ZIP file.
- To Access the files you need to extract the original files from the ZIP file using a ZIP file program.
- ZIP format provides advantages:
- Several files can be downloaded as one file.
- The files stored in a ZIP file are compressed, making the ZIP file smaller than the size of the uncompressed files, resulting in a faster download.
- Zip file Programs
- WinZip - for Windows, available in the lab
- MacZip - for MAC
Working With FrontPage 2003
- FrontPage is a web site development tool developed by Microsoft.
- Alows you to create web pages in a way similar to entering text into Word.
- The Frontpage editor will generate the HTML for you.
- If you already know HTML why use FrontPage ?
- Certain tasks can be accomplished faster.
- Easier to create complicated layouts than using HTML / CSS
- Built in feature to help manage complete web sites
Starting FrontPage
- Click Start
- Courseware Applications
- Installed Apps for CTI
- Select Front Page
When you first start FrontPage this is what you should see.

- The Major Sections are listed in red.
- The Document Window is where you will type your text.
- The Task pane is where you can select from pre defined templates.
Your First Front Page Web Page
- When you start FrontPage you are presented with a new blank page in the document window.
- Save this blank page as first.html. If you do not specify the file extension FrontPage will use .html
- Either .htm or html are recognized as HTML pages by browsers.
- Start typing text into the document window.
- The text will flow from left to right. When it reached the right margin it wrap
automatically, continuing on the line below.
- To start a new paragraph, press Enter.
- To insert a line break, hold the Shift key down when you press enter. OR
Select Insert -> Break -> Normal line break from the menu items.
Page View Buttons
- Design mode - Use this mode to type in your web page
- Split - Allows you to see the HTML code as your typing
- Code - The mode where you add HTML tags and / or CSS styles
- Preview - View your web page as you are developing it. Remember to check in IE and Netscape to