View on GitHub

LIS 861: Information Architecture

or: "Help, my organization has a web site! (and I might end up in charge of it)"

Welcome and objectives

Howdy and welcome! While this course is formally "Information Architecture", I think of it as "Help! My organization has a web site (and I might end up in charge of it)".

In one semester, I can't hope to make you experts in all the things you might need to know to build and manage a web site — especially since it's always changing! However, you will know what domains you'll need to learn more about if you find yourself running a real-world web site; the vocabulary for talking with domain experts; and where to go to learn more.

This course addresses UW SLIS program level learning objectives 3a, 3c, 3d, 4a, 4b, and 4d. For details, see the table in the Program Level Learning Objectives section, below.


  • Andromeda Yelton (please call me "Andromeda")
Office hours: by appointment, via Skype or Google Hangout

Please use exhaust your information resources (the Learn@UW help forum, google, software documentation and help files, trial and error, etc.) before emailing me; please also do your best to assist your colleagues. In my experience, students can usually help one another better than teachers can!

Otherwise, email me. I will try to respond to your emails within two business days. However, I will be traveling to several library conferences this semester; during and immediately after travel I may be slow to reply. My travel dates:

If you will be at any of these, I'd love to meet you; drop me a line.


Links will be added to detailed requirements as the semester progresses.

Assignment % of final grade Due date
Web site version 1.010February 24
Accessibility evaluation10April 21
Web site version 2.015April 28
Final project... 30 deliverable35May 16
Failure assessment5May 16

Final grade scale: 100-93.5 A; 93.4-89.5 AB; 89.4-83.5 B; 83.4-79.5 BC; 79.4-73.5 C and so on…

Week by Week

Week 1 (Jan 21-Jan 26) — HTML basics

Key questions

How do I get HTML from my brain to my computer to my browser?

How do I write a basic HTML file?

Who’s in this class with me, and what are we all doing here?

To read/watch

If needed: Installing a text editor (you can ignore the parts about Python and converting tabs to spaces)

If needed: Head First HTML, Ch. 1

Basic HTML video

Developer Tools video

Zeldman. Before you Begin, Ch. 1-2, 5-6, 8

Things I Wish Someone Had Told Me When I Was Learning How to Code.

  • Introduce yourself in the Introductions forum, and read your classmates’ and instructor’s introductions.
  • Make sure you have a text editor. If you don’t (or don’t know what a text editor is or how it differs from a word processor), install one, using the “Installing a text editor” instructions above.
  • Make sure you can edit and save an HTML file in a text editor and view it in your browser. If you don’t know how to do this, read Head First HTML, Chapter 1.
  • If you’ve followed the text editor instructions, read Chapter 1, and you still can’t edit and save an HTML file and view it in your browser, ask questions ASAP. You can ask anonymously in the help forum if you prefer.
  • Make sure you know where to find developer tools in your browser. If you cannot do this, ask questions ASAP.
  • If any unfamiliar terms or concepts in Zeldman are unfamiliar to you, ask questions in the Unfamiliar Terms? thread of the Week 1 discussion forum.
  • Answer the other questions in the Week 1 discussion forum.
  • We’re all in this together, so make sure your classmates’ questions get answered. If you know the answers already, great. If you don’t, use your ninja-like reference skills to help find answers (don’t forget to explain your search strategy!).

Week 2 (Jan 27-Feb 2) — More fun with HTML

Cancelled due to family emergency

Week 3 (Feb 3-Feb 9) — CSS basics

Key questions

How do I add styling to an HTML file with CSS?

How can I learn the basics of good web design, even if I’m not a designer?

What are some of the deeper concepts that web design can provoke us to think about, and what can we learn from them about how to build better web experiences?

To read/watch

What Screens Want

Zeldman, Ch. 9, 10, 12, 13 (just the first section, “On Typography”)

design seeds and Adobe Kuler

If you have a great sense of color, you can skip design seeds, though you might find it fun anyway. Kuler will help you generate reasonable color schemes if you don’t have a strong color sense; even if you do, you might find the hex codes useful.

Google webfonts

Play around with this: search for some fonts that might be good for headers and for body text, add a few to your collection, and make sure you know where to copy-paste the code you need to use them.

The Elements of Typographic Style Applied to the Web

The Non-Designer’s Design Book

As a non-designer, I found this book VERY illuminating and empowering; it lays out simple rules you can use to make good choices even if you don’t have an instinct for art.

The Design of Everyday Things

A genuine classic of design and user experience that will change the way you see the world around you. Worth reading for its notion of “affordances” alone.

Literary Machines

A weird, quirky, brilliant book unlike anything you’ve ever read. The origin of hypertext. Available on campus at UW; may be hard to find elsewhere, but it’s worth ILLing.

Useful CSS

A helpful cheat sheet for the CSS you’ll use most often.

Less and/or SASS

If you’re comfortable with CSS, and especially if you’ve run into headaches trying to maintain stylesheets for large sites, these will change your whole workflow, and it’ll be great. Bootstrap, which we’ll see next week, is Less-based.

Zeldman, Ch. 11

Read if you’re interested in what’s up with doctype declarations, the details of browser incompatibility, the history behind these things, and why designing for earlier Internet Explorer versions will make you want to pull your hair out.

  • Do the required readings.
  • Make sure you can define the following: skeuomorphism, wireframes, dark patterns, bandwidth-friendly, inheritance (in a CSS context), box model, float.
  • Answer the questions in the Week 3 discussion forum in Learn@UW.
  • We’re all in this together, so make sure your classmates’ questions get answered. If you know the answers already, great. If you don’t, use your ninja-like reference skills to help find answers (don’t forget to explain your search strategy!).
  • Make sure you’ve read and gotten started on Assignment 1, due February 24: you now know everything you need to know to complete it, except responsive design.

Week 4 (Feb 10-Feb 16) — Bootstrap and Responsive Web Design

Key questions

What is responsive web design and why do we care?

What are some of the differences besides styling that go into designing for mobile? What problems does responsive web design solve, and what problems doesn’t it solve?

How do you apply Bootstrap’s CSS elements to a web site and perform basic customizations?

How does RWD fit into the big picture of usability? (We’ll come back to this later.)

To read/watch


Responsive Web Design

The foundational article for RWD: this is where it got started.

Bootstrap documentation

This is a reference work, so you don’t need to read it comprehensively. Instead, skim it (especially the Getting Started page) to learn what your options are, and then solidify your understanding by building a basic Bootstrap page from one of the templates and the available CSS components. (You don’t need to use the JS components now, although if you were familiar with HTML and/ or programming before the course, they’re a good way to extend your knowledge. We’ll come back to them.)
If you haven’t read a lot of tech documentation before, here’s how: pick one component. Then either read about in-depth and then build it, or build and then read its documentation in more depth as needed – whichever style works better for you – going back and forth between reading and building until the component works. The documentation may not make total sense until you’ve built the thing, and that’s okay.

Responsive Web Design for Libraries

You can download the slides as PDF from this page, but you may find the SpeakerDeck version faster.

Control Issues

Responsive Design Won’t Fix Your Content Problem

Cell Internet Use 2013

Read the full report, particularly the demographics of cell-mostly vs desktop-mostly users.

Smartphone Ownership 2013

Read the full report.


If you need to see CSS in action, I’ve made a few videos for you (screenshots of my applying CSS to the HTML file from week 1). CSS Selectors, CSS Box model, CSS Font Styling and Google Fonts

Hanson, Ch. 3.

Clark, Ch. 5.

A Dao of Web Design

The example sites available at Bootstrap (use your dev tools to analyze them!)

  • Do the required readings/viewing.
  • Answer questions in the Week 4 discussion forums.
  • Make sure you’ve read and gotten started on Assignment 1, due February 24: you now know everything you need to know to complete it.

Week 5 (Feb 17-Feb 23) — CMSes

Due end of week: Web site version 1.0

Key questions

What is a content management system and why do we care?

