CIS195 Web Authoring 1: HTML

Week 1, Session 2

Course topics by week
1. Intro to HTML	6. Page Layout with CSS
2. More on Creating Web Pages	7. HTML Tables
3. Developing a Web Site	8. HTML Forms
4. Design with CSS	9. Multimedia
5. Midterm	10. Term Project

Intro

Review due dates and what you need to do this week.
- Quiz 1
- Lab 1
Review the weekly learning cycle shown in the Moodle side-bar.

Review

HTML “boiler plate”


xxxxxxxxxx
<!DOCTYPE html> 
<html lang="en">
   <head>
      <meta charset="UTF-8">
      <title>Some Title</title>
   </head>
   <body> 
   </body>
</html>

HTML elements
- What is a tag?
- What is an element?

Visual Studio Code

Install VS Code Instructions are here: Setting up Visual Studio Code
Create an HTML file
- Create a new file, then rename it with the html extension.
- Add the HTML "boiler plate".

More about HTML Tags and Elements

HTML element attributes
- Pattern: <element attribute1=”value1” attribute2=”value2” ...>
- Example: <meta charset="UTF-8">
- The two parts of the attribute form a "key-value pair"
One-sided or "self-closing" tags
-  
- <img src="kitten.png" alt="A very cute kitten">

More HTML Elements

Here are some elements that we haven’t covered yet:

Paragraph:  some text 
strong (bold): some text
emphasis (italics): <emphasis>some text</emphasis>
image: <img alt="description" src="photo.jpg">
Put the image file in the same folder with the html file.
Link: <a href="http://lanecc.edu">Lane Community College</a>
Ordered list:


xxxxxxxxxx
    <ol>
      <li>First item</li>
      <li>Second item</li>
    </ol>

Unordered list:


xxxxxxxxxx
    <ul>
      <li>First item</li>
      <li>Second item</li>
    </ul>

Lab Assignment

The lab 1 instructions are posted in the week 1 section on Moodle.

Web Authoring Lecture Notes by Brian Bird 2018, revised 2022, are licensed under a Creative Commons Attribution-ShareAlike 4.0 International License.