Neither this website nor any other could function the way it does without Hypertext Markup Language and most would not look the way they do without Cascading Style Sheets. WordPress, Adobe Dreamweaver and other applications supply users with text editors, and understanding the basic elements of Hypertext Markup Language and Cascading Style Sheets can optimize your use of those text editors. (WordPress support explains more here.)

Hypertext Markup Language, commonly abbreviated HTML, is the plain-text language used to select the structure and layout of a website. HTML relies on special tags to communicate structural demands about the webpages. There are more than 120 markup tags, each indicated by angle brackets. For example, you would use the tag <b> if you wanted to add bold text.


An example of Hypertext Markup Language. Picture by Natasha Vos. All rights reserved.

Cascading Style Sheets, shortened to CSS, describe the specific designs for markup language like HTML. CSS adds additional visual elements to websites. A website created without using CSS will default to white backgrounds with black text. CSS is what makes a site more visually stimulating. For example, you would use CSS to add a colorful border and to adjust the margins.

You can see HTML and CSS on any webpage by pressing a couple of buttons. If you’re on a Windows computer, hit Ctrl+U. If you’re using a Mac, hit Command+U (or Command+Option+U). When you do so, the page will be transformed to reveal the hidden language with which it was created.

Visit this YouTube channel for more videos about HTML and web development!