Upcoming SlideShare
Loading in...5







Total Views
Views on SlideShare
Embed Views



0 Embeds 0

No embeds



Upload Details

Uploaded via as Microsoft PowerPoint

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
Post Comment
Edit your comment

Webpages Webpages Presentation Transcript

  • Introduction to Web Page Creation Holly Doe
  • What is a Web page?
    • Pages of coded (HTML)text.
    • Browser software understands the code and interprets it so we see a page without code.
    • HTML files can be read by any computer because they are simple text.
    • Text or graphics can be linked to other pages. Hypertext!
  • How can you make a Web page?
    • Write HTML code
      • Simpletext, TextEdit, or Notepad
    • Use a Web Authoring Software package:
      • Adobe PageMill
      • Microsoft Frontpage
      • Macromedia DreamWeaver
      • Claris Homepage
      • Netscape Composer (comes with communicator)
  • What elements can you add to a Web page?
    • Words (bold, italic, heading sizes, colors, etc.)
    • Links (To Web sites, your own pages or e-mail)
    • Lists
    • Graphics, sounds, and movies
    • Tables
    • Forms
    • Frames
  • Overall Process
    • Choose a Web authoring package and learn how to use it.
    • Plan your site. Take notes and create a visual map.
    • Begin your pages and manage your files.
    • Who will host your site?
    • Reflect on design.
  • Planning
    • Who is your audience?
    • Make an outline or storyboard.
    • Organize your files.
  • File Management
    • Create and name a folder for all your individual Web pages.
    • Within this folder, create an images or pics folder for saving all your images.
    • Use more folders if your site becomes very large.
    • Create the folders from the very beginning to avoid confusion later. (If you move files around after creating links on your pages, the links will no longer work.)
  • File Name Rules
    • Web page files must end in .htm or .html
    • Save graphics with the appropriate extension. (.gif or .jpg)
    • First page (home page) is usually called index.htm or default.htm
    • Use all lowercase letters. (Easier)
    • Use only letters and numbers other than ~ - _
    • Don’t use spaces.
    • Keep file names short.
  • Uploading to a Server
    • FPT Server is a large computer that is connected to the Internet 24 hours a day to constantly make your site available.
    • How to find one? Free server sites are everywhere or ask your ISP
    • Need software:CuteFTP or WS_FTP
    • Need a user name and password for access to server.
    • Must send every file and graphic to server.
    • http://www. iem an .com
  • Design Do’s
    • Do keep all important information and links within the top 4 inches so it is visible. “The Top Four Inches Rule”
    • Do keep graphics and text consistent throughout your pages
    • Do provide credits or a bibliography
    • Do provide a note to inform visitors of the last update.
    • Do provide good navigation.
      • Every page links back to home
      • Menu on each page
      • Consistency
  • Design Don’ts
    • Do not use music or graphics without a purpose and that are annoying to your site visitors.
    • Do not use frames.
    • Do not use “under construction” graphics.
    • Do not use complex background images.
  • Graphics
    • Be careful of size
    • Are they necessary? Animated Gifs??
    • Background images-not too busy
    • Every one should have an Alt Label for Accessibility purposes!
    • Image Maps-What are they? Example
    • Some text headings are actually images.
    • Create your own with drawing software.
    • Find graphics in online clip-art galleries.
  • Typography
    • Is it readable? Black on white is best.
    • Consistency throughout your pages.
    • Link Colors
    • Consider your font choices.
  • Tables
    • More than a way to organize text and data.
    • Great for layout of elements on page.
    • Borders can be invisible or visible.
    • Change colors of background.
  • Table Example on Page
  • Advanced Features
    • Style Sheets
    • Javascript and Flash -Adds interactivity
    • Forms-Requires someone to write a CGI script so information can be sent to your e-mail address.
    • XML
  • Mid-term Web page Requirements
    • Two linked pages that you develop
    • Four images
    • Varying size fonts
    • Background color
    • Table
    • Internal linked anchors
    • Four links to outside pages
    • List
    • E-mail link
    • Horizontal Line