Session 4: Page Design J 394 – Perancangan Situs Web Program Studi Manajemen Universitas Bina Nusantara

BWD Bina Nusantara University 2 Screen Real Estate Content of Interest Navigation Un-necessary interface elements

BWD Bina Nusantara University 3 Cross Platform Design 1.Where are users coming from? 2.Pixel and Color Depth 3.Get a Big Screen 4.Resolution Independent Design 5.Use text for text 6.Provide Separate Printable Pages 7.Don’t use non- standard content 8.Installation Inertia Flexibility & Logo

BWD Bina Nusantara University 4 Response Time Have Predictable Response Times Speedy downloads, speedy connections Users like fast pages Glimpsing the first screenfull t <.1 second = instantaneous 0.1 < t < 1 sec. = uninterrupted flow through an information space 1 < t < 10 seconds = limit to keep users attention on the dialog

BWD Bina Nusantara University 5 Linking Trailing slashes "/" for directories  display faster Link descriptions: 2-4 words long TITLEs to explain links Name of site (external), subsite name, and any warnings (registration required) Titles should be max characters

BWD Bina Nusantara University 6 Linking (2) Coloring your links: Nonstandard link colors?? (they contribute to 16% of task success) Use unvisited = blue and visited = purple or red Link expectations: links are double-ended Arrival: situate users in new context, provide them with value Departure: explain why they should leave Don't open up new browser windows (it disables the back button, and they can do it themselves)

BWD Bina Nusantara University 7 Linking (3) External links: value added part of your content + cheap Incoming links: support them Permanent URLs Great focused content

BWD Bina Nusantara University 8 Linking (4) Not require subscriptions and registration Advertising: link directly to payoff page, not your home page (20-30% hit back button otherwise)

BWD Bina Nusantara University 9 Style Sheets Single Linked Style Sheet Make sure stylesheets work Try disabling and reload Use no more than two fonts (possibly a third for computer code) Use relative font size not absolute size Don't use "!important" in style sheets Use the same CLASS names for the same concept for multiple stylesheets

BWD Bina Nusantara University 10 Separating Meaning & Presentation No longer predict user’s configuration –Use stylesheets –Optimize for different displays+speech

BWD Bina Nusantara University 11 Others Frames: Just say no. Credibility: Good-looking clean design equals credibility. Printing: Provide printable versions of any long documents. Conclusion: Simplicity is the goal of page design. Users focus on content.