Skip to content

HTML, CSS, JS

HTML belongs in .html files. CSS belongs in .css files. JS belongs in .js files.

This might seem laughable at first glance, but it's easy to forget.

Which is why I write about it all the time.

More importantly, HTML, CSS, and JS create a wonderful MVC pattern for front-end web development.

  • HTML is the model, it contains the data.
  • CSS is the view, it contains the styles.
  • JS is the controller, it contains the interactions.

This MVC structure makes for a powerful delegation of responsibility. When you want to change the state of a widget on a page, you can use JavaScript to change the available styling hooks. Hooks are generally from attributes such as classes, or [data-*] attributes. If you're using jQuery, the data method can be used to access hooks to create widgets using unobtrusive JavaScript.

This is another topic I write about all the time.

Seriously.

A lot.