> For the complete documentation index, see [llms.txt](https://docs.launchboard.app/cxd/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.launchboard.app/cxd/intro-to-informatics-and-web-development/1-2-basic-html.md).

# 1-2 Basic HTML

![](https://3718926237-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LDgX-RgU994GjN7nvcR%2F-LDgX6N0pHKbYL1KWUWR%2F-LDgX6nMEaudN-nzydV1%2FScreen%20Shot%202017-07-19%20at%2010.47.10%20AM.png?generation=1527608038804302\&alt=media)

![](https://3718926237-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LDgX-RgU994GjN7nvcR%2F-LDgX6N0pHKbYL1KWUWR%2F-LDgX6nOq-f4nd72G6ST%2FScreen%20Shot%202017-07-19%20at%2010.54.21%20AM.png?generation=1527608017440311\&alt=media)

## HTML Syntax - used for elements of a website

**Syntax** is the grammatical rules and structural patterns governing the ordered use of appropriate words and symbols for issuing commands, writing code, etc., in a particular software application or programming language

To add a paragraph to a website you would type this:

![](https://3718926237-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LDgX-RgU994GjN7nvcR%2F-LDgX6N0pHKbYL1KWUWR%2F-LDgX6nT2fsff7c16nHw%2FSample%20Paragraph%20Syntax.png?generation=1527608017405755\&alt=media)

## Common HTML Tags

```
<h1>, <h2>, <h3>...<h6> - headings in different sizes (h1 is the largest)
<p> - paragraph
<img> - image
<div> - division of a page
<br> - line break
<a> - hyperlink
```

[Complete list of tags](https://www.w3schools.com/tags/default.asp)

## Setting up a Basic HTML Page

![](https://3718926237-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LDgX-RgU994GjN7nvcR%2F-LDgX6N0pHKbYL1KWUWR%2F-LDgX6nXXeZpP0285VgO%2FBasic%20Website%20HTML%20Labeled.png?generation=1527608046649310\&alt=media)

## Assignment

### Standard Deliverable:

What do you think has been the most important development in technology? Identify a technology that has been important, person or company that invented it, and why you think it’s important. Your paragraph should be 3-4 sentences. Also include your name. Create a basic webpage using HTML. Use <http://codepen.io> to create this page and submit a link to your ‘codepen’ for the assignment. Name your codepen file “History of Computers”

**Required Elements:**

1\) A Large Heading for your technology (h1)

2\) A Smaller Heading for name of inventor or company (h2)

3\) A Smaller Heading for your name (h3)

4\) A paragraph about why you think the technology is important (p)

### Advanced Deliverable:

1\) Add an image to your site using the `<img>` HTML element.

2\) Add italics and bold to something on your website. (Hint: search emphasis for italics)

Use Google search and <https://w3schools.com> as a primary reference to complete this activity as needed.

## Code Review Exercises:

1\) HTML Basics - [Write a Poem](https://www.khanacademy.org/computing/computer-programming/html-css/intro-to-html/p/challenge-write-a-poem)

2\) Bold/Italics - [You Can Learn Text Tags](https://www.khanacademy.org/computing/computer-programming/html-css/intro-to-html/p/challenge-you-can-learn-text-tags)

3\) Lists - [Your Learning List](https://www.khanacademy.org/computing/computer-programming/html-css/intro-to-html/p/challenge-your-learning-list)

4\) Images - [A Picture-Perfect Trip](https://www.khanacademy.org/computing/computer-programming/html-css/intro-to-html/p/challenge-a-picture-perfect-trip)

5\) Links - [Links You Love](https://www.khanacademy.org/computing/computer-programming/html-css/html-tags-continued/p/challenge-links-you-love)


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation by asking a question.

Perform an HTTP GET request on the following URL with the `ask` and `goal` query parameters:

```
GET https://docs.launchboard.app/cxd/intro-to-informatics-and-web-development/1-2-basic-html.md?ask=<question>&goal=<user_goal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is what the user is ultimately trying to achieve, the reason they need the answer. Sharing it helps GitBook give you a better, more relevant answer. A goal is most helpful when it describes the outcome the user wants rather than restating the question. For example, with `ask=how do I create an API token`, a goal like `automate deployments from our CI pipeline` lets GitBook tailor the answer to that use case.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
