1. Hyperlinks and Site Organization Putting it together...

2. Tutorial Files  Some available from the Course Site  CT materials are linked to the resource page  http://homepages.wmich.edu/~rea/380/resources/ http://homepages.wmich.edu/~rea/380/resources/

3. Hyperlinks  Internal  External  Both are a way to organize and take advantage of the power of hypertext...  They can be used for good... or bad...

4. Internal  Anchors  Must set an anchor on a page Employment  Can also use an image

5. Internal (cont.)  Must then add a hyperlink LINK TAG Employment  Anchor Hypertext REFerence  Case sensitive  very important

6. Internal (cont.)  Can also use image  BORDER PROPERTY

7. Internal (cont.)  Sizing Properties/Attributes

8. External  Another Web page in your site Other Interests  A Web page outside of your site Webmonkey

9. External (cont.)  An e-mail link Doc Rea  The TEXT of the link (in all cases) has no relation to the actual hyperlink.

10. Internal/External  Can also link to internal areas of an external document My Hobbies

11. More Hyperlinks  FTP WMU FTP Site  Usenet WMU News

12. Lynx  Let’s check it out  Open bronco.wmich.edu  Look at your page  Look at news

13. Web Site Structures  Use Storyboarding to organize your site (flowchart, diagram)  Linear (2.12)  Augmented Linear (2.13)  Hierarchical (2.13)  Mixed Structures (2.14)  Need some structure...

14. Pathnames  Textbook can be a little confusing...  Absolute Entire address http://homepages.wmich.edu/~rea/380/labs/lab2.htm  In text discusses (2.25)  Most browsers will refer to a file on a system drive as such  D:\380\labs\lab2.htm

15. Pathnames (cont.)  The A:\ dilemma  Uploading files or images working offline and then not working on Website   Or wherever you have your files  What happened?

16. Pathnames (cont.)  Relative Hyperlink is relative to location of both documents In BIS380 directory Lab 2 In labs directory Lab 2

17. Pathnames (cont.)  The../ of a relative is important.  Each../ is up one directory

18. Take a Break…

19. User Centered Design Who's Gonna Use this Thing?

20. User-Centered Web Development  A development or design process that meets users’ needs  Web Usability

21. Technology Acceptance Model (TAM)  Ease of Use  Minimum download time  Minimal frustration  Usefulness of Technology  Complete tasks  Website becomes a tool  Predictability means ease of use  Flourish is OK, but keep to a minimum

22. Lazar User-Centered Web Development Lifecycle  Define the mission of the Website and the user population  Collect the user requirements for the Website  Create the conceptual design of the Website

23. Lazar User-Centered Web Development Lifecycle (cont.)  Create the physical design of the Website  Perform usability testing on the Website  Implement and market the Website  Evaluate and improve the Website

24. Challenges to Web Development  Browser Type  Browser Version  Screen Size  Operating System  Download Time  Infrequency of use  Users don’t use your site all the time  Some exceptions, of course

25. Clients  Client versus User  Not the same people  Make sure the client has a clear purpose  Make sure the client is committed  Keep client frequently updated  Learn the client's interaction style and use it to your advantage

26. Clients versus Users  Melding Mission with Need  Determining User base  Negotiating soltions

27. Mission of the Website  Type of Website  Informational  E-Commerce  Entertainment  Target Population  local, international  audience-split?  WMU site WMU site