9 Essential Terms You Should Know If You’re New to Front-end Development

HTML: Hypertext Markup Language

  1. Semantic Element: This code has meaning to both the developer and browser. Some examples are <table> and <article>. Whereas examples of non-semantic elements are <span> and <div>.
  2. Structural Element: This code forms the basic building blocks of any webpage by providing structure. Examples include <h1>, <body>, and <blockquote>.
  3. Meta Elements: These elements provide information to the browser about your website. For example, you should use metatags (<meta>) to describe the contents of a webpage for search engine optimization.

CSS: Cascading Style Sheets

  1. Selector: This code will help you style your webpage by “selecting” the section you want to style. For example, you would use “.class” to style the elements with that specific class.
  2. Comment: Your CSS file can include hundreds, if not thousands of lines of code. It is helpful to utilize comments in your code to quickly reference what a particular block is doing to your webpage. For example, <header> </header> → /* All code with the <header> tag will style the header*/
  3. Property: Properties are defined within selectors. They are separated with a colon and end with a semi-colon. Properties tell the browser what aspect of the selector you are going to be styling.


  1. String: This code is text inside of single or double quotations. For example, “My name is Captain Jack Sparrow”
  2. Functions: This code is performs a particular task. A function has to later be “called” in your code to be invoked or implemented.
  3. Loops: This code will run a block of code over and over again. You must specify what condition must be met for the loop to stop running — otherwise, you will run an infinite loop and your browser will crash!