1 / 20

Planning a Web Site

Planning a Web Site Unit Two 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. 1. Determine the Audience

Download Presentation

Planning a Web Site

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

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

More Related