subject

Udacity: Intro to HTML and CSS

 with  Cameron Pittman
HTML and CSS are markup languages and the building blocks that make up the web. This course is called "Not your Typical Intro" because it does not follow the usual pattern of other courses and tutorials that you find on the Internet. Usually HTML and CSS are taught with a focus on language syntax. But knowing syntax alone does not enable you to create a webpage from a design. You need to know where to start and how to approach the task, in other words - you need to learn how to think like a front-end developer.

In this course you will learn how to convert digital design mockups into static web pages. We will teach you how to approach page layout, how to break down a design mockup into page elements, and how to implement that in HTML and CSS.

You will also learn about responsive design techniques, which are increasingly important in a world where mobile devices and TV screens are used more and more often to look for information and entertainment.

Why Take This Course?
Front-end Web Developers must have a fundamental understanding of HTML and CSS, which we’ll accomplish in this course by converting digital design mockups into static web pages. To build the web pages you will use HTML, CSS and Bootstrap, the popular Twitter CSS framework.

After completing this course you will be able to build a responsive portfolio site with your own CSS framework. You'll also have the functionality in place to add future projects to your portfolio. Most importantly, you will have an understanding of the DOM and how HTML, CSS, and JavaScript relate to each other.

This course's project is part of our Front-End Web Developer Nanodegree.

Syllabus

### Lesson 1 - From Design to Code

Diligently employ a code/test/refine strategy as you precisely and deliberately translate initial design documents into static web pages. You'll also investigate the Document Object Model (DOM) and its implications for web development.

### Lesson 2 - Your Own Framework

Take pride in creating and personalising your own multi-platform, responsive CSS framework for publishing your professional portfolio projects to the web.

### Lesson 3 - Learning and Using Bootstrap

Strategically investigate an existing professional CSS framework as you use it to build a website using responsive design principles while maintaining code readability.
30 Student
reviews
Cost Free Online Course
Pace Self Paced
Subject Web Development
Provider Udacity
Language English
Hours 6 hours a week
Calendar 3 weeks long

Disclosure: To support our site, Class Central may be compensated by some course providers.

+ Add to My Courses
FAQ View All
What are MOOCs?
MOOCs stand for Massive Open Online Courses. These are free online courses from universities around the world (eg. Stanford Harvard MIT) offered to anyone with an internet connection.
How do I register?
To register for a course, click on "Go to Class" button on the course page. This will take you to the providers website where you can register for the course.
How do these MOOCs or free online courses work?
MOOCs are designed for an online audience, teaching primarily through short (5-20 min.) pre recorded video lectures, that you watch on weekly schedule when convenient for you.  They also have student discussion forums, homework/assignments, and online quizzes or exams.

30 reviews for Udacity's Intro to HTML and CSS

Write a review
14 out of 14 people found the following review useful
3 years ago
profile picture
Marko Vuolevi completed this course, spending 4 hours a week on it and found the course difficulty to be easy.
They try to approach the way to teach web development in a somewhat unique way, instead of learning the old fashion way they instead use a top-down methodology. In other words, they take a finished website and go through how it is constructed instead of building up the website from scratch. A rather interesting approac Read More
They try to approach the way to teach web development in a somewhat unique way, instead of learning the old fashion way they instead use a top-down methodology. In other words, they take a finished website and go through how it is constructed instead of building up the website from scratch. A rather interesting approach, and possibly more fun than the usual way to learn. Are not entirely sure that this approach is the best for beginners, there is a risk that beginners miss fundamental concepts of how websites are contructed and works.

The course itself is unfortunately not of the best quality, it starts pretty promising (the first 1/3 of the course) but gets worse and worse the further you get into the course. It feels a bit unpolished and unfinished, as if they had not enough time to complete it properly and just threw something together to deliver what was promised in the beginning of the course. I have seen this pattern on a previous Udacity course before, where it started very promising but then lost a lot of quality towards the end of the course.

So, would I recommend this course? Well, it contains some good parts, but also misses a lot of important key concepts. If you feel that you have some spare time and have a little bit of experience with web development, why not. If you are a total rookie in web development, better take some other course.
Was this review helpful to you? YES | NO
8 out of 8 people found the following review useful
3 years ago
Prose Simian completed this course, spending 9 hours a week on it and found the course difficulty to be medium.
I went through 95%* of this in about 8-9 hours total. It's... so so. A bit of a whistle stop tour of html & CSS, which left me feeling like I'd got it figured out, until I ran into roadblocks trying to do apparently simple things. Perhaps I missed them, perhaps Udacity let these details slip though the gaps (while foc Read More
I went through 95%* of this in about 8-9 hours total. It's... so so. A bit of a whistle stop tour of html & CSS, which left me feeling like I'd got it figured out, until I ran into roadblocks trying to do apparently simple things. Perhaps I missed them, perhaps Udacity let these details slip though the gaps (while focussing on the important stuff: house-style, pep-talks and humour...) A couple of examples:

- you do the earlier project before learning (almost in passing) how to apply multiple classes to one element.

- only towards the end does anyone mention the order of the CSS links in the element affects how they're applied.

That said, I got my pages into reasonable shape, and I'm glad I stuck with it to the final section, and Jacques Favreux's walk-through of converting a mockup to into a responsive web page using Bootstrap, which were the hightlght of the show, and full of tips (not to mention clarifying my two sticking points from the previous para.)

So... overall not too bad if a little more frustrating than absolutely necessary. If you don't mind a learning-by-doing approach, overall a reasonable place to get your feet wet with html/css, and responsive web design (via Bootstrap).

*Everything apart from implementing a modal, right at the end.
Was this review helpful to you? YES | NO
6 out of 7 people found the following review useful
2 years ago
Gregory J Hamel ( Life Is Study) audited this course and found the course difficulty to be easy.
Intro to HTML and CSS is a 3-lesson primer on front-end web development and design. Although the name of the course suggests you'll learn HTML and CSS basics, the content is actually focused on higher level web development and design concepts like web page and project structure, responsive design and web frameworks. Th Read More
Intro to HTML and CSS is a 3-lesson primer on front-end web development and design. Although the name of the course suggests you'll learn HTML and CSS basics, the content is actually focused on higher level web development and design concepts like web page and project structure, responsive design and web frameworks. The course spends very little time talking about nuts and bolts like different HTML tags and CSS properties. The content itself is well done, it just strays a bit from what you'd expect given the title of the course. It should be entitled "Fundamentals of front-end web development/design" or something similar.

This course is hard to rate given that the content is good, but it doesn't quite fulfill the expectations set by the title. As such, I'm subtracting 1 star from what is otherwise a nice, short intro to front end web development. If you want to learn HTML nuts and bolts, the first week of Udacity's "web development" spends a lot more time going over HTML tags. The HTML and CSS courses on Code Academy and Code School are also good options.

I give this course 3.5 out of 5 stars: Good.
Was this review helpful to you? YES | NO
6 out of 7 people found the following review useful
3 years ago
profile picture
Anonymous completed this course.
The pace picks up rapidly and at times you are left struggling to work out exactly what is required to move on. The principles are sound, but it jumps into Bootstrap for the final 1/3 which is fine but a little disjointed from the first. There is not enough sharing of best practice output and the final project stretc Read More
The pace picks up rapidly and at times you are left struggling to work out exactly what is required to move on. The principles are sound, but it jumps into Bootstrap for the final 1/3 which is fine but a little disjointed from the first. There is not enough sharing of best practice output and the final project stretches well beyond anything covered in the course leaving you a bit stuck. You can make it LOOK just like the image but it can be done in a fundamentally incorrect way but no explanation as to why. The best section is in the final 1/3 where you have Jacques run through, albeit too quickly, the building of an example.
Was this review helpful to you? YES | NO
8 out of 9 people found the following review useful
2 years ago
profile picture
Anonymous completed this course.
The course is so so, but it teaches bad practices for front-end developers. It's definitely not a course for beginners since it does not teach fundamental aspects.
Was this review helpful to you? YES | NO
3 out of 3 people found the following review useful
a year ago
Dissipate dropped this course and found the course difficulty to be hard.
Like many other reviewers commented, the title of this course is misleading. It is not an introductory course for complete beginners to HTML and CSS. The course is focussed on design, and I think you will need intermediate knowledge HTML and CSS, otherwise you will feel lost. I went in with basic knowledge, and the fi Read More
Like many other reviewers commented, the title of this course is misleading. It is not an introductory course for complete beginners to HTML and CSS. The course is focussed on design, and I think you will need intermediate knowledge HTML and CSS, otherwise you will feel lost.

I went in with basic knowledge, and the first few videos were fine but got progressively worse as the instructors glazed over concepts and did not do much explaining. I felt like there were lots of gaps and I had to do a lot of self-learning. It was frustrating, and I stopped the course to explore other courses and books on web development.
Was this review helpful to you? YES | NO
2 out of 2 people found the following review useful
2 years ago
Salem Mcgonagle completed this course and found the course difficulty to be very easy.
A somewhat misleading title as most would benefit from a basic understanding of HTML/CSS prior to starting the course. While touching on the basics of HTML/CSS the majority of the course is focused on design principles such as responsive grid designs and techniques such as media queries, google fonts and frameworks. Read More
A somewhat misleading title as most would benefit from a basic understanding of HTML/CSS prior to starting the course.

While touching on the basics of HTML/CSS the majority of the course is focused on design principles such as responsive grid designs and techniques such as media queries, google fonts and frameworks.

The course is best suited for those looking to move forward from an understanding of HTML/CSS Tags & Syntax into the basics of front-end web design.

Those with no prior experience in HTML/CSS should look elsewhere first.
Was this review helpful to you? YES | NO
1 out of 2 people found the following review useful
2 years ago
Bobby Brady completed this course and found the course difficulty to be easy.
The title is a tad incorrect, this course is not an Introduction to HTML and CSS. You must already know all your html tags, attributes, elements and css selectors. What it is really great at though, is providing the student with solid knowledge of topics not often covered in regular web design courses, such as responsi Read More
The title is a tad incorrect, this course is not an Introduction to HTML and CSS. You must already know all your html tags, attributes, elements and css selectors. What it is really great at though, is providing the student with solid knowledge of topics not often covered in regular web design courses, such as responsive grid designs, media queries, google fonts and css frameworks. It's quick, to the point and gives you everything necessary to build a nice modern but simple web page with marketable tools.
Was this review helpful to you? YES | NO
1 out of 2 people found the following review useful
2 years ago
Geoffrey Allen Jenkins completed this course, spending 5 hours a week on it and found the course difficulty to be medium.
Fortunately, I had some previous experience with html so I was able to move through the course rather quickly. However, I found it enlightening in regards to learning some basic CSS language as well as promoting healthy design habits. I highly recommend it to anyone looking to "get their feet wet" in website design. *I don't think previous knowledge of HTML is necessary for this course.
Was this review helpful to you? YES | NO
1 out of 2 people found the following review useful
2 years ago
profile picture
Anonymous partially completed this course.
I came into this course completely new on html/css. Definitely feel like a lot of content was dropped on my and not thoroughly explained, it's really not a beginner course imo. I intend to do codeacademy's html/css and udacity's web development course and then come back to this course.
Was this review helpful to you? YES | NO
1 out of 1 people found the following review useful
2 years ago
profile picture
Anonymous partially completed this course.
It's an overview of modern html and css, I think it need more examples and explanation on some topics like flex and media queries, If you only need and overview an are willing to look for the concepts by yourself this is the course you need.
Was this review helpful to you? YES | NO
1 out of 1 people found the following review useful
a year ago
profile picture
Anonymous partially completed this course.
its a good place to learn html and css...especially for a beginner who don't even know the basics...good work by the udacity team...
Was this review helpful to you? YES | NO
2 months ago
Panos Gr completed this course, spending 2 hours a week on it and found the course difficulty to be medium.
This course is definitely NOT FOR BEGINNERS. That being said it was a delight for me. Learn some html and css from more basic walk-through style classes like the ones offered at Coursera, Code Academy , even W3Schools and come back to this. Having some knowledge on these subjects will help tremendously out and instead Read More
This course is definitely NOT FOR BEGINNERS.

That being said it was a delight for me. Learn some html and css from more basic walk-through style classes like the ones offered at Coursera, Code Academy , even W3Schools and come back to this. Having some knowledge on these subjects will help tremendously out and instead of giving you frustration it will teach and offer clarity for many concepts that seem a bit difficult to grasp at first.

It is , as mentioned by many others, a little more advanced course but it is very rewarding as you will learn a lot of industry approven techniques for coding up a website. There is even a 20 minute walkthrough of turning a mock-up design into a website towards the end, using Bootstrap and custom classes that really offers some insight to all the blurriness of the subject being taught.

The class is somewhat rushed, but again, it is not meant to teach HTML and CSS in depth but rather to give you an overview of what you can do with the languages so I recommend it , sure, as long as you're in it for higher-level concepts than coding.
Was this review helpful to you? YES | NO
2 months ago
profile picture
Anonymous partially completed this course.
Im at 67% and I decided to drop it. I feel I haven't really earned anything. Whatever I know about html and css - which is really basic, I've learned it from other sources. Too much theory," jokes" and useless quiz that eat time and frustrated... My big issue is the order that they teach things...I don't know.. Read More
Im at 67% and I decided to drop it.

I feel I haven't really earned anything. Whatever I know about html and css - which is really basic, I've learned it from other sources.

Too much theory," jokes" and useless quiz that eat time and frustrated...

My big issue is the order that they teach things...I don't know... it just didn't worked for me... didn't make sense :-(
Was this review helpful to you? YES | NO
2 years ago
Jam Kram completed this course.
I was lucky and learned the html/css basic syntax first with Codeacadamy. I recommend you do as well. This course was an excellent second step in my learning process. It showed me a relevant real life work flow to building a website (Devtools combined with Sublime Text editor) which was exactly what I needed and was looking for. I enjoyed it.
Was this review helpful to you? YES | NO
2 months ago
profile picture
Marta De Angelis is taking this course right now, spending 6 hours a week on it and found the course difficulty to be easy.
I am currently taking the course, but I can say I find it very light and easy to follow, and it makes me want to go on and on exercising and learning. Great job, professor!
Was this review helpful to you? YES | NO
1 out of 3 people found the following review useful
2 years ago
Charlie Chung is taking this course right now.
Was this review helpful to you? YES | NO
1 out of 3 people found the following review useful
2 years ago
profile picture
Maresu Andrei Razvan completed this course.
Was this review helpful to you? YES | NO
1 out of 2 people found the following review useful
2 years ago
profile picture
Pergamom audited this course.
Was this review helpful to you? YES | NO
1 out of 2 people found the following review useful
2 years ago
profile picture
Akashdeep Gupta is taking this course right now.
Was this review helpful to you? YES | NO
Was this review helpful to you? YES | NO
a year ago
profile picture
Said Aspen completed this course.
Was this review helpful to you? YES | NO
a year ago
Krešimir Mandić completed this course.
Was this review helpful to you? YES | NO
7 months ago
Jelena Stein completed this course.
Was this review helpful to you? YES | NO
8 months ago
Henry Mcgrath completed this course.
Was this review helpful to you? YES | NO
a year ago
profile picture
Christine Defilippo completed this course.
Was this review helpful to you? YES | NO
a year ago
profile picture
Mario K. completed this course.
Was this review helpful to you? YES | NO
11 months ago
Lara Hafen partially completed this course.
Was this review helpful to you? YES | NO
0 out of 3 people found the following review useful
2 years ago
Qz completed this course.
Was this review helpful to you? YES | NO
0 out of 3 people found the following review useful
2 years ago
Nithin completed this course.
Was this review helpful to you? YES | NO

Class Central

Get personalized course recommendations, track subjects and courses with reminders, and more.

Sign up for free