Practical HTML and CSS
3.5 (1 rating)
Course Ratings are calculated from individual students’ ratings and a variety of other signals, like age of rating and reliability, to ensure that they reflect course quality fairly and accurately.
5 students enrolled

Practical HTML and CSS

Launch your web career by adding HTML and CSS to your skillset
3.5 (1 rating)
Course Ratings are calculated from individual students’ ratings and a variety of other signals, like age of rating and reliability, to ensure that they reflect course quality fairly and accurately.
5 students enrolled
Created by Packt Publishing
Last updated 8/2018
English [Auto-generated]
Current price: $86.99 Original price: $124.99 Discount: 30% off
5 hours left at this price!
30-Day Money-Back Guarantee
This course includes
  • 4.5 hours on-demand video
  • 1 downloadable resource
  • Full lifetime access
  • Access on mobile and TV
  • Certificate of Completion
Training 5 or more people?

Get your team access to 4,000+ top Udemy courses anytime, anywhere.

Try Udemy for Business
What you'll learn
  • Own and control your digital presence by creating your own web and design pages to fit your needs exactly
  • Build a foundation in HTML and the semantics of good coding style
  • Explore document structure to allow quick, reusable, and consistent development.
  • Unravel the worth of the cascading nature of CSS: IDs, classes, tags, and pseudo-classes
  • Develop a responsive web page that will look great on any size device
  • Get familiar with cross-browser support to ensure your site will look great on different browsers and devices
  • Improve your problem solving by learning how to efficiently read documentation and solve tech-related issues
Course content
Expand all 29 lectures 04:25:03
+ Getting Started with HTML
6 lectures 44:03

This video will give you an overview about the course.

Preview 03:55

You need good tools to make authoring HTML and CSS easy. In this video, you get an overview of how an IDE provides that functionality.

   •  Learn what editors you can use.

   •  Learn about list features of an IDE

   •  Learn about different IDEs for different operating systems

Integrated Development Environments (IDEs)

In this video, you will learn how different hosting options can help you identify your website needs.

   •  Learn about website engines

   •  Learn about shared hosting

   •  Learn about cloud providers

Building Your First Website

In this video, you will understand the parts of an HTML document.

   •  Learn about the Head

   •  Learn about encoding and how tags are read

   •  Learn how content and body are organized

HTML Document Structure

In this video, you will understand HTML tags and the value of semantic markup.

   •  Learn about tags

   •  See how tags display by default


Your document will not stand alone – it will need to be linked to other sites. In this video learn how to perform linking and including

   •  Create a link

   •  Include a CSS file

HTML – Linking and Including
+ Diving into HTML Tags, Classes, and IDs
6 lectures 01:13:45

In this video, we will lay the foundation for learning HTML and see how items are laid out on a page.

   •  Review common HTML tags

   •  Learn about the box model

   •  Explore the default styling features

Preview 13:42

In this video, you will introduce yourself to the Bootstrap framework to speed up high-quality content creation.

   •  Learn about Bootstrap

   •  Explore the documentation

   •  Go through the pre-made Bootstrap examples

Intro to Bootstrap

In this video, you will make your content easily discoverable by utilizing meta tags for SEO and social media

   •  Learn about meta tags and what values to use

   •  Explore the useful tools for debugging

   •  Learn about open graph

Meta Tags and SEO

In this video, you will learn how to include images, what formats to use, and when.

   •  Explore the supported formats with features

   •  Learn about compression and quality

   •  Learn about animation

Working with Images

In this video, we will give you an overview of HTML5.

   •  Review the documentation

   •  Learn how to implement tags

   •  Understand the value of HTML5

Introduction to HTML5

In this video, we will give you an overview of CSS and Selectors.

   •  Learn about basic Selectors

   •  Join Selectors

   •  Learn about complex Selectors

CSS and Selectors
+ Controlling the Look and Feel Through CSS
6 lectures 01:16:55

Learn how to set colors and bring life to your page.

   •  Learn about RGB

   •  Introduce yourself to Alpha

   •  Introduce yourself to hex notation


This video will give you an overview of Fonts.

   •  Control font size, style, and weight

   •  Include new and external fonts

   •  Understand the utility of different fonts


All elements are positioned using the box model. In this video, learn how its use is critical in styling a website.

   •  Learn about Padding

   •  Learn about Border

   •  Learn about Margin

