1 / 18

44212: Web-site Development

44212: Web-site Development. Planning & Building a Web-site Ian Perry Room: C48 Extension: 7287 E-mail: I.P.Perry@hull.ac.uk. http://itsy.co.uk/ac/0607/Sem1&2/44212_WSD/. The Planning Process?. Review your Web Development Plan:

viola
Download Presentation

44212: Web-site Development

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. 44212: Web-site Development Planning & Building a Web-site Ian Perry Room: C48 Extension: 7287 E-mail: I.P.Perry@hull.ac.uk http://itsy.co.uk/ac/0607/Sem1&2/44212_WSD/

  2. The Planning Process? • Review your Web Development Plan: • Content Decisions; which business processes might be best supported by the Internet/Web? • Site Map; showing the overall structure of the proposed Web-site. • Then think carefully about: • Navigation Method(s); how will user find things? • Standard Web-page Design; most (all?) Web-pages will have this structure.

  3. Content Decisions for FRU? • Major business processes concentrate upon the provision of; • Flights, Car Hire, Accommodation, and Travel Insurance (Annual & Single Trip)- for Business & Independent Travellers. • Want to raise awareness of the good deals that Flights ‘R’ Us can offer. • Then, invite potential customers to contact Flights ‘R’ Us: • ideally by E-mail, but also by Telephone, Fax, or Post(?) if they want to.

  4. Home Page Flights Accommodation Car Hire Travel Insurance Annual Booking Request Single Trip Site Map for FRU? Showing overall structure of Web-site.

  5. Navigation Method for FRU? • How will the user find things? • Via a Simple Menu System: • at the bottom of each page. • Allowing the user to navigate directly to the 4 major sections of the Web-site: • may need some in-text hyperlinks where a section has more than one Web-page; e.g. Travel Insurance. • Also need some means of navigating back to the Home Page: • so the user can never get lost.

  6. Flights ‘R’ Us Logo Page Title Page Content (utilising existing documents?) Contact Details i.e. Address & E-mail Navigation Bar Flights, Accommodation, Car Hire, Insurance. Standard Web-page for FRU? • Most (all?) pages will have this structure:

  7. How to Build a Web-site? • Name all files on the ‘Site Map’. • this will save a lot of anguish later! • Develop the ‘standard’ Web-page: • most (all?) Web Pages will look like this. • make the major navigation ‘work’. • Use copies of the ‘standard’ Web-page: • for a consistent ‘look-and-feel’. • adding the Page Content as required: • from existing documents if possible? • Test, test, test!

  8. index.htm Home Page flights.htm car.htm accomm.htm insure.htm Flights Car Hire Travel Insurance Accommodation Annual annual.htm Booking Request Single Trip book.htm single.htm Name ALL Files on Site Map

  9. Develop the ‘Standard’ • Build the structure of the ‘standard’ Web-page: • tables, images, text, horizontal lines, etc. • images can be scanned from existing documents, or downloaded from the Web. • Make the major navigation ‘work’: • clicking on a navigation bar image takes user to one of the 4 major parts of the Web-site: • Flights, Accommodation, Car Hire, Travel Insurance. • clicking on the Flights ‘R’ Us logo always returns the user to the Home Page.

  10. Develop an ‘outline’ Structure[ using tables & horizontal lines ]

  11. Then Add the Images, Navigation & any Fixed Text

  12. Use the ‘Standard’ - 1 • Open the ‘standard’: • And save (immediately!) with a new file name, i.e. refer to the names on your ‘Site-Map’. • Change the ‘Page Title’: • and the Title in the Header. • Add relevant ‘Page Content’: • utilising existing documents where possible. • Save the completed HTML Page.

  13. Use the ‘Standard’ - 2 • Examine the results and make any necessary adjustments. • Some pages may look OK when the ‘Page Content’ has been inserted, others may need quite a bit of work. • Repeat for all Web-pages. • Remember that the ultimate test is to view your Web Pages with a Web Browser, and to check that the navigation actually ‘works’.

  14. Not Quite Right?

  15. That’s Better!

  16. Repeat for other Web-pages • Being very careful; • NOT to alter the ‘standard’. • And you will end up with a Web-site that; • ‘works’ (i.e. is robust), has a consistent look-and-feel & and is easy to navigate. • i.e.; • three of the things that users tend to like about the Web-sites they ‘visit’.

  17. Take Your Time & Be Careful • Spend quite a lot of time developing your ‘standard’ Web-page: • You do not want to have to change it, having already used it to build several Web-pages with the original version. • Make sure that you only work with files that are located in ONE folder: • or work only on a floppy disk, as that is how you have to hand-in Assignment 2. • And remember that “less is definitely more”: • except when it comes to testing!

  18. Next Week’s Workshop • You will develop a ‘standard’ Web-page: • for Flights ‘R’ Us. • Then ‘use’ this ‘standard’ Web-page: • in order to build a small, i.e. 5 page, Web-site. • incorporating a variety of images & text that I will provide for you. • After which: • you really should get on with the development of a ‘standard’ Web-page that you intend to use for your Zeitgeist Club Web-site.

More Related