Patrick Mooney, Co-Lead TA, Department of English
Office Hours this winter (for TAs): Thursdays 1:00–2:00 at Nicoletti's (and by appointment) .
Email: patrickmooney AT umail DOT ucsb DOT edu
Voicemail: (805) 272-0069
This workshop introduces CSS, a standard for applying formatting to web pages. CSS is a 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 approach to design 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.
If possible, you should install Firefox and a good plain-text editor (I use and recommend Bluefish) before you come to the workshops … but don't let installation woes or lack of time keep you from attending! You may also want to install an FTP client before coming to the workshop. More detailed software information can be found here.
Homework (which you can adapt in scope to your own schedule): As I said in the first workshop, you won't actually be learning these skills unless you practice them. My recommendation is that you produce an HTML version of your current section guidelines handout and any other documents that you may have the time and inclination to convert. I also recommend that your markup be semantic rather than presentational, and we'll talk in some detail during this second workshop about why I recommend this. (If you need more information about what I mean when I say this, you might want to watch the screencast or view the slideshow from the first workshop.)
You may also want to sign up for web hosting with a company that offers inexpensive hosting services. (I use and recommend NearlyFreeSpeech.net — they don't pay me to endorse them; I'm just a satisfied customer. I might also mention that hosting my personal website on their server costs me, on average, a little under 8¢/month, despite the fact that I constantly send students to it for one reason or another.) However, this is also something that you can defer until you're ready to actually put your web site on the web.
Feel free to peruse any of the links in the sections outlined below. You may find, if you are pressed for time (and who among us isn't?), that a good set of quick background reading would be Anatomy of a CSS Style 101 and the blogger's follow-up post CSS Selectors; Clean Up Your Mess; and, for those who are social-networking aware, Sweep the Sleaze. However, I believe that you will still benefit from attending the workshop if you don't have time to do any background reading.
Even more useful: Look at a number of websites, paying particular attention to the physical appearance of the sites — and think about design-based issues: what do you like about this site? about this page? what do you dislike about it? is information easy to find? is text easily readable? is the design aesthetically pleasing? why or why not? More useful yet: look at the same websites on a mobile browser (phone, tablet) and see how they look on those platforms in addition to looking at them on a large screen.
Most useful (to me, anyway): Tell me what I need to do next time I give my site a makeover.
Available here, and divided into these categories: