LIS 390W1A - Schedule

Introduction

See the course narrative for more details.

• Introductions
• Brief Overview of the Class
• Administrative Stuff
• Assignments & Grading
• Expectations & Philosophy

Lab

Lab 1: Introduction to HTML: How Easy is Easy?

We'll need to setup your GSLIS I: drives for you to complete the lab.

How Computers Work

Quiz

There will be a short Quiz on Wednesday about how computers work, so pay attention in class.

Required Reading

• Basic Computer Tutorial

Related Readings (Optional):

• Shuler, R. (2002). How does the Internet Work?
• Horton, M. (1986) What is a Domain?
• A Brief History of the Internet
• Windbigler, K. Exploring the Domain Name Space
• Gilbert, H. (1995). TCP/IP
• http://www2.rad.com/networks/1994/osi/layers.htm

Lab

None. Instead we'll be having a Quiz on Wednesday.

No Class!!!

How the Internet Works

Quiz 1

Today we will be taking Quiz 1 at the beginning of class.

Required Reading

• Shuler, R. (2002). How does the Internet Work?
• Horton, M. (1986) What is a Domain?

Related Readings (Optional):

• Basic Computer Tutorial
• A Brief History of the Internet
• Windbigler, K. Exploring the Domain Name Space
• Gilbert, H. (1995). TCP/IP
• http://www2.rad.com/networks/1994/osi/layers.htm

Lab

For anyone who has not already done so, we'll need to setup your GSLIS I: drives, and then we'll need to do a bit of quick admin work. Then we can start on the lab.

Lab 2: Shuler's "Check It Out" Exercises

Fun with Technology!

We will be learning how to use all the main technologies that we will be using in this course, including text editors, web browsers, ssh, netfiles, I: Drive, etc. We ought to finish with these technologies today.

In this class, we will be utilizing the Course Technologies section of the course website a great deal.

Lab

Finish Lab 2: Shuler's "Check It Out" Exercises

More Fun with Technology

We will be learning how to use all the main technologies that we will be using in this course, including text editors, web browsers, ssh, netfiles, I: Drive, etc. We ought to finish with these technologies today.

In this class, we will be utilizing the Course Technologies section of the course website a great deal.

Lab

No Lab.

Basic HTML

Required Reading

• Raggett, D. (2005). Getting Started with HTML

Useful Reference:

• W3 Schools
• W3C HTML Working Group

Lab

Lab 3: Basic HTML

Markup and HTML

Required Reading

• Resseler, S. (1996). The Art of Electronic Publishing. Section 4.3
• On Semantics and Markup
• HTML DOM

Related Readings (Optional):

• Markup Systems and the Future of Scholarly Text Processing by James H. Coombs, Allen H. Renear, and Steven J. DeRose (1987).

Lab

Lab 4: Kinds of Markup

The Importance of Standards & HTML Validation

Required Reading

• Boudreau (2002). The Importance of Web Standards.
• Richmond, A. HTML Standards Compliance - Why Bother?

Also, check out the W3 HTML Validator

Related Readings (Optional)

• XHTML Standard

Lab

Lab 5: Writing Valid HTML/XHTML

Introduction to CSS

Required Reading

• Raggett, D. (2002). Adding a touch of style
• Learning Cascading Style Sheets - Pick one or two things to skim

Related Readings (Optional):

• CSS Zen Garden

Lab

Lab 6: Introduction to CSS

Introduction to Accessibility

Bring headphones to class!!!

Required Reading

Read these if you have time. I may assign these again in a future class, depending on how the semester evolves.

• Section 508, Subpart B, §1194.22
• UIUC Web Accessibility Best Practices - Read all the Overview sections (skim the tables), skim the Requirements section
• How to design web accessible pages for the colorblind

If you have time, also take a look at the Functional Accessibility Evaluator

Related Readings (optional)

• The Accessibility Board Section 508
• Web Content Accessibility Guide
• Web Accessibility Initiative
• State of Illinois Web Accessibility Standards
• ITTATC links page to Disabilities Related Laws
• WebAIM.org. (2010). "Introduction to Web Accessibility."
• Butler, S. (2010). "An Idiot’s Guide to Accessible Website Design." Webdesignledger.com
• Smith, J. (2010). "The ADA and the Web: Concerns and Misconceptions." WebAIM Blog.
• WebAIM.org (2010). "Web Accessibility Gone Wild."
• Caldwell, B., Cooper, M., Reid, L.G., Vanderheiden, G. (2008). "Web Content Accessibility Guidelines (WCAG) 2.0" W3C.
• Information Services Access Board. (2010). "Draft Information and Communication Technology (ICT) Standards and Guidelines (Section 508)." Federal Register, Access-board.gov.
• Illinois Information Technology Accessiblity Act. (2002). "Implementation Guidelines for Web-based Information and Applications 1.0" Illinois Department of Human Services, dhs.state.il.us.

Accessibility Evaluators

• Cynthia - Section 508 Validitator
• Webxact
• The WAVE Accessibility Evaluation Tool
• Functional Accessibility Evaluator
• CITA firefox extension
  • Firefox site

Lab

Lab 7: Introduction to Accessibility.

More HTML

Required Reading

• Raggett, D. (2005). More advanced features

Useful Reference:

• W3 Schools

Lab

Lab 8: Writing More HTML.

HTML & CSS

Required Reading

• CSS Zen Garden
• Raggett, D. (2002). Adding a touch of style
• Learning Cascading Style Sheets - Pick one or two things to skim

Note

Quiz 2 (50 points) is on Wednesday of next week.

Lab

Lab 9: Messing with CSS.

Test page from 2009's lecture on this topic.

Test page from 2007's lecture on this topic.

HTML Tables

Required Reading

• Graham, Ian. (1998). Introduction to HTML. Chapter 4. Tables
• W3C HTML Tables
• W3C Tables and CSS
• Table tutorial - especially useful for understanding how to use <thead> and <tbody> and <tfoot> tags.

Related Readings (Optional):

• W3C Table Layout Techniques
• CSS Tables by Robert Denton
• W3Schools CSS: border-collapse

Lab

Lab 10: HTML Tables.

Web Design and Web Usability

Slides

Slides for the usability lecture.

Required Reading

• Usability 101
• Usability Misconceptions
• Usability Testing

Related Readings (Optional):

• Nielsen, Jakob. "About Us Pages."
• Nielsen, Jakob. "Why This Site Has Almost No Graphics."
• Play with Speed Reader
• "Usability", from Wikipedia
• "Vincent Flanders’ Web Pages that Suck."
• Nielsen (1997). How users READ on the web.
• Morkes, J., Nielsen, J. (1997) Concise, SCANNABLE, and Objective: How to Write for the Web

Lab

None. Keep working on the Personal Website Assignment, and use what you learned today.

CSS: Relative Layouts

Quiz 2 (50 points) is Today

Required Reading

• Zeldman, J. From Table Hacks to CSS Layout: A Web Designer's Journey
• Korpela, Jukka. (2001). Why style sheets are Harmful

Related Readings (Optional):

• A List Apart
• W3 Schools
• Newhouse, M. Practical CSS Layout Tips, Tricks and Techniques
• Holzschlag, M. E. Thinking outside the Grid
• CSS Units
• CSS Selectors
• CSS Mouseovers

Lab

Lab 11: More CSS.

Quick Overview of Javascript & PHP

Required Reading

• Check out these JavaScript tutorials at Quirksmode
• Check out PHP.net - Skim the site, get a sense of what is there.

For the following sites, check them out to see what is possible with javascript:

• How to add a google map to a web page in 10 minutes
• Add Digg to your homepage
• Geotagging: Flickr and Google Maps
• Mappr

Examples of Javascript

• http://maps.google.com/maps
• http://www.walterzorn.com/dragdrop/dragdrop_e.htm
• http://script.aculo.us/
• http://dojotoolkit.org/demos
• http://jsmsxdemo.googlepages.com/jsmsx.html

Lab

Lab 12: Introduction to Javascript & PHP

Quick Overview of Javascript & PHP

Required Reading

• Check out these JavaScript tutorials at Quirksmode
• Check out PHP.net - Skim the site, get a sense of what is there.

For the following sites, check them out to see what is possible with javascript:

• How to add a google map to a web page in 10 minutes
• Add Digg to your homepage
• Geotagging: Flickr and Google Maps
• Mappr

Examples of Javascript

• http://maps.google.com/maps
• http://www.walterzorn.com/dragdrop/dragdrop_e.htm
• http://script.aculo.us/
• http://dojotoolkit.org/demos
• http://jsmsxdemo.googlepages.com/jsmsx.html

Lab

Lab 12: Introduction to Javascript & PHP

Personal Website Assignment In-Class Lab Session

Please bring the following to class:

• An updated draft of the Personal Website Assignment.
• 1-5 websites that you want your Personal Website Assignment to look like or that do something cool you'd like to copy, but aren't sure how.

Lab

No lab. Keep working on your Personal Website Assignment.

History of the Web

Required Reading

• Bush, V. (1945) As we may think, The Atlantic Monthly, July 1945.
• A Brief History of the Internet
  • Try this link if the above link does not work.

Related Readings (Optional):

• Licklider, J.C.R. (1968). The Computer as a Communication Device. Science and Technology. April 1968.
• O'Neill et al. (2003) Trends in the Evolution of the Public Web. D-Lib Magazine, 9(4).
• Pew Internet & American Life Trend Data for Adults and Infographics
  • More Sources for Internet and Web Statistics
• Hobbes's Internet Timeline
• Jules Verne bibliography
• The Visible Man: An FBI Target Puts His Whole Life Online - The tale of Hasan Elahi.
• A Decade of Internet Evolution by Vinton G. Cerf.
• A Decade in the Life of the Internet by Geoff Huston

Lab

No lab. Keep working on your Personal Website Assignment.

HTML Forms

Required Reading

• W3 Schools (be sure to click through and read the examples at the bottom)

Related Readings (Optional):

• HTML Code Tutorial - Forms
• HTML Forms

Lab

Lab 13: Forms.

Data Management & Hosting Your Own Site

Brief review of strategies for Data Management: organization, backup, etc. Also, brief overview of different options for personal web hosting.

Issues:

• Storage & Bandwidth - and the pricing model
• CGI & Scripting support (PHP, Perl, Java, etc.)
• DB support: MySQL, PosgreSQL, others?
• File access via the web vs. ssh/ftp access + web access
• Domain registration & management
• Email support
• Mailing list support, and more importantly, with what software
• Pricing model, generally: Setup Fees are often sketchy, pro-rated cancellation is also good, monthly fee vs. pay-for-use.
• Long-term reliability of the hosting
• Piecemeal services vs. all-in-one

Free Web Hosting (you get what you pay for)

• None exist anymore

Web Hosting Solutions:

• Nearly Free Speech.net
• Dreamhost
• Bluehost
• Laughing Squid
• A Small Orange

Web hosting services I strongly do not recommend:

• Go Daddy

Virtual Private Servers and Dedicated Servers

• There used to be more dedicated services that I could recommend. While these still exist, most people I know either use services provided by one of the above companies, or they use Amazon.

Other hosting (-like) services

• Amazon EC2
• Google App Engine

Simple, free (to start) website creation services

• Wix
• Weebly

Automatic Backups

• PC Magazine: The Best Online Backup Services (04.29.08)
• But also a question of business model - how long will these services last, and what do they do with your data when they fail?
• SOS Online Backup
• Mozy
• Elephant Drive

Other Backup Solutions (hacks)

• Dropbox
• Opendrive

Lab

No Lab. Work on your Final Project Proposals.

Paper Prototyping

Required Reading

• Paper Prototyping - A List Apart
• Prototyping for Tiny Fingers by Marc Rettig

Related Readings (Optional):

• Chapter 1 of The Design of Everyday Things by Donald Norman
• Paper Prototyping: Getting User Data Before You Code by Jakob Nielsen
• PaperPrototyping.com
• Guerrilla HCI: Using Discount Usability Engineering to Penetrate the Intimidation Barrier by Jakob Nielsen
• Body Storming Resources
• Personas and Storytelling
• Example Design Rationale
• Readings from LIS 490IT - Entrepreneurial IT Design

Bad Design, or what not to do:

• Web Pages that Suck
• Bad Designs

Good Design, harder than it seems:

• Good Design

Lab

Lab 14: Paper Prototyping.

Installing Wordpress

Required Reading

None.

Related Readings (Optional):

None.

Lab

Lab 15: Installing Wordpress.

Wordpress

Required Reading

• Using Wordpress Themes
• Wordpress Widgets
• Wordpress Plugins

Related Readings (Optional):

• Wordpress Theme Development
• Wordpress Child Themes
• Wordpress Plugin Resources

Lab

Lab 16: Introduction to Wordpress.

Final Projects Review

Lab

Lab 17: Final Project Proposal Revision.

Wordpress Themes

Class Prep

Come to class with the latest version of your Final Project ready to be used, and bring any design materials you might need like paper prototypes, etc.

Required Reading

• Wordpress Theme Development
• Wordpress Child Themes

Related Readings (Optional):

• Wordpress Plugin Resources
• Using Wordpress Themes
• Wordpress Widgets
• Wordpress Plugins

Lab

Lab 18: Wordpress Themes.

Final Project Lab Day

Bring your final projects to class. And bring any questions you might have. We'll work together on them in class.

Lab

No Lab. Keep working on your final projects.

Final Project Lab Day

Bring your final projects to class. And bring any questions you might have. We'll work together on them in class.

Lab

No Lab. Keep working on your final projects.

Final Project Presentations

Exact Scheduling to be determined