Categorizing the elements of the modern web

In the world of the web, what is a web app and what is a website is now often blended. It’s not as simple as written content is a website, and an interactive tool is a web app. Blogs can be interactive, they can provide tools, live searching, etc.

This is a high level overview of what fits where, of which rules apply to what elements. It’s mainly for myself to help me develop tools.

Content vs its Vehicle

Content

  • Navigation (Primary, Sidebar, etc)
  • Markdown
  • Images
  • Video

Site or App itself

  • CSS
  • JavaScript
  • Components
  • Icons

Mutable vs Immutable

Mutable Entities

  • Blog posts
  • Page content
  • Tag assignments
  • Editable Markdown
  • Editable components
  • Sessions
  • Git Repositories
  • Figma documents
  • Trello boards
  • Google docs / spreadsheets

Immutable Values

  • Images
  • Text snippets
  • Tags
  • Timestamps
  • Git Commits
  • Git Trees

Derivable Values

  • Resized and encoded images
  • Minified CSS or JavaScript
  • Rendered Markdown
  • Published components’ code
  • Rendered components
  • Cryptographic hashes