Web best practices

Basic needs of ALL websites Utility Usability

Web site usability Learnability: How fast is the system picked up? Efficiency: Once learned, how quickly can basic tasks be performed? Memorability: When returning after a period, how easily can proficiency be reestablished? Errors: How many errors made, their severity, and how easily can they recover from the errors? Satisfaction: How pleasant is it to use the design?

Good utility and/or usability = ? Users that repeatedly come back to your site Reduced time spent on and phone Users with who have and share positive impression Efficiency for staff/faculty/students Reduced paper and environmental costs

About the Web and its users The power and difference of the web is that it is a non- linear medium People do not move in a single trajectory, they move anywhere at anytime Google has changed everything People do not read on the web – they scan

Laurier web philosophy Represents the Laurier brand and lets users know that they are on the university site Clear, consistent navigation Neutral design W3C Priority One compliant (accessibility) Compatible with most web browsers

Specifics Font is standard on most computers/browsers Font colours, sizes consistently used Links and navigation schemes are consistent and follow web norms Graphics are minimal to speed download

Best practices Navigation Content Accessibility Images Tools

Best practices - navigation Use short titles (keywords) Use upper/lower case Avoid underlined words Insert hyperlinks where possible Avoid using graphics as links If required, acquire a memorable URL

Best practices - content Make site user-centric Design content as if it were an inverted pyramid Keep content short and hyperlink data as much as possible – try using the CMS anchors featureanchors feature Put compelling, interesting info “above the fold“ Don’t layer the content too deeply – minimize clicks Use key words, bullets, bold, hyperlinks Paste copy into Notepad before pasting into the CMS

Best practices - accessibility Use tables only where necessary Use image tags with images Use unordered lists Use minimal number of images Ensure links function (test!)

Best practices - images Main image area scales but image does not Use width of 1500 pixels Have main image content in left-hand 450 pixels Images/video can be uploaded to Flickr/YouTube and HTML link embedded Images should serve a specific purpose Optimize photos before uploading

Best practices - tools Documents tool Word or pdf, difference to forms, plan sub-categories Online forms ITS can help link to database Photo galleries Image optimization, captions E-newsletter Blogs Media Experts

Revising your site Test existing site to identify good and bad (3-5 users) Research your competitors or other sites Hold a content identification meeting Refine site design and build paper prototype Test paper prototype (3 users) Build actual site Retest revised site (3 users)

Resources terrymorris.net/bestpractices/ Useit.com