WEEK 2: HTML Building Blocks (January 25-29)

To Do This Week:

FreeCodeCamp: Basic HTML and HTML5


Video Lecture:

I have tried to edit out references to the previous semester in my talks. Please disregard these, especially when I talk about Codeacademy, when we have switched to the FreeCodeCamp tutorials. I will let you know what is due and when on the module pages in and in the class Slack channel.

 


Zoom Class:

Because I am asking you to view a lot of prerecorded video this week – this is all to get you started – the class time this Tuesday evening will be optional and the focus on the session will be helping you write the html and going over how to save files properly. 

General Help Session: HTML Syntax, Formatting, naming Files, folder structure.


Notes:

html reference: w3schools

The first website, Tim Berners-Lee

World Wide Web Fundamentals:

Domain Name / IP (internet protocol) Address
Files/Directories
Local/Remote Files (case sensitive)
URLs (uniform resource locator)
HTTP (hypertext transfer protocol)
FTP (file transfer protocol)
Servers / Clients (browsers)

Hypertext Markup Language / HTML:

HTML – evolution, tags/elements, backward compatibility, spaces
text-editors, color coding, line numbers, soft wrap, search
basic structure –  anatomy of a web page
nesting, parents/children
text-encoding – ASCII / Unicode
entity codes | &   —   
intro to semantic elements – h1, p, div, em, span, small
inline/block
attributes – id, class, style
absolute and relative urls
basic formatting – classes and ids
html syntax= <element attribute=”value”></element>
self-closing elements= <element>

Project #1: Blackbird Project (10%)

Format and style Wallace Steven’s poem “Thirteen Ways of Looking at a Blackbird” in a one page HTML document with an external CSS stylesheet. Your pages must have at least the following :

  1. one external link
  2. one internal or anchor link
  3. one image insert
  4. one background image

The assignment will be graded based on the functional and proper uses and syntax of HTML mark-up and CSS styles.  Though I am not grading on the quality of your design and layout, please put some effort into a pleasing look.  Extra credit will be given if your design attempts to reflect an interpretation of the poem’s meaning!

Previous Blackbird Projects

Blackbird Example (zip)