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
4.4 (161 ratings)
Instead of using a simple lifetime average, Udemy calculates a
course's star rating by considering a number of different factors
such as the number of ratings, the age of ratings, and the
likelihood of fraudulent ratings.
8,220 students enrolled
Start Learning Now
  • Lectures 15
  • Length 1.5 hours
  • Skill Level All Levels
  • Languages English
  • Includes Lifetime access
    30 day money back guarantee!
    Available on iOS and Android
    Certificate of Completion
Wishlisted Wishlist

How taking a course works


Find online courses made by experts from around the world.


Take your courses with you and learn anywhere, anytime.


Learn and practice real-world skills and achieve your goals.

About This Course

Published 3/2016 English

Course Description

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.

What are the requirements?

  • Basics of HTML and CSS
  • Basics of web development
  • Basics of web design

What am I going to get from this course?

  • Write faster HTML codes
  • Write faster CSS codes
  • Create bootstrap templates quickly
  • get friendly with emmet
  • use emmet on your favourite editor

Who is the target audience?

  • NOT a course for introduction of HTML and CSS
  • A must for all web designers
  • web developers
  • students who have just started the HTML courses

What you get with this course?

Not for you? No problem.
30 day money back guarantee.

Forever yours.
Lifetime access.

Learn on the go.
Desktop, iOS and Android.

Get rewarded.
Certificate of completion.


Section 1: Before we even get started

Introduction to the entire course and things we will cover

Section 2: Installation and getting friendly

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


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


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.


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


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


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

Section 3: Emmet and HTML

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.


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


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

Section 4: Emmet and CSS
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.

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


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


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

Section 5: Thanks for taking the course

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

Students Who Viewed This Course Also Viewed

  • Loading
  • Loading
  • Loading

Instructor Biography

Igneus Technologies, Best Comprehensive Courses

We at Igneus have trained students from IIT's, NIT's and reputed companies. Students from all over the globe have trusted our High quality and affordable trainings from 10+ countries and have opted for our Certification programs.

IGNEUS stands for the Revolutionary and a quality enhanced change that we’ve tried to come up with in the modern world of Internet education. We’ve come up bearing in mind the maximum emphasis on the quality dealing with every new technology which has made us distinguished from the throng at internet. And this revolution of choice will keep continuing. Today IGNEUS Technologies has proudly lifting up the tag of being the world's most trusted provider of myriad of services and training programs aiding constantly in every corner of the globe along with web security aspects, and open source technology.

IGNEUS Technologies Pvt. Ltd is a dream shared and brought up by two computer geniuses to make the society upgraded and aware of the cyber crimes that curb the innocence of environment, thus starting a revolution in favor of cyber security.

Igneus stands for the Revolutionary and a quality enhanced change in every aspect of its touch to internet. Quality dealing with every new technology makes us different from the crowd of internet. The revolution of choice continues. Today Igneus Technologies is the world's most trusted provider of mentioned services and training along with web security aspects, and open source technology.

Ready to start learning?
Start Learning Now