teaching machines

CS 268: Lecture 12 – Forms and Web Services

March 12, 2020 by

Dear students: Last time we started looking at how JavaScript brings actions into normally sedate HTML. We used it to dynamically generate an HTML structure. Today we look at using JavaScript to deal with form input. We’ll also use it to get content from external sources. In particular, we’ll generate a web application for consuming […]

CS 268: Lecture 11 – Media Queries and JavaScript

March 10, 2020 by

Dear students: Last week we started making our web pages sensitive to their presentation environment using media queries. We continue that discussion today and formally break into a discussion of Javascript. Media Queries We saw last time the mechanism for expressing conditional CSS via media queries. A primary use of media queries is to support […]

CS 268: Project 1 Rubric

by

Your project 1 submission will be graded using the rubric below. Your site will be evaluated on five dimensions. For each dimension, I list a sample of the questions that I will use to structure my evaluation. Content Is the content original, not placeholder text or copy lifted from elsewhere? Does the site incorporate a […]

CS 268: Lecture 9 – Position Continued

March 3, 2020 by

Dear students: Last time we started exploring the position property of CSS. We examined relative positioning only, but we didn’t see a compelling use case for why we’d want anything but static positioning. I hope to address that today by looking at fixed and absolute positioning, which can be used to achieve useful layout effects. […]

CS 268: Lecture 10 – Absolute Positioning and Media Queries

by

Dear students: Today we’ll look at how we can use absolute positioning to achieve dropdown menus and then take our first steps into the world of responsive web design. Absolute Position We saw last time that an element with an absolute position is anchored against the box of its nearest non-static ancestor. This kind of […]

CS 268: Lecture 8 – Position

February 27, 2020 by

Dear students: Prior to 1998, CSS was mostly a vehicle for factoring the coloring, sizing, and alignment attributes out of HTML into a reusable stylesheet. But in 1998, CSS gained a new property: position. This opened the door to thinking of CSS as a tool for layout. Eventually we got robust layout systems like Flexbox […]

CS 268: Lecture 7 – Flexbox Continued

February 25, 2020 by

Dear students: Last week we saw how we can use Flexbox to size and distribute our boxes of content across a container. Today we continue to explore Flexbox and see how to recreate some common layouts found across the web. But first, let’s review Flexbox by completing an exercise. Flexbox Last time we looked at […]

CS 268: Lecture 6 – Project Workflow

February 20, 2020 by

Dear students: We saw last time how we can use Flexbox to size and distribute our boxes of content across a container. We have a few more things to say about Flexbox, but we will postpone the new stuff till next time. Instead, we’ll discuss a workflow for developing a website and getting it served […]

CS 268: Lecture 5 – Flexbox

February 18, 2020 by

Dear students: Last time we explored the box model that guides our browser’s rendering algorithm. Today we examine the relatively modern Flexible Box system for CSS, which can be used to automatically set the properties of our boxes to achieve many of our standard layouts. But first, let’s review the box model by completing an […]

CS 268: Lecture 4 – Boxes

February 13, 2020 by

Dear students: At the heart of our browser’s rendering algorithm is the CSS box model. Today we explore this in some detail. By the end, we should be able to make a page that looks like this: Box Model When the browser renders an element from your HTML file, two things it must determine are […]

1 2

Past Posts

Categories