Planning a Web Site - PowerPoint PPT Presentation

ostinmannual
planning a web site l.
Skip this Video
Loading SlideShow in 5 Seconds..
Planning a Web Site PowerPoint Presentation
Download Presentation
Planning a Web Site

play fullscreen
1 / 20
Download Presentation
Planning a Web Site
391 Views
Download Presentation

Planning a Web Site

- - - - - - - - - - - - - - - - - - - - - - - - - - - E N D - - - - - - - - - - - - - - - - - - - - - - - - - - -
Presentation Transcript

  1. Planning a Web Site Unit Two

  2. Planning Steps • Determine the audience & objectives. • Sketch a storyboard or flowchart of the pages. • Create a folder hierarchy. • Collect the page content and create the pages. • Test the pages. • Modify the pages. • Publish the site.

  3. 1. Determine the Audience • Customers? • Employees? • One industry? • Educational background? • Age? • Interest? • Make sure the site appeals to the audience.

  4. 1. Objectives • Advertise? • Inform? • Educate? • Provide a service? • Process an order?

  5. 2. Storyboard Introduction or Home Page Main Topics level Sub Topic Level (design for no more than 3 mouse clicks)

  6. 4. Page Layout • Introductory page • Fit on one screen • Z pattern • Logo and important info on top and bottom\ • Don’t use horizontal scroll bar

  7. 4. Page Layout • General layout for content pages • Be consistent, location, color, type • Link each page to previous and to introductory • Navigation bar on top and bottom • No active link to current page • Page heading at the top of each • Contact Information • Update Information

  8. Design Rules • Be concise – simple sentences, bullets • Easy to read – text size, white space, short lines, indent, tables, serif font, colors, single word links, don’t say click here. • Easy to navigate – good descriptions, easy icons, don’t underline regular text, divide long pages, toc, site map • Interesting – color, bold, size – don’t overdo

  9. Design Rules • Load quickly - < 60k, small images, thumbnails, reuse images • Limit frames – users don’t like them much • Limit animation – slow & distracting • Have an alternative to frames and animation • Consider browsers and resolution • Proofread and Test – continuously

  10. Creating a Web Site • Create a folder on your disk drive using Windows Explorer called tripsmart • In Dreamweaver Site|Define Sites|New name it TripSmart and choose local Root folder then browse for tripsmart folder • Check Refresh Local File List Automatically • Check Enable Cache

  11. Add a Folder to a Site • Make sure the Site window is open using the ShowSite icon on the Launcher bar • File|New Folder • Name is assets

  12. Setting the Home Page • Open the file dmb_1.htm from the Unit B folder • Save it as index.htm in the tripsmart folder • Title bar in Design View shows path • Click Show Site icon • Choose index.htm • Site|Set as Home Page

  13. Save images to Site • In Design View, select the logo • Property Inspector displays the SRC or location of the graphic • Click the folder icon and copy the file to the root folder? yes • Copy File As - assets folder

  14. Add a New Pages • Show Site Window • File|New Files – name it products.htm • Add serices.htm, packages,htm, newletter.htm, clothing.htm and accessories.htm

  15. You MUST use the SITE window for file maintenance and NOT windows explorer • Dreamweaver will not recognize any changes made in windows explorer and you will have to do it again.

  16. Design Notes • Site|Define Sites • Choose TripSmart then Edit • Choose Design Notes • Check – Maintain Design Notes • Check – Upload Design Notes for Sharing • Design View of index.htm File|Design Notes|Basic Info tab choose Draft • Insert Date icon • Type – Ask Bob for a copy of the company history. • Check – Show When File is Opened

  17. Setting up Web Server Access • Site View • Site – choose Define Sites – Edit • Remote Info – Access list – FTP • Host Site – ftp://hsb-faculty.baylor.edu/milligan/yourlastname • Enable File check In and Check Out • Check Out Files when Opening • Check Out Name – type name and email addr

  18. Creating & Viewing Site Map • Site Window • Site|Define Sites • TripSmart Edit • Site Map Layout • Verify index.htm as the home page • Select Page Titles option Done • Sit Map icon Choose Map and Files

  19. Save the Site Map • File|Save Site Map • Save as bmp (to print or put in word) or • png (portable network) to put in html

  20. Modify Pages in Site Window • Site Map view • Refresh icon • Click TripSmart page icon • Change the name to Welcome to TripSmart – The Smart Way to Go • Save and Exit