Skip to toolbar
4.36 out of 5
951 reviews on Udemy

Write quicker HTML5 and CSS 3; productivity hacks with emmet

Change the way to write HTML 5 and CSS 3 codes. A faster way that will increase your productivity to write codes
Igneus Technologies
33,832 students enrolled
English [Auto-generated]
Write faster HTML codes
Write faster CSS codes
Create bootstrap templates quickly
get friendly with emmet
use emmet on your favourite editor

Hello everyone and welcome to Write quicker HTML5 and CSS 3; productivity hacks with emmet. Before we even begin to talk about this course, lets be very clear, this is not a course that teaches HTML and CSS from basics. This course is something that you take after learning HTML and CSS. This course will be a game changer for you. With Emmet you can quickly write a bunch of code, wrap code with new tags, quickly traverse and select important code parts and even more.

Best part is, you will stay at your favorite editor. It might be Coda, sublime text, Atom, brackets or any other. Emmet is just a plugin that saves time.

A lot of students learn HTML and css; in fact they are very good at it. But let’s be honest, we are little lazy to write our code. What if we say that you have to write only a few words and editor will understand everything for you. Make your editor smart with Emmet.

This course will start from teaching the installation of Emmet on almost every popular editor and then we will move to get friendly with productivity hacks with Emmet. We will explore the concepts of creating child’s, siblings and climbing up the tree structure to create DOM structure. We will learn the shortcuts for ID’s and Classes. One of my favorite one is Lorem Ipsum text generator. Next comes up the various Doctypes generators. Further we will talk about HTML tag generation.

Next we will move towards CSS and will learn to link the CSS files quickly. Further we will explore the margins, padding and color shortcuts.

At first you will feel like magic and yes it is very magical to write code at such a fast speed. So, enough of talking and let’s get productive with emmet.

Before we even get started

Course introduction and watching strategy

Introduction to the entire course and things we will cover

Installation and getting friendly

Installation : Child, sibling and climbing up

In this movie we will learn to install Emmet. Further we will focus on creating child elements, siblings and traversing to nodes.

ID and Class shortcuts

In this movie we will talk about generating quick ID's and classes. This will help you to get into bootstrap very quickly since bootstrap is all about classes

Multiplication and item numbering

Generating many list items is not an easy task and specially if you are not a big fan of copy and paste. Emmet will solve this problem in this movie.

Custom Attrtibutes and text

Sometimes we need to generate custom texts inside tags like p and h1. This movie will be a great life saver for such situation

Lorem Ipsum Generator

While designing templates Meaningless text is something that everyone needs. Emmet saves us a lot of time because of its capability of having Lorem text

Groupings and implicit tags

Grouping of tags is something very different in emmet. Let's learn about grouping tags and also discuss implicit tags

Emmet and HTML

Generating DocTypes

There are many DocTypes in HTML. Present HTML 5 doctype is easy and is more easy in Emmet. But HTML 4 doctype is also a piece of cake in emmet.

Html Tags Part 1

Learn to generate quick HTML tags in our HTML file with the help of emmet in part 1 of this movie

HTML tags part 2

Learn to generate quick HTML tags in our HTML file with the help of emmet in part 2 of this movie

Emmet and CSS

Write CSS and link them
Linking CSS files in HTML document is one of the important task and must to do for every developer. Emmet makes life easy in this case.
Margin, padding, background and color

There are few short cuts about Margin, Padding and Beckgounds in Emmet. This will help in writing faster CSS

Text fonts and box

Everyone wants custom fonts and like to include them in their CSS. In this movie, we will learn to get shortcuts about it

quick CSS shortcuts

Finally, this movie will teach about CSS shortcuts and all about such shortcuts that remember. You will for sure like this movie

Thanks for taking the course

Thanks for taking the course

Thanks for taking the course. We would like to see you in our other courses too.

You can view and review the lecture materials indefinitely, like an on-demand channel.
Definitely! If you have an internet connection, courses on Udemy are available on any device at any time. If you don't have an internet connection, some instructors also let their students download course lectures. That's up to the instructor though, so make sure you get on their good side!
4.4 out of 5
951 Ratings

Detailed Rating

Stars 5
Stars 4
Stars 3
Stars 2
Stars 1
30-Day Money-Back Guarantee


1 hours on-demand video
Full lifetime access
Access on mobile and TV
WP Twitter Auto Publish Powered By :