Midterm Reflections and Intro to Markup

Work to have done:

  • Your final-for-now Visual Rhetorical Collage and Reflection
  • Download and install the Atom text editor

Plan for the day:

  1. Midterm reflection (5-10 min)
  2. Web-design unit overview and assignment (10 min)
  3. Markup: separating content from display (10-15 min)
  4. “Web Design in 4 Minutes”… in 15 minutes
  5. Homework preview

Midterm reflection (5-10 min)

Welcome to the second half of the semester!

Over the weekend, you wrote a reflection on your visual-rhetorical project; now, take a few minutes to write a broader reflection on the semester as a whole. Given your goals and expectations when you began this class, what have you begun to learn, and what, especially, haven't you begun to learn? What skills do you want to have practiced before the semester is over? Can you think of any projects you might compose over the next month or so that would help you get that practice?

Take 5-10 minutes. I won’t collect these directly, but you will use them to develop your pitch for a collaborative project, and as a snapshot of your progress to look back on in a final reflection for the end of the course.

2. Web-design unit overview and assignment (10 min)

As I explained in the syllabus, your third project is to build a responsive website using basic html and css files — as opposed to a site manager like WordPress or Wix — along with any media assets you wish to embed. In assigning this, I have two main goals for you:

  1. to learn how to manage a composite project made up of multiple interlinking files, and
  2. to explore the affordances of the web design stack as a medium, and especially its ability to flexibly render content for multiple audiences or reading priorities.
To read the full assignment – and make a copy for yourself – go to https://classroom.github.com/a/Ntqfh-3_.

Let’s read through this together.

3. Markup: separating content from display (10-15 min)

HTML = HyperText Markup Language CSS = Cascading Style Sheets

What does that mean??

Here’s a nice introduction.

Let’s look at what that separation allows. Come with me to the CSS Zen Garden.

4. “Web Design in 4 Minutes”… in 15 minutes

Because time-in-class is short, and because we have a wide range of web design experience among us, I’m going to accelerate past the beginning for a moment. In the process, we’ll see examples of some of the essential things you can do with CSS – but we’ll skip over the breadth of information you’d need to build something like this from scratch. My hope is that, having been to the top of the mountain, you’ll have a better sense of why it’s worth trekking across the desert of the tutorials to get back up there on your own two feet typing hands.

I expect this will take a bit more than four minutes, because I fully plan to interject, and I hope you will, too. But that’s really what this is called: http://jgthms.com/web-design-in-4-minutes

Homework for Next Time

  • Do as much of the Interneting is Hard (but it doesn’t have to be) tutorial as you can – at least parts 1-4 (from “Introduction” through “Hello, CSS”)
  • Show your work by pushing your tutorial code to a repository
    • I’ve already created folders for parts 1-3 in the GH repo you just forked; clone it to your local computer, and you should be able to work in those folders and push.
  • Bring headphones for sonic isolation: we’ll have studio time next class.