How can you evaluate whether a CMS and its plugins meet your needs?

What are some of the nontechnical issues raised by large web projects?

To read/watch


Byron et al., Ch.1, 2, 7, and Appendix B

Use (or your own Drupal installation) to actually do the hands-on sections in Ch. 2. You won’t be able to do all the hands-on parts of Ch. 7 without your own installation that includes the relevant modules; just do what you can.

Varnum, Ch. 1

Jones & Farrington, Ch. 2 and 3

At least one of the Done in WordPress blog series (Goodman 2013):

Doing a Content Inventory

Schmidt & Etches, pp 60-71 (the sections on content audit and content workflow)


Byron et al. (the rest of the book)

Varnum (the rest of the book)

Drupal Ladder

Walks you through how to contribute to Drupal code and documentation.

The Drupal community, including its IRC channels and meetups

The Drupal4lib mailing list

The LITA Drupal4Lib interest group

Jones & Farrington (the rest of the book)

Goodman (2014)

Get a free blog and mess around with it. (Or install your own from!)

WordPress Codex

The reference manual for WordPress technical support.

WordPress meetups

Halvorson & Rach

Follow some of the authors of this week’s reading on twitter: @webchick (Angela Byron), @varnum (Ken Varnum), @pollyalida (Polly-Alida Farrington), @thecorkboard (Kyle Jones - also a UW student!), @godaisies (Amanda Goodman), @walkingpaper (Aaron Schmidt), @etches (Amanda Etches)

  • Do the readings
  • Make sure you know what the following terms mean. If there are any you don’t know, do research and/or ask questions until you do:

    • open source
    • dynamic (in the context of a web page)
    • modules/plugins
    • PHP
    • database, MySQL
    • web server
    • operating system
    • RSS feed
    • deprecated (in the software context)
    • case-sensitive
  • Answer the questions in the Learn@UW Week 5 forum
  • Don’t forget that Assignment 1 is due next Monday!

Week 6 (Feb 24-Mar 2) — Dynamic content & web programming

Key questions

What is jQuery and why do we care?

How can I add some interactivity to my page with jQuery?

How does the jQuery + CSS combination give us powerful new options?

Readings and work


Read the Week 6 reading in Learn@UW (available in the Content Browser sidebar), containing the How To Read Documentation video and the What is the DOM explanation.

Watch jQuery for Web Designers: Introduction, part 1 (Introducing jQuery), part 2 (Essential jQuery concepts)

You can access this via your UW account: Log in > Log in through your organization or school > type in the blank. If you’re not already logged in to you’ll be asked to do that; otherwise it should just work.
Make sure to do the challenge in part 2. It’s okay if your answer differs from his as long as it works; there’s usually more than one right answer in programming.

Post your questions and/or reflections on the Lynda video in the relevant thread of the Learn@UW Week 6 forum.

Read the documentation at for .slideToggle(), .addClass(), .removeClass(), .toggleClass(), .css()

Add an effect to your HTML page from Assignment 1 with jQuery, and tell us about it in the relevant thread of the Week 6 forum.

It can be any effect you like, and the page doesn’t have to look good when you’re done; the goal is to make it work. If you aren’t sure where to start, use .toggleClass() on something that has a class already.

Answer the “what is jQuery and why do we care” question in the Learn@UW Week 6 forum.


Do you have unresolved questions or nifty insights? Post to the ‘any other questions & reflections’ thread.

Read anything else that looks interesting on

Read anything that looks interesting on

There’s a ton of great info here, but it assumes that you have some programming experience. You can absolutely still read it if you don’t - just be prepared to spend some extra time looking things up and asking questions. It’s okay if it doesn’t all make sense on the first read-through; it will make more sense as you gain experience.

The UW library is looking for focus group participants for a web site redesign; you might find this process interesting.

Week 7 (Mar 3-Mar 9) — Dynamic content & web programming

Key questions

What are the Bootstrap JavaScript components, and how do they give us some new options for interactivity?

How can we iterate code: make it work or make it better, e.g. by critiquing it and trying new things?


Required Read Bootstrap JavaScript components

Review last weeks’ How to Read Documentation video if needed.

Apply a bootstrap.js effect to your HTML page.

Reply to a post (not your own) in last week’s Your jQuery Effect thread as follows (pick one):

  • Find a post with a script (whether it works or not). Describe what you believe the script is doing, step by step, in English, and ask the original author if that’s accurate. (If you’re the original author, please tell them if they’re right! If they’re not, explain what you were going for. As a bonus, this may help you understand errors in your code.)
  • Find a post where someone wants help improving the script and help them out. If you know exactly what to do, go ahead and explain it or write the code. If you don’t, that’s fine too - ask some questions that will help them clarify their thinking, or find some resources that you think might help them get on the right track, or explain the half you do know how to solve and ask for help on the half you don’t.

Iterate your jQuery from last week. If it wasn’t working, try a new strategy (get something simpler to work, ask for help and go from there, etc.) If it was, make it do something more complicated. Post about it to last week’s ‘Your jQuery Effect’ thread.

Read the final project one-pager and final project deliverable assignments. There’s a Final Projects thread in the Content Browser > Course-wide info area you can use to ask questions, propose ideas, and find teammates.

Discuss the Week 7 discussion forum threads.

Except for the questions/reflections thread, none of these are optional. If you’re having trouble with your Bootstrap effect, posting about what you’ve tried and where you’re stuck is a completely legitimate way to participate.


The rest of jQuery for Web Designers jQuery Essential Training

I found this more technical than the jQuery for Web Designers class, but you may find it handy to have an additional perspective.

Building Twitter Bootstrap

Curious how and why Twitter built Bootstrap? Here you go!

Progressive Enhancement with JavaScript

You can do lots of cool stuff with JS, but possibly at a cost: e.g. making sites slower to load, or less accessible to users who have screenreaders, or who have disabled JavaScript. Progressive enhancement is the idea that the bare-bones version of your site (no JS, no CSS) should work, providing access to all the core content and functionality; styling and interactivity are layers on top of that which enhance the experience for other users. This article discusses some of the techniques for doing that.

Week 8 (Mar 10-Mar 14) — Information architecture basics

Key questions

How do users seek information?

What are some organizational tools that can help (or hinder!) that search?

How can we evaluate whether a web site’s information architecture succeeds in helping users find stuff?

To read/do



Answer the card sorting question in the forums. Come back later and see how your classmates answered it; respond to something you find thought-provoking.

Answer one of the following in the Evaluation thread in the Week 8 Discussion Forum:

  • The articles “Avoid Category Names That Suck”, “Where Am I?”, and “Home Page Goals” each give some concrete criteria for evaluating a web page’s information architecture. Pick whichever article you found most interesting, and evaluate a library web page according to those criteria. (Any library is fine.) Tell us about it.
  • Pick an idea from this week and go to the UW library catalog to learn more about it. Keeping in mind Kuhlthau’s ideas and the techniques you’ve seen this week: what did you encounter that helped your process of selection, exploration, formulation, and collection? What hindered it? Did anything particularly increase, or decrease, either your uncertainty or your anxiety? Tell us about it.


Optimizing Websites in the Post Panda World

Toward the end, suggests some interesting and unconventional clues that may help answer information needs.

The rest of Prejudices and Antipathies

What Happens When Architectural Questions Are Not Asked?

A concrete example of how to confuse users via Facebook privacy settings.

The Design of Browsing and Berrypicking Techniques for the Online Search Interface

A classic paper on how people think when looking for information. It challenged conventional wisdom at the time, though its suggestions for how to build interfaces may seem dated today.

The Anatomy of a Large-Scale Hypertextual Web Search Engine

A late-1990s paper on using citation analysis (discussed in the berrypicking paper, above) to build a prototype search engine. Google went on to be fairly well known.

Folksonomies? How about Metadata Ecologies? and folksonomies + controlled vocabularies

Eminent information architect Louis Rosenfeld and internet theorist Clay Shirky argue about the relative values of controlled vocabularies and folksonomies (vocabularies for organization that emerge from user-defined labels).

Any Wikipedia page

What tools are here to organize information? (Be sure to look at sidebars, if any; tabs; and whatever’s toward the bottom of the page. What categories is the page part of? What does Wikipedia tell us about its context or provenance?)

Spring break (Mar 17-Mar 21)

Have fun!

Week 9 (Mar 24-Mar 30) — Usability basics

Due end of week: Final project one-pager

Key questions

What are some key principles of usability?

What are some usability challenges faced by library web sites in particular?



Read the Week 9 Overview (located in the Learn@UW content browser).


Answer the 3 discussion questions in the Week 9 forums.

Keep these ideas in mind as you interact with whatever web sites you use every day.


The rest of Krug

The Design of Everyday Things

If you didn’t read it in week 3 - and maybe again, if you did.

The rest of Schmidt & Etches

Aaron Schmidt writes a Library Journal column on usability, The User Experience

Lots of useful tools.

Whitney Hess’s DIY UX talk

An overview of the process of the process that you could use to improve user experience.

Design Choices Can Cripple a Website

An example of how small web design choices can have dramatic effects on task completion.

Your Library Web Site Stinks And It’s Your Fault

Matthew Reidsma tells us how to make it better.

Week 10 (Mar 31-Apr 6) — Scenarios & personas

Key questions

What’s a persona?

What can personas help us achieve, and what problems can they help us avoid?

What are good and bad ways to come up with personas?




Also read any one of the following:

Then answer the Week 10 Discussion Forum questions.


You probably won’t be able to implement all of these methods, but you may find it interesting to see how wide the options are, and think about what the benefits and drawbacks of different methods are, in case you find yourself needing to choose among them. The methods also illustrate a variety of ways you might gather data for generating personas.

Week 11 (Apr 7-Apr 13) — Usability testing & assessment tools

Moved to following week: Accessibility evaluation

Key questions

What are some specific techniques and tools you can use to answer questions about web site usability?

Given these tools, what kinds of questions can we ask?

What benefits and limitations do different usability testing tools have?




  • Rocket Surgery Made Easy
  • The rest of McHale and Farney
  • Lehman and Nikkel
  • Incorporate Google Analytics or Crazy Egg in a page you control; play around with the dashboard and see what you can learn. (GA is free; Crazy Egg offers a free trial. Both require accounts.)
  • Try out BrowserStack. (It offers a free trial, requiring an account.)
  • how-to and tools section

Week 12 (Apr 14-Apr 20) — Accessibility Tools and Testing

Due end of week: Accessibility evaluation

Key questions

How might the web look different if you were navigating it with some disability you don’t (currently) have?

What tools can help us investigate other perspectives on the web and check for accessibility problems?

What are some techniques for fixing accessibility problems?




  • Ask questions or make comments in the Week 12 forum as needed.
  • Read/skim the WAI quick reference on How to Meet WCAG 2.0 (it isn’t actually quick, but it’s a good reference, and you can customize it to show only the areas of concern you care about, or the level of compliance you’re aiming for)

Week 13 (Apr 21-Apr 27) — Universal Design for People

Due end of week: Web site version 2.0

Key questions

Who are your patrons with disabilities? What sorts of needs do they have and what design choices and adaptive technologies address them?

What’s universal design, and why is it a useful perspective?

What are specific examples of how these issues play out in a library context?



You’ll probably be connecting lots of patrons to lots of PDFs as a librarian, so you should know about their accessibility issues.


Reference works, in case you need to learn more on specific topics or get a quick sense of things to check. The Accessibility Project is open source and welcomes contributions of articles as well as code; see the issues list and contributor guidelines if you’re interested in contributing.

If you’ll be implementing projects in the US public sector, you will need to familiarize yourself with Section 508, which governs accessibility.

  • Eames: The Architect and the Painter

If you were intrigued by their work (referenced in the Medium article), I strongly recommend this beautiful, intriguing documentary about them. A fascinating and brilliant couple.

Week 14 (Apr 28-May 4) — Project Management

Key questions

What’s the agile project management method, and why do we care?

How do you run an effective meeting?

What does project management look like in library technical projects?



Salo, Project Management

Waters, How to Implement Scrum in 10 Easy Steps, and the 10 blog posts linked from it describing those steps

Metz, LIS 861: Project Management

Rogers (PowerPoint file available in Learn@UW - make sure to read the presenter notes)

Ballard & Teague-Rector

Critchlow, Friedman, & Suchy

Glendon & Baumann


Fail4Lib preconference materials

Want to know more about risk in project management? Discover how some library projects have failed, and what we can learn from that.

Library Project Management Toolkit

A crowdsourced reference (you can edit it!) full of info on project management software, charters and one-pagers, working with stakeholders, etc.

Metz, Managing Projects Part 1 and Part 2

This provides more specifics on how you can implement project planning, including some good concrete stuff on time and budget estimation. Make sure to read the presenter notes.

Week 15 (May 5-May 11) — Stakeholders and buy-in

Key questions

Whom might you need to get on board when you implement a library technology project?

What obstacles might you encounter in getting buy-in?

What strategies and tactics can you use to build an effective, two-way communications strategy that lets you get good technology work done?



  • Read the Week 15 overview in Learn@UW.
  • Watch the embedded video and read the linked documents.
  • Answer the two discussion forum questions.
  • Don’t forget about your final project and your failure assessment, due at the end of next week!

Week 16 (May 12-May 16) — Final projects due

Due end of week: Final project deliverables; failure assessment


Course policies

I wish to fully include persons with disabilities in this course. Please let me know within two weeks if you require accommodation. I will try to maintain the confidentiality of this information.

Academic honesty

I follow the academic standards for cheating and plagiarism set forth by the University of Wisconsin.

I consider myself personally bound by the honor code of my undergraduate college, which states that I am "responsible for maintaining [my] integrity and the integrity of the college community in all academic matters and in all affairs concerning the community." While you are not bound by this, I encourage you to act in a way that reflects well on yourself and the institutions you represent.

Be the protagonist of your own technology adventure

An explicit goal of this course is self-sufficiency in acquiring knowledge about novel technology. To that end, I will NOT handhold you through every technology we look at. You are expected to exhaust normal information channels (google, documentation and help menus for software, trial and error, etc.) before you approach classmates or (especially) me with nuts-and-bolts technology questions.

Because we come to this class with a wide range of technology backgrounds, you may find some of the course material is not novel for you. I encourage you to approach me with alternative assignment proposals that will push the boundaries of your technology skills. I am happy to suggest things you might wish to learn next, based on where you are now.


Our course week, for convenience, runs from Monday to Monday beginning January 21 (so the first week is a day short). All assignments will be due on Mondays by midnight Central, with the exception of the assignments due immediately before spring break and during finals week; these are due on Friday. Late assignments will be penalized one final-grade percentage point per day or fraction thereof late. If some catastrophe befalls you and you must negotiate alternatives, contact me before the due date; lenience is at my sole discretion.

If this catastrophe affects your group project, contact your colleagues as well.

I do not offer extra credit.

Program Level Learning Objectives

This will be elaborated as assignments become available.

LIS program level learning objective Course objectives Assignments that provide evidence Criteria for assessing evidence in the assignment
3a. Students organize and describe print and digital information resources. Web site version 2.0, usability evaluation, final project
3c. Students analyze information needs of diverse individuals and communities. Usability evaluation, final project
3d. Students understand and use appropriate information technologies. Web site version 1.0, web site version 2.0, usability evaluation, final project
4a. Students evaluate, problem solve and think critically, both individually and in teams. Usability evaluation, final project, failure assessment, participation
4b. Students demonstrate good oral and written communication skills. All (particularly participation)
4d.Students demonstrate innovation and skills necessary for leadership. Final project; optionally also the technical projects, depending on the degree of technical creativity and mastery shown