Front End Development: Introduction to HTML

Front End Development: Introduction to HTML

by Michael Kendall

​Today's Agenda:

​- Objective

​- Do-Now

​-What is HTML?

​- HTML Tags and Syntax

​- Putting it all together

​-Front-End / Back-End Exit Ticket

​Objective:

​Upon successful completion of this lesson, SWBAT:

• - Write a simple web page using HTML.

• - Be able to explain how HTTP is used to send HTML documents across the internet.

Open Ended

In your own words, explain the difference between front-end and back-end development. 

​What is HTML?

• - HTML stands for Hyper Text Markup Language

• - HTML is the standard markup language for creating Web pages

• - HTML describes the structure of a Web page

• - HTML consists of a series of elements

• - HTML elements tell the browser how to display the content

• -HTML elements label pieces of content such as "this is a heading", "this is a paragraph", "this is a link", etc.

​What does HTML look like?

​<!DOCTYPE html>

<html>

<head><title>Page Title</title>

</head>

​

<body>

<h1>My First Heading</h1>

<p>My first paragraph.</p>

</body><

/html>

​HTML Tags:

​<opening> </closing>

​

​Together they make an HTML element.

​What is an HTML Element?

​-An HTML element is defined by a start tag, some content, and an end tag:

​

<tagname>Content goes here...</tagname>

​

-The HTML element is everything from the start tag to the end tag:

​

<h1>My First Heading</h1>

<p>My first paragraph.</p>

HTML Practice, please go to repl.it and open a new repl​.