assignments
due Fri Sep 22
one: getting started
- Don't Panic.
- First of all, manage your time wisely - you're going to get out of this what you put in, eh?
- Each assignment will consist of a number of things to read (or browse), and some written things to "hand in" by submitting or linking to on the course website.
- Your grade for each assignment will be comments like "OK, looks fine" or comments as to why it wasn't sufficient. I'm looking for evidence of a reasonable understanding and effort.
- Write down questions and notes as the occur to you - words you don't know, topics you want to explore, etc - and post them in your response to this week's assignment.
- Depending on your expertise and background you may want to either (a) find more background material, or (b) skim parts you already know. Use your own judgement.
- Reading
- Read http://en.wikipedia.org/wiki/Web_design. Browse some of the links.
- Browse the links on the course resources page.
- Read Part 1, "The Web Environment" in "Web Design in a Nutshell 3rd Ed", pgs 1-85
- Read Part 1, "Houston, We Have A Problem" in "designing with web standards, 2nd ed", pgs 1-140.
- Next class, in two weeks, we'll be looking at XHTML and CSS in more detail, so if time allows, start reading that stuff :
- chap 5, 6, 9 in "designing with web standards"
- chap 7, 8, 16, 17
- (glance at) appendices in "Web Design in a Nutshell"
- Writing
- Get Firefox, its web developer plug-in, and a texteditor that does HTML syntax highlighting. Start playing around with 'em. (See the resources page.)
- Create a short one-page website on a topic of your choice, with at least one image in it. Put it online somewhere.
- Ask and/or answer a question on the course Q and A page.
- On the course page where you submit this week's work, tell me
- what your computer background is,
- the URL of your "short one-page website", and
- how all the work described above is going.
due Fri Oct 6
two: XHTML and CSS part 1
- Reading:
- Within the next four weeks you should get through the bulk of XHTML and CSS as described in our Nutshell text (chap 7 - 25) and/or Zeldman's book (chap 5 - 14). I found that I could pretty much read straight through Zeldman; he's fairly "talky"; however, I found it more useful to skip around in Nutshell and skim parts of it.
- Continue to browse (and contribute to) the links on the resources page as you explore these topics.
- Creating:
- Your mission for the next four weeks is to design and create a fairly realistic collection of web pages that illustrate the XHTML and CSS that we're looking at. First, choose some chuck of information that you're going to work with - I suggest something you actually care about. Then start your design process : look for other similar sites, think about what sort of navigation and look you want, browse the open source layouts, and put together at least two stylistically different tentative skeletons of what you'll polish up later. (This might be as little as a page or two of .html together with several different style sheets.)
- When you submit this work, give me not only the your files (*.html, *.css, *.jpg, ...) but also a discussion of the process you've gone through, what decsisions you've made and why, and how your design stacks up against the 'good' and 'bad' practices we've discussed.
- Then for the following assignment you'll be polishing at least one of these styles up, testing across different browsers, and fleshing it out with content and navigation, all of which will be a sort of mid-semester mini-project.
- Interacting
- Continue to check into the course wiki chat and questions page to get feedback from and help out the others in the class.
due Fri Oct 20
three: XHTML and CSS part 2
- Finish exploring all our various readings, tutorials, sites, and articles on CSS and design
- Finish work on your mid-term project. I'm going to grade this one with a letter grade; give it your best shot. Your submission should be a folder (or archive) that contains
- a home page (*.html)
- at least one style sheet for it (*.css)
- all required images (I want to be able to peruse your submission offline)
- some 'interior' pages (at least two)
- a .txt, .html, or .pdf document describing the whole project : what you did, why you made the design choices you did, any difficulties and/or obstacles, future plans, what you do like, what you don't like, and so on.
- You may base your project on other people's designs; if so, clearly cite your sources and follow their copyright rules. Make it clear what's your own work, and what isn't.
- grading criteria will include
- Can I tell from this that you understand the material?
- Can I understand what you did and read your code?
- Does it look like the right amount of work for a 4 credit class mid-term?
- Is this valid XHTML and CSS that follows the rules?
- Is it legible, handicapped accessible, and easy to navigate?
- Does it work across browsers / sizes ?
- How does it stack up against the list of design issues we did in class?
- Next time we'll look at these projects in class, so be ready to discuss yours.
- We'll also start JavaScript
due Fri Nov 3
four: JavaScript and DOM part 1
- Reading
- Read the chapters in 'Nutshell' on JavaScript and the DOM, 26 and 27
- Read the following pages online (and follow any links that look interesting):
- Browse
- Writing
- Since my impression is that many of you have quite different skill levels as programmers, I'm not going to give a one-size-fits all explicit set of programming tasks.
- Instead, I want you each to submit three (3) JavaScript 'programs' (e.g. web pages + JavaScript) that do three different things. Pick some tasks appropriate to your background level and skill.
- If you've done a lot of programming, then it's fine to pick programs you've written in other languages and play with what they'd look like in JavaScript.
- If you're programming is rusty, then pick just pick some examples from some of the tutorials, and change them to do something similar. Please don't turn in something that's exactly the same as something you got online - the point is to learn how to write this code. But as always, it's OK to look at and adapt (consistent with their copyright) other people's stuff. Be sure to cite your sources, as always.
- Your goal this week is to explore JavaScript and write some programs, without worrying too much yet about what's practical or useful in real web pages.
- Please do come to class next time ready to share your 3 examples to the rest of the class; since we'll all be working on various different sorts of things, I think it'll be helpful to see the range of what's possible.
due Fri Nov 17
five: JavaScript part 2 : practice and AJAX
- Reading
- Continue studying JavaScript through the various links on the resources page.
- Read at least some of the materials on AJAX. (Recommendations coming.) I'm planning on showing some examples and talking about those techniques next time.
- Writing
- Submit at least one fairly practical example of JavaScript in a real website. This should be your own code, not just an adaption of someone else's. You can be inspired by an example, but the programming should be mostly yours. This may be an AJAX example if you wish and if your skills are up to it.
- Work on your final project: a polished version of your midterm including some sort of dynamic or interactive component. At least part of it must run in the client using the JavaScript materials we've been studying. If you have any questions about what's appropriate, ask.
due Fri Dec 8
six: Final Projects
- Present in class a polished spiffy website (multiple pages with navigation) that includes xhtml, css, and JavaScript - the whole nine yards.
- By Sunday night upload an archive (.tar.gz, .zip, .rar, ...) of your project, with all files, such that after being unpacked it works as is.
- The final project should have some javascript which is at least in part your own work. Adapting other people's code is fine as long as (a) their copyright allows and (b) you cite your sources.
- Grading will be much the same as the midterm project, with the addition of 'technial merit' and 'usability' for the dynamic javascript material.
final grade