Controlling the Box Model

This video will give you an overview of Additional Directives.

   •  Review documentation

   •  Understand the common parameters

   •  Review other parameters

Additional Directives

This video will give you an overview of Pseudo Classes, Pseudo Elements, and Cascading.

   •  Explore the Cascading nature of CSS

   •  Understand Pseudo Classes

   •  Understand Pseudo Elements

Pseudo Classes, Pseudo Elements, and Cascading

An overview of CSS Frameworks.

   •  Describe the value of using a framework

   •  Explore the different frameworks and see where to learn more

   •  Understand how to read documentation for frameworks

CSS Frameworks
+ Mobile Friendly and Responsive Design
3 lectures 27:51

In this video, you will learn how to make your site look different for different devices by applying different styles based on form factor.

   •  Understand form factor size

   •  Use min and max to target devices

   •  Learn to target certain devices

Media Queries

This video will walk you through user experience for different devices.

   •  Understand the mobile experience

   •  Understand the tablet experience

   •  Understand the desktop experience

User Experience, Different Devices

This video will give you an overview of responsive design with Bootstrap.

   •  Learn about the bootstrap grid

   •  Learn about display

   •  Understand Bootstrap documentation

Responsive Design with Bootstrap
+ Cross Browser Compatibility, Debugging, and Understanding Documentation
4 lectures 25:30

In this video, learn about the different browser engines.

   •  Learn about the most widely used browsers and their differences

Browser Differences

Learn about the few operating system differences for mobile & desktop computing.

   •  Explore the default fonts available

   •  Explore the browser availability on each platform

   •  Learn the differences between various OS dependents

Operating System Differences

This video will help you understand how to inspect and Debug.

   •  Learn about Inspect

   •  Inspect across browsers

   •  Lean to live-edit CSS

Inspect and Debugging

In this video, learn how to ensure that your website is functional for users by performing cross-browser testing.

   •  Review premade testing tools

   •  Make use of different browsers on the same computer

   •  Perform cross-Browser Testing keeping mobile and desktop in mind

Cross Browser Testing
+ Adding Widgets
4 lectures 16:59

Learn how to integrate the most popular social media platforms and features.

   •  Use widget customizers

   •  Embed tweets

   •  Copy and paste email capture forms

Social Embeds

In this video, learn how you can know what you can do with code on the internet.

   •  Understand open source licenses

   •  Learn about paid licensing

Licensing and Rights

In this video, learn how you can be sure that code you are using is safe.

   •  Discuss the benefits of iframes

   •  Understand the restrictions of iframes

   •  Understand the risks involved in using external code

Security Concerns – IFrames Versus Code Snippets

This video will give you an overview of customization.

   •  Learn to edit code

   •  See how other code achieves targets

   •  Make your code

  • Very basic HTML and CSS knowledge will be helpful.

Tech skills such as HTML and CSS will always be in demand, which makes finding skilled, quality web developers time-consuming and costly. By learning everything you need to know to get started with HTML and CSS, you can save yourself time and money and give yourself a highly marketable skill.

Technology is constantly changing, and over his 20-year development career, Nick Ruffilo has seen just how widely it can change. Delve into Practical HTML and CSS with Nick and learn everything you need to get started with HTML and CSS and succeed in your web development career. You will be able to implement real-world skills to build real-world websites: professional, beautiful, and truly responsive websites that will maximize the value you can create. This course will give you the confidence to take on any web design by knowing what is possible, how to find the answers to the unknown, and how to make your website stand out from the crowd.

By the end of this course, you will be able to bring in the power of both HTML and CSS to your work by building great professional-looking websites. By learning HTML and CSS, you will get the best of both worlds in your web development projects or tasks and ensure that your site is flexible, relevant, and easy to maintain. 

About the Author

Nick Ruffilo has been a successful entrepreneur and web developer for over 20 years. Nick has taught software and web development to students ranging from age 5 to 75. He has spoken at conferences all over the world on a wide range of technology topics. He started out as a self-taught entrepreneur with a business idea but no way to put into practice, which is why he learned to code. He's been in your shoes and wants to make you a success. 

Who this course is for:
  • This course is ideal for anyone who wants web-development to be their career.
  • But, even if you're a complete beginner, there's no need to worry: we'll ensure that you learn everything you need to get started with both HTML and CSS.