Tips for Improving Web Page Design

Update: The presentation slides are posted at http://prezi.com/uqt8ffi5x07e/.  A supplemental list of links suddenly appeared as if by magic at http://westl.iii.com/screens/calicon13.html.  A clip of what the presentation won't be like (I hope) is at http://www.youtube.com/watch?v=uhiCFdWeQfA. :-) 

This is an updated version of a web design presentation from Internet Librarian 2012.  In this session, I'll be demonstrating how to use tags and scripts to liven up a web page.  The example I'm using is the home page of the Western State College of Law Library, whose design is based on the home screen of a smartphone.  The page has rows of rounded buttons that change color -- indicating potential or actual navigation -- when you hover over, click, or touch them.  It also includes a widget that automatically displays links to the most recent posts on the library's blog.

This presentation will show how the page's code generates these and other features.  It will also cover practical resources for web page design, such as sites with useful code snippets, JSON viewers, and tools for testing HTML, CSS, and JavaScript.

My presentation at Internet Librarian was shorter and for a smaller audience, yet led to several audience questions and comments.  I look forward to even more audience participation at this session.  (Bonus points for anyone who can make a My Little Pony reference during the session -- it will help make the video of the session more interesting to my five-year old daughter.)

Video: