How to use Emmet to write HTML and CSS faster
Increase your productivity with these shortcuts
Prefer to watch a video? This article is a companion piece to my Decoded by Christina series on YouTube.
Using autocomplete with your text editor
Writing HTML and CSS involves writing code that needs to follow a specific syntax. A misplaced semi-colon or a typo can throw off a whole page! Also, there tends to be a lot of repetition. To improve my workflow, I use the autocomplete feature in my text editor. This feature uses an abbreviated syntax and the tab key to expand the abbreviations. The specifics of this feature may vary between text editors; the examples provided in this article are based on the syntax used in the VS Code editor.
Let’s start with some HTML. The syntax for writing an HTML tag normally looks like this:
<header></header>With autocomplete, you can use an abbreviated syntax to save time. Just type only the element name, then press the tab key to expand…
