Evolution of a website10.17.11

EXTREME MAKE-OVER…tricks, treats & tips to keep in your toolkit to take your web site from mess to success...

October 17, 2011Tips on Redesigning Library SitesInternet Librarian, Monterey, CaliforniaAmanda Foust [email protected] Anna Jonsson [email protected] Magnus [email protected]

Marin County Free Library

DAWN OF THE LIBRARY WEB PRESENCEAUGUST 23, 1996

EARLY WEBSITE NAVIGATIONJANUARY 15, 1997

CONSORTIUM WEBSITEOCTOBER,1997

LIBRARY WEBSITE: DESIGN CHANGESOCTOBER 7, 1997

LIBRARY LANDING SITEJANUARY 11, 1998

LIBRARY HOME PAGEFEBRUARY 8, 1998

BRANCH PAGE EXAMPLEDECEMBER 5, 1998

LIBRARY WEBSITE: NEW LOGOOCTOBER 5, 2000

LIBRARY SITE: NOW IN COUNTY WEB SITENOVEMBER 21, 2001

LIBRARY SITE: PHOTO HIGHLIGHTSOCTOBER 10, 2002

LIBRARY REFERENCE LINKSOCTOBER 1, 2002

MORE DESIGN CHANGESJUNE 20, 2003

NEW DESIGN FOCUS ON GRAPHIC LINKSFEBRUARY 5, 2005

LIBRARY SITE: NEW TABBED DESIGNSEPTEMBER 29, 2007

TAB LAY-OUT NAVIGATION SEPTEMBER 29, 2007

TAB REDESIGNFEBRUARY 25, 2009

LIBRARY LEAVES COUNTY SITEAUGUST 4, 2009

REDIRECT TO NEW URL2009

NEW HOME PAGE “EVOLVING”AUGUST 5, 2009

HOME PAGE: VISUAL CLUTTERAPRIL 26, 2011

PREPARING FOR THE NEW WEBSITE Vendor & Software Selection Web steering Committee Use types – know your audience Page editors Plan for new content Strategic planning Feedback channels Design Lay-out using Wireframes Logo changes Tracking spreadsheets for content creation Google Docs account for sharing content Usability testing

IF WE KNEW THEN…. Designate a project manager and a task manager Know your library’s culture—get buy-in Clearly communicate expectations to staff—stay

positive Ask vendor for examples of projects with similar

budget Ask vendor for specifics on what library staff will be

expected to complete Plan for workload impact on staff Keep detailed list of things to check, problems Use spreadsheets to track content Encourage staff to think creatively about content;

have content in mind before start of project

WEB SITE TIMELINE: PAGE 1 OF 5

LAY-OUT & DESIGN USING WIREFRAMES

ANOTHER EXAMPLE OF WIREFRAMES USING MOCKINGBIRD

BRANCH PAGE MOCK-UP USING WIREFRAMES

TRACK CONTENT DEADLINES ON SPREADSHEET

TEEN CONTENT

INCLUDE PROOFREADING

STAFF UPLOADED CONTENT USINGGOOGLE DOCS

SOCIAL MEDIA CHEAT SHEETS FOR STAFF

CHEAT SHEET FOR PHOTOS

CREATE TOOLKITS FORFLICKR & YOUTUBE

CREATE TOOLKITS FOR TWITTER, BLOGS– ALL SOCIAL MEDIA

NEW WEB SITE LAUNCHES 11/1/11

• Dynamic & interactive– carousel displays, navigation, bread crumbs

• Appealing colors and photos, use of high-quality images (some purchased stock images)

• Site search enabled• New & improved tabs• Events & calendar highlight library outreach• Incorporation of social media, with new staff blogs, &

library Twitter, FaceBook, Flickr & YouTube accounts• Digital download explosion• New logo• Web standard formatting, e.g. footer links, account

log-in placement, font size options, about us

Amanda Foust, Electronic Services [email protected](415) 499-7451

Julie Magnus, Acting Branch [email protected](415) 924-6444

Anna Jonsson, Library Assistant [email protected](415) 897-1141

How to get in touch with us at MCFL