“Making Websites from Scratch” Class Materials
Zoom recordings, chat transcripts, and presentation slides from "Making Websites from Scratch" with Dr. Bryan Tarpley will be uploaded here by the Monday after each Friday class.
These materials will be available until August 1, 2024.
Week 1, February 9: "HTML: A Genealogy of Nodes"
Timestamps Pt. 1:
00:00 Introduction
03:20 Why should we, as humanists, use HTML at all?
06:20 HTML (Google Slides)
14:20 How to create a Repository on GitHub
22:50 Introduction to Visual Studio Code
26:20 Troubleshooting: how to install Git on your computer
37:00 How to create an HTML file in Visual Studio Code
45:00 How to add text to an HTML document
46:30 Shortcut: how to change indentation levels in a document
48:15 How to save your document
Timestamps Pt. 2:
00:00 How to open your HTML file as a webpage
03:00 How to use the <head> tag
05:50 How to use the <title> tag
08:40 How to use the <body> tag
09:45 Shortcut: how to select a block of text
10:40 Reviewing the genealogy of nodes
14:00 How to use the <h> tags
19:20 Adding visual interest to text with images
20:20 Ethics of creating and using AI art
26:30 How to use the <img> tag and src attribute
31:05 File paths
32:00 How to change the size of an image on your webpage
35:55 How to add alt-text to an image
39:10 How to make another webpage
41:30 How to use the <b> tag
42:40 How to use the <p> and <br> tags
45:45 How to use the <i> tag
46:15 How to use the <a> tag and href attribute
49:05 HTML cheat sheets
50:50 How to Commit + Push code changes to GitHub from Visual Studio Code
54:00 How to see your website
Week 2, February 16: "CSS: Stylin' and Profilin'"
Timestamps Pt. 1:
00:00 Introduction
01:25 HTML Comments
04:30 HTML Lists
11:45 Review from last week: Commit + Push from Visual Studio Code
14:25 Alternate method of uploading files to GitHub
18:15 How to create a Directory in GitHub
20:35 How to see your public-facing website
24:30 Troubleshooting: commits are lagging
27:35 CSS (Google Slides)
46:00 How to write a Style Guide in Visual Studio Code
Timestamps Pt. 2:
00:00 How to center your content
02:35 How to use developer tools in your browser
20:30 How to use the id (#) attribute
24:05 How to use the class (.) attribute
28:30 How to center a bulleted list
33:50 How to add a background color
39:40 How to use border-radius and -padding properties
43:10 How (and why) to make a separate style.css file
49:30 Troubleshooting: style.css files
Week 3, February 23: "JavaScript: Vita Ex Machina"
Timestamps Pt. 1:
00:00 Introduction
02:00 Reorganizing file structure in Visual Studio Code
04:30 How to use the max-width attribute
12:35 How to add a hanging indent
15:10 How to add footnotes
22:30 How to style footnotes
35:00 How to add private comments to your code
37:00 How to add a menu to your website
48:10 How to style your menu to be horizontal (inline)
Timestamps Pt. 2:
00:00 Troubleshooting: horizontal (inline) menu
01:15 How to style a vertical sub-menu
11:40 How to create a dropdown menu
14:30 How to add a hover color to your dropdown menu
18:15 JavaScript (Google Slides)
24:40 How to restyle your menu with JavaScript
33:40 Troubleshooting: JavaScript not updating
40:20 How to make your menu style consistent across your site
54:10 Reminder: office hours for technical assistance
55:10 Preview of next (and final) class
Week 4, March 1: "Deployment: Release the Kraken!"
Timestamps Pt. 1:
00:00 Introduction
03:35 Reclaim Hosting
07:00 Finding and purchasing a domain name
25:40 How to deploy your website (Git Version Control)
48:40 Troubleshooting: cannot view your live site
52:20 How to deploy your site without Git
Timestamps Pt. 2:
00:00 Troubleshooting requests
01:10 "Can I use languages other than English on my website?"
22:20 "Can I make my static (HTML) site interactive?"
32:35 "Can I track traffic on my site?"
38:20 CoDHR and P4H plug
42:50 Information about a course survey