Skip to content

Workshop (web edition)

Texts to have read:

Work to have done:

  • Post a draft, however sketchy, of your own project pitch, rendered in html
  • Publish it using GitHub Pages

Mea culpa (5 min)

I forgot to ask you guys to actually post a link to your draft websites. So if I'm following you on GitHub, or a collaborator on this particular repository, I can see it; but it would be more helpful, I suspect, if you could see each other's. This will be even more crucial next week, of course.

I've apparently been of two minds on where to post these links: if you check the calendar, I say to post on WordPress (presumably in the "projects" category); if you check the assignment, it says to post on a GH issue queue.

Can I just check with you all about where you'd prefer to find these links?

And now that we've settled that, can you post your links there now, while we're thinking about it?

Unit 3 Criteria, revisited (10 min)

As in past units, I've combed through the rest of the suggestions and streamlined them into the proposed criteria for us to approve or amend today.

Executive summary of changes:

  • I clarified three existing bullets in the content/technical layer, hopefully matching the existing intent, including a proposal to consolidate two bullets
  • I brought back four basic bullets from the last reflection that we'd missed
  • I pulled in a baseline criterion that your website be reachable through GitHub Pages (maybe hosting elsewhere could be aspirational?)
  • I pulled in four aspirational criteria from the groups

Workshop strategy (2 min)

As in past units, we'll want to describe what we notice, evaluate with regard to the criteria, and suggest concrete possibilities for improvement.

To make it as relevant to the full class as possible, I want to focus mainly on the technical side: how the html is working to semantically define the content, and how the css is working to render it.

Note, though, that our discussion of css can and should include how the visuals guide attention, and how the text of the pitch is transformed by revising into this other medium of markup. #continuity

Let's begin!

Workshop (30 min)

  1. Gabi
  2. Annie

Reflection (3-5 min)

Before heading into studio time, take a few minutes to write: realistically speaking, what are your personal aspirations with this website? Do you think anything needs to be altered from our baseline criteria?

If you have changes, please share them as comments on that google doc, or start an email thread with all of us (you can reply-all to one of my emails to you), to make sure we can all see it.

Studio (20ish min)

Use the remaining class time to get moving on your project, aiming to make at least one new commit before you leave.

I'll float.

Homework for next time (3-5 min)


  • Find and read or watch any tutorials or materials you need to achieve your web design goals. Use the resources page as well as your own search engines or Lynda.
  • Cite while you're downloading: don't trust that you'll be able to find your source materials again if you don't. Save time and energy and copy out the specific URL – for the page that includes the CC license, if applicable.
  • EXT: I'd planned to ask you to revisit Karl Stolley's "Lo-Fi" manifesto, especially section four: "Design first for the most constrained users and devices." But I don't want to overburden those for whom the upcoming deadlines will be tight.


  • Continue to refine your pitch and update your website.
  • Make at least one git commit per working session, with a message about what you changed; push your changes to GitHub.
    • One word of warning: GitHub pages can be slow to update (e.g. a few minutes instead of a few seconds). It's easier to work with local files, so you can instantly see the changes in your browser when you update the css or html.


  • If you haven't yet, sign up for a midterm conference with Ben over the next two weeks (absolute latest deadline: 11/9)
  • Come in ready to ask questions of your groupmates, and/or to share with them a CSS trick / semantic html resource that you found helpful.