Introduction to Web Design for Literary Theorists

A series of workshops for graduate students in the Department of English

Patrick Mooney, Co-Lead TA, Department of English
Office Hours this spring (for TAs): W 2:30-3:30 & Th 2:00-3:00 (& by appt), in South Hall 2432E.
Email:
Voicemail: (805) 272-0069

Web Design for Literary Theorists is a series of lecture/workshops that I have offered to graduate students as part of my responsibilities as co-lead TA for the Department of English at the University of California, Santa Barbara. I anticipate that graduate students from the English department who attend this series of workshops and practice the skills taught there will acquire the ability to write valid, well-formed HTML and CSS sufficiently well to create a small personal website that hosts content for course or discussion section websites and helps to make teaching practices visible on the web.

Web design is often represented as a complex, difficult task requiring elaborate training and expensive software, and for some web design tasks, this actually necessary — but not as often as you might think. It is in fact possible to build static websites by hand using only free software by writing HTML and CSS code directly, and doing this is sufficient to represent one's own identity on the Internet, to distribute course materials to students, and to accomplish many other tasks that involve putting information online. Though many people mistakenly believe that "learning HTML is hard," this is actually not the case. Building web sites with HTML and CSS does not require you to learn "programming," which is a difficult skill — learning HTML and CSS primarily requires that you learn how to mark text files in such a way as to indicate their semantic structures in a machine-readable way. That is to say, all that literary theorists need to do is to leverage the existing ways that they already think about text and learn a small vocabulary and grammar of machine-readable tags. This is a skill whose fundamentals can be learned in a few hours and reinforced through practice when you have time to do so. It is also possible to host your content inexpensively on the web — I myself use, and recommend, NearlyFreeSpeech.net, and pay, on average, a little under 8¢ a month do host my web site. (they don't pay me to endorse them; I'm just a satisfied customer.)

Many people might think that, instead of learning HTML/CSS and paying 8¢ a month or so for web hosting, you should use another platform — WordPress, Drupal, Tumblr, etc. You may very well decide that you want to do this, and if you do, you will find that this series of workshops has taught you skills that you can transfer to those platforms. It's also true that these platforms offer specific advantages (and disadvantages). But it's also the case that you shouldn't move to these platforms simply because you think that learning web development from scratch is difficult. It's easy, especially for people who already spend a lot of time thinking about text, and you're perfectly capable of doing it.

Each workshop is announced in advance, and I encourage you to bring your laptop and work along. I produce screencasts with audio so that those who cannot attend due to scheduling constraints are able to follow along after the fact. If you have questions, you are absolutely welcome to come to my Co-Lead TA office hours each week, and we'll work through whatever issues you may encounter.

First workshop: Introduction to (X)HTML
12:30 p.m., 11 April 2014
South Hall 1415

This workshop introduces HTML, the markup language used on web pages to indicate the structure of your documents. HTML documents are simply plain-text documents marked up with "tags" to indicate the document's structure. There is a small set of tags (several dozen) that are recognized by HTML parsers (such as web browsers), which you can learn quickly, and which serve the purpose of indicating your document's structure to those parsers. (There are useful HTML references all over the Internet; some are listed here.) HTML code is not (usually) displayed directly to users, but is rendered (interpreted) by the user's web browser. One of our major concerns in this first workshop will be the syntactical rules of HTML, which are not complex, but which should be followed to ensure that the document is understood properly by the user's browser. This workshop also consists of a short explanation of other relevant background concepts.

There are many varieties of HTML, all of which are more or less mutually intelligible to a person who can read any one version — even more substantially, they're all about equally intelligible to web browsers. The version of HTML that I'm teaching in this series of workshops is XHTML Strict 1.0, a version of HTML that allows for it to be processed by XML-aware tools in addition to web browsers. My primary reasons for selecting XHTML 1.0 Strict as the dialect of choice for this workshop series are:

One of my larger-scale arguments about web design throughout this workshop series is that your HTML markup should indicate your document's structure, rather than merely being presentational (people who have attended the workshops have heard me say repeatedly that HTML is not a word processor). Though this argument will not be developed at length until the second and third workshops, it is worth saying at this point that semantic, rather than presentational, markup is definitely a good design practice in most circumstances of the types with which we will be concerned in this workshop series.

Our overall goal for this workshop series will be preparing you to design a small website for your course or section that provides useful information for your students. An important secondary goal in creating this website will be making your teaching practices more visible on the web.

More information about this workshop.

Watch the presentation online

Useful links for this workshop

Available here, and divided into these categories:

Second workshop: Overview of CSS
11:00 a.m., 9 May 2014
South Hall 1415

This workshop introduces CSS, a standard for applying formatting to web pages. CSS is recommendation of the World Wide Web Consortium (w3c), the body that defines Web-related standards, and it is supported by all major browsers available today.

The pages that we produced in our first workshop looked pretty ugly. That's because HTML itself, when properly written according to contemporary standards, doesn't include any information about what a web page looks like — it describes the semantic structure of the text. Information about what the web page should look like is provided by CSS, not HTML. That is to say, using HTML to indicate the semantic structure of your content and CSS to indicate its appearance separates appearance from content. This is a good design principle for several reasons:

Writing CSS involves applying a set of rules to well-formed HTML content. Much of our attention during this workshop will be on how to construct these rules, and what the mechanics of applying them are.

More information about this workshop.

Watch the presentation online

Useful links

Available here, and divided into these categories:

Third workshop: Machines Read, Too (just not well)
11:00 a.m., 30 May 2014
South Hall 1415

During the first two workshops in this series, our focus was on writing web pages in such a way that the information was visible, intelligible, and attractive to humans viewing the web pages. But web pages aren't just viewed by humans; they're also read in various ways by machines. Of course, one of these has been touched on briefly already: HTML files are read by web browsers and rendered to produce the visible web pages that all of us interact with all the time. But there are some other more or less obvious examples of web pages being read by machines that we should consider:

This workshop focuses on how information that's represented in human-readable web pages can be made more machine-readable. We're primarily talking about:

More information about this workshop.

Watch the presentation online

Useful links

Available here, and divided into these categories: