HTML notes (messy)

Notion tags
table of contents

resource links

subpages

html forms

HTML notes (july)

terminology

element
tag
attribute
value

general

each element’s id needs to be unique within that web page/html document, and any kind of element can have an id (afaik?)
- even when you’re using id to directly associate one element with another, like associating a label with an input, they still can’t share the same id! one of them is always gonna use a separate attribute like for to reference the id of the other.
- can different pages on the same site have the same id? i’m sure it’s not recommended, and it would mean that like, css properties defined by id would affect all pages where that id appears
  - (re: the css, if you WANTED that behavior, then the correct method is probably to use a css class instead)
an empty div has no height or width, which is why it’s basically invisible—how should the browser know how big to make it?? it’ll show up when you either specify height and width, or put any content inside the div, in which case it makes the div whatever dimensions are needed to hold the content

code style

freecodecamp recommends using a 2-space indentation for nested elements
values of attributes should always be enclosed in quotes. it sounds like maybe some (e.g. type=text for input) would still work without the quotes, but they’re just recommended to always be included? anyway it sounds like at the very least you can’t go WRONG with always including them.
attributes can be listed in any order, but it feels like good practice that if id is one of them, it should always go first (that’s just me making that up though lol)

head

the stuff that doesn’t get displayed on the page.

common tags:
a meta element can maybe only have one attribute? like, you need to add two separate meta elements to declare charset in one and viewport in the other
- well, in that case it’s because viewport doesn’t have its own unique attribute; it only uses name and content which are like generic multipurpose attributes. anything that uses name and content probably needs to be in a meta tag by itself.

semantic elements

<html>
  <head></head>
  <body>
    <header>
      <h1></h1>
      <nav></nav>
    </header>
    <main>
      <section>
        <article></article>
      </section>
    </main>
    <footer></footer>
  </body>
</html>

a page should have only one h1, for the title of the page