Web Design for Beginners: Real World Coding in HTML & CSS
4.7 (1,864 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.
9,642 students enrolled
Wishlisted Wishlist

Please confirm that you want to add Web Design for Beginners: Real World Coding in HTML & CSS to your Wishlist.

Add to Wishlist

Web Design for Beginners: Real World Coding in HTML & CSS

Launch a career as a web designer by learning HTML5, CSS3, responsive design, Sass, cross device compatibility and more!
Best Selling
4.7 (1,864 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.
9,642 students enrolled
Created by Brad Schiff
Last updated 3/2017
English
English
Curiosity Sale
Current price: $10 Original price: $100 Discount: 90% off
30-Day Money-Back Guarantee
Includes:
  • 9 hours on-demand video
  • 5 Supplemental Resources
  • Full lifetime access
  • Access on mobile and TV
  • Certificate of Completion
What Will I Learn?
  • Create any website layout you can imagine
  • Support any device size with Responsive (mobile-friendly) Design
  • Add tasteful animations and effects with CSS3
  • Use common vocabulary from the design industry
View Curriculum
Requirements
  • No prerequisite knowledge required
  • No special ($$$) software required
Description

You can launch a new career in web development today by learning HTML & CSS. You don't need a computer science degree or expensive software. All you need is a computer, a bit of time, a lot of determination, and a teacher you trust. I've taught HTML and CSS to countless coworkers and held training sessions for fortune 100 companies. I am that teacher you can trust.

Don't limit yourself by creating websites with some cheesy “site-builder" tool. This course teaches you how to take 100% control over your webpages by using the same concepts that every professional website is created with.

This course does not assume any prior experience. We start at square one and learn together bit by bit. By the end of the course you will have created (by hand) a website that looks great on phones, tablets, laptops, and desktops alike.

I have helped over 4,000 students and have received the following feedback:

“…A fantastic course… clear, definite and engaging."

“…Presentation is concise without being tedious… you honestly feel that you have a thorough understanding of the subject."

“…[Brad] explained the process. Not memorize this or that, he explained the process. If you're looking to take a course to understand the foundations of creating websites, look no further."

“Brad definitely has some of the best techniques to embed the lesson into your mind… hands down these are the best tutorials I have had the opportunity to view."

“I found this course really helpful and I highly recommend it… all things you learn are seen in action instantly."

“Brad has put together a great foundation for any body wishing to get a good understanding with front end web-development."

“…I would definitely recommend this course to most folks I know who want to learn web design."

Who is the target audience?
  • Anyone who wants to build websites the "professional" way
  • Anyone who has practiced web design as a hobby but is not confident about their skillset in a professional arena
  • Experienced developers looking to renew their HTML5 & CSS3 knowledge
Students Who Viewed This Course Also Viewed
Curriculum For This Course
58 Lectures
08:55:26
+
Welcome!
1 Lecture 01:59
+
HTML Essentials
7 Lectures 32:07


I strongly encourage you to use a dedicated text editor. I recommend the freely available Sublime Text.

Hands On! Create your First HTML File
04:52

Russian Stacking Dolls: Bulleted Lists
04:22

HTML Document Structure
04:51

First Look at Attributes: Linking Pages Together
06:25

Section 1 Review
02:18
+
Adding Media to a Web Page
3 Lectures 19:26

In this lesson we learn how to insert an image into a webpage. If you want to edit or resize an image before placing it on your webpage and you do not have access to Adobe Photoshop I recommend the free image editing software named GIMP.

Images
05:24

In this lesson we learn about the "<audio>" element which allows us to include audio clips directly on our pages without relying on third party software (Flash). Download the supplementary material .zip file for a working demo of the audio element.

Audio Files
05:48

In this lesson we learn about the "<video>" element which allows us to natively include video clips on our pages. However, we learn that there are several factors which make including video on our pages without the help of third party services quite tricky.

Video Files
08:14
+
Text Basics
4 Lectures 19:56
Headings
03:48

Lists
05:47

Bold & Italic
07:13

For a larger list of available HTML special characters visit this University page.

Also please note that in the video lesson I incorrectly referred to the "&" symbol as "ampersands" (plural). In this case the correct phrase would be simply "ampersand."

Special Characters
03:08
+
Semantics & Organization
5 Lectures 24:30
Semantic Structural Elements
07:35

Navigation
04:00

Non-semantic Elements ("div" and "span")
05:27

HTML Comments
02:41

The "Section" Element
04:47
+
Forms
3 Lectures 25:15
Forms
08:19

Different Types of Inputs
06:21

Choosing Between a set of options
10:35
+
Tables
2 Lectures 09:04
How to Create a Table of Data
07:18

Do Not Use Tables for Layout
01:46
+
CSS Essentials
6 Lectures 57:53

CSS Selectors
06:51

The Cascade
10:08

Box Model
08:19

Creating a Page Layout with Floats
15:34

Let's apply what we've learned about CSS so far to make our page easier on the eyes.

If you are looking for a color picker I recommend the free Adobe Kuler website / tool. Not only can you click on a circle in the color wheel to find color codes, but Kuler will also provide additional complimentary colors.

Beauty School! Apply What We've Learned
11:44
+
Intermediate CSS
2 Lectures 23:08
Styling Navigation Menu
08:02

Overlapping Content & Transparent Backgrounds
15:06
+
Less Exciting Yet Still Necessary CSS Tasks
2 Lectures 30:06
Styling Data Tables
12:46

In this lesson we learn how to customize the appearance of HTML forms. The lesson mentions third party CSS libraries you can leverage to tackle cross browser styling issues. Here are some of the most popular options in the webDev community:

Formalize

Normalize

Note that Formalize is strictly focused on forms, while Normalize helps level the playing field for all elements across all browsers (e.g. h1-h6, p, table, etc...).

Styling Forms
17:20
9 More Sections
About the Instructor
Brad Schiff
4.8 Average rating
3,644 Reviews
15,487 Students
3 Courses
Web Developer

Hi, I'm Brad and I’ve taught web development to countless coworkers and held training sessions for fortune 100 companies.

I also teach local night classes and run a somewhat popular YouTube channel named LearnWebCode.

I’m a front-end developer, designer, and educator. I’ve been building user interfaces for over a decade for the world's largest brands, international technology leaders, and national political campaigns.

I'm fortunate to enjoy the development work I do, but my true passion is helping people learn.