HTML

Up until now, we’ve been returning plain text responses back to the web browser. But we want to have more flexibility to structure and style our content, so we should return HTML and CSS.

HTML (HyperText Markup Language) is the most basic building block of the Web. It defines the meaning and structure of web content. Other technologies besides HTML are generally used to describe a web page’s appearance/presentation (CSS) or functionality/behavior (JavaScript). https://developer.mozilla.org/en-US/docs/Web/HTML

HTML uses markup to structure text and other content to tell web browsers how to display it. This markup consists of a set of elements that browsers understand. Browsers differentiate elements from normal text with tags, which consist of the element name surrounded by angle brackets - “<” and “>”. Elements can include attributes which allow you to provide additional information that an element might need to display properly.

Here are some common elements:

  • <a> - anchor, or hyperlink. This is how we specify a link to another page.
  • <h1> - heading. We can specify headings to break our content into sections. h1 is the most important heading, but we can go down to h6 for subsections / less important headings.
  • <img> - image. We can put images within our webpage using the img tag. Usually we also supply an src attribute to this tag to tell it where the image is located.
  • <p> - paragraph. We can group blocks of text using the paragraph tag. Browsers add a single blank line before and after each paragraph.
  • <small> - small text. Used to display things like copyright info or side-comments.

We aren’t going to go into detail about HTML in this workshop, but it is something that you should definitely learn more about if you are interested in developing web applications. Here are a couple of good starting resources: