Write quicker HTML5 and CSS 3; productivity hacks with emmet

Visit Tutorial Page ( Report)
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. 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
  • Before we even get started
  • 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.

    • Thanks for taking the course

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

    • Thanks for taking the course

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

    • Thanks for taking the course

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

Write Your Review

Reviews