Your SlideShare is downloading. ×
Webpages
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

Webpages

786
views

Published on

Published in: Technology, Design

0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
786
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
12
Comments
0
Likes
0
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. Introduction to Web Page Creation Holly Doe
  • 2. 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!
  • 3. 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)
  • 4. 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
  • 5. 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.
  • 6. Planning
    • Who is your audience?
    • Make an outline or storyboard.
    • Organize your files.
  • 7. 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.)
  • 8. 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.
  • 9.  
  • 10. 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
  • 11. 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
  • 12. 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.
  • 13. 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.
  • 14. Typography
    • Is it readable? Black on white is best.
    • Consistency throughout your pages.
    • Link Colors
    • Consider your font choices.
  • 15. 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.
  • 16. Table Example on Page
  • 17. 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
  • 18. 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