<commit_before>---
layout: slide-deck

title: "Semantics map-out"

slides:
  - type: super-big-text
    content: |
      **Semantics map-out**

  - type: big-text
    content: |
      ## Set up

      1. Form into pairs
      2. [Download the files](https://github.com/acgd-webdev-1/semantics-map-out/archive/master.zip)
      3. Print “content.pdf”
      4. Get out a pencil for marking up the paper

      **Don’t look ahead—the answers are in here!**

  - type: big-text
    content: |
      ## 1 Content elements

      - Heading
      - List
      - Image
      - Paragraph

  - type: image
    image: content.jpg

  - type: big-text
    content: |
      ## 2 Heading elements

      *Each number denotes a sub-heading of the heading above.*

      `<h1>` `<h2>` `<h3>` `<h4>` `<h5>` `<h6>`

  - type: image
    image: headings.jpg

  - type: big-text
    content: |
      ## 3 List elements

      `<ul>` — Unordered list
       └ `<li>` — Each individual item inside

      `<ol>` — Ordered list
      └ `<li>` — Each individual item inside

      `<dl>` — Description list
      └ `<dt>` — The item title
      └ `<dd>` — The item description

  - type: image
    image: lists.jpg

  - type: big-text
    content: |
      ## 4 Image elements

      `<img>`
      — A visual image

      `<figure>`
      — An image with a caption, wraps an image

      `<figcaption>`
      — The descriptive text inside a figure

  - type: image
    image: images.jpg

  - type: big-text
    content: |
      ## 5 Quote elements

      `<q>`
      — Small quotes inside other text

      `<blockquote>`
      — Large, stand-alone quotes

      `<cite>`
      — The source of the quote

  - type: image
    image: quotes.jpg

  - type: big-text
    content: |
      ## 6 Text level elements

      `<em>` — Emphasis

      `<strong>` — Lots of emphasis

      `<b>` — A keyword

      `<i>` — Another language, technical term, title

  - type: image
    image: text-level.jpg

  - type: big-text
    content: |
      ## 7 Link elements

      `<a>` — A clickable hyperlink

  - type: image
    image: links.jpg

  - type: big-text
    content: |
      ## 8 Document elements

      `<header>` — The most important information
      `<nav>` — The navigation for the page
      `<main>` — The primary content
      `<article>` — A chunk of unique content
      `<aside>` — Secondary information
      `<footer>` — The least important information

  - type: image
    image: document.jpg

  - type: big-text
    content: |
      ## 9 Extra elements

      `<data>` — Some numerical, computer information

      `<time>` — A date or time

      `<small>` — Fine print, copyright notice

  - type: image
    image: extra.jpg

---<commit_msg>Fix line breaks in the slide deck<commit_after>---
layout: slide-deck

title: "Semantics map-out"

slides:
  - type: super-big-text
    content: |
      **Semantics map-out**

  - type: big-text
    content: |
      ## Set up

      1. Form into pairs
      2. [Download the files](https://github.com/acgd-webdev-1/semantics-map-out/archive/master.zip)
      3. Print “content.pdf”
      4. Get out a pencil for marking up the paper

      **Don’t look ahead—the answers are in here!**

  - type: big-text
    content: |
      ## 1 Content elements

      - Heading
      - List
      - Image
      - Paragraph

  - type: image
    image: content.jpg

  - type: big-text
    content: |
      ## 2 Heading elements

      *Each number denotes a sub-heading of the heading above.*

      `<h1>` `<h2>` `<h3>` `<h4>` `<h5>` `<h6>`

  - type: image
    image: headings.jpg

  - type: big-text
    content: |
      ## 3 List elements

      `<ul>` — Unordered list
      <br>`  <li>` — Each individual item inside

      `<ol>` — Ordered list
      <br>`  <li>` — Each individual item inside

      `<dl>` — Description list
      <br>`  <dt>` — The item title
      <br>`  <dd>` — The item description

  - type: image
    image: lists.jpg

  - type: big-text
    content: |
      ## 4 Image elements

      `<img>`
      <br>— A visual image

      `<figure>`
      <br>— An image with a caption, wraps an image

      `<figcaption>`
      <br>— The descriptive text inside a figure

  - type: image
    image: images.jpg

  - type: big-text
    content: |
      ## 5 Quote elements

      `<q>` — Small quotes inside other text

      `<blockquote>` — Large, stand-alone quotes

      `<cite>` — The source of the quote

  - type: image
    image: quotes.jpg

  - type: big-text
    content: |
      ## 6 Text level elements

      `<em>` — Emphasis

      `<strong>` — Lots of emphasis

      `<b>` — A keyword

      `<i>` — Another language, technical term, title

  - type: image
    image: text-level.jpg

  - type: big-text
    content: |
      ## 7 Link elements

      `<a>` — A clickable hyperlink

  - type: image
    image: links.jpg

  - type: big-text
    content: |
      ## 8 Document elements

      `<header>` — The most important information
      <br>`<nav>` — The navigation for the page
      <br>`<main>` — The primary content
      <br>`<article>` — A chunk of unique content
      <br>`<aside>` — Secondary information
      <br>`<footer>` — The least important information

  - type: image
    image: document.jpg

  - type: big-text
    content: |
      ## 9 Extra elements

      `<data>` — Some numerical, computer information

      `<time>` — A date or time

      `<small>` — Fine print, copyright notice

  - type: image
    image: extra.jpg

---
{'fraction_non_alphanumeric': 0.1282936580047247, 'fraction_numerical': 0.007268762493185535, 'mean_word_length': 1.9783549783549783, 'pattern_counts': {'":': 0, '<': 81, '<?xml version=': 0, '>': 81, 'https://': 2, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 2, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '5279539', 'n_tokens_mistral': 1939, 'n_tokens_neox': 1739, 'n_words': 630}