HTML and CSS: A Guide to Web Design
4.7 (13 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.
1,560 students enrolled
Wishlisted Wishlist

Please confirm that you want to add HTML and CSS: A Guide to Web Design to your Wishlist.

Add to Wishlist

HTML and CSS: A Guide to Web Design

Learn how to create an attractive and functional responsive website, without overly complicated terms and ideas.
4.7 (13 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.
1,560 students enrolled
Created by James Rogers
Last updated 11/2015
English
Curiosity Sale
Current price: $10 Original price: $25 Discount: 60% off
30-Day Money-Back Guarantee
Includes:
  • 14 hours on-demand video
  • 1 Supplemental Resource
  • Full lifetime access
  • Access on mobile and TV
  • Certificate of Completion
What Will I Learn?
  • take the structure and fundamentals learned to create simple, and complex websites for just about anything
  • take many CSS and HTML fundamentals from example to production
  • find and fix common errors that occur in the coding process
  • Create a responsive site from scratch, or retrofit an existing site
View Curriculum
Requirements
  • Mac or PC
  • Web Browser. Chrome or Firefox is recommended, but any will do.
  • Text editor. I use the Adobe Suite.
Description

Have you ever wondered how you could get that magnificent idea from your brain onto the web? You see so many great websites (and a couple of not so great ones), and you can't help but think, "I could do that!"

If so, then this course is perfect for you. Instead of drilling down with lots of useless snippets and complicated examples, this course will focus on functional application that you can use right away.

You will learn how to code a website from scratch, in a structure that will make it easy to apply Responsive Design styles to. You will also learn how to use basic PHP snippets to make updating common parts of your website easier than a traditional static website.

This course includes all the following, and more:

  • HTML Fundamentals
  • CSS Fundamentals
  • Basic PHP Introduction
  • Font Usage and Google Font Substitution
  • Website Testing
  • Responsive Design and Media Queries
  • Troubleshooting and Error checking Guidelines
  • 74 Lectures, File downloads, and 15 hours of content

The best part about this course is that it makes no assumptions on your skill level. If you know nothing, or a whole lot of something, you'll find techniques in this course that you can apply to your next project. All of the material used in this course is real world application. All of the examples used are based off the structure you will be learning, so it's been proven to work in production

If this sounds right for you and you're ready to get started, just click the Take This Course button to the right and we'll begin!

Who is the target audience?
  • This HTML and CSS course is designed for those who have little to no experience creating websites, but want to learn. This is directed at static website development, so no major PHP or database applications will be covered.
  • If you are looking for a good refresher course - for more experienced individuals.
  • Individuals wanting to make websites more accessible with Responsive Design
Students Who Viewed This Course Also Viewed
Curriculum For This Course
74 Lectures
14:08:01
+
Course Introduction
4 Lectures 27:49

Welcome to the course and overview of things we'll be going over.

Preview 06:07

Programs and tools we'll be using, as well as suggested alternatives

Course Tools
08:06

A brief overview and history of what HTML and CSS are.

Preview 06:56

Practical examples of websites built with the exact HTML and CSS fundamentals and structures found inside the lessons in this course.

Examples of Websites Built With This Method
06:40
+
Project Setup
2 Lectures 10:52

We'll go over how to install MAMP and how to set it up for easy website development and testing.

MAMP Set Up and Preferences
06:06

We'll look into common website folder organization and the thinking behind why it's done

Folder Structure
04:46
+
HTML Fundamentals
11 Lectures 01:33:08
Page Setup
05:41

H1 through H6 Tags
05:57

P (Paragraph) Tag
04:19

Ordered and Unordered Lists
06:32

Images
09:48

Links
12:27

Tables
08:16

iFrames and Embed
12:01

Blockquotes
05:47

Forms
14:35

+
CSS Fundamentals
18 Lectures 03:51:41
External, Internal, and Inline CSS
13:08

Selectors
16:31


Font Color & BG Color
12:33

Float & Clear
16:33

Margins & Padding
07:42

Borders
16:33

Styling Links
16:13

Fonts
11:46

Background Images
12:58

Overflow
05:46


Positioning and Z-index
18:59

Form Styling Part 1
09:59

Form Styling Part 2
11:38


Google Fonts
15:16

Grouping CSS Classes
09:56
+
Building Our Website
12 Lectures 02:30:20
Introduction & Goals
05:26

Setting It Up
08:08

Our Grid Structure
20:40


Building the Home Page Part 2
11:45

Styling the Home Page Part 1
14:40

Styling the Home Page Part 2
10:32

Styling the Home Page Part 3
12:18

Info List
13:50

Navigation Menu
09:25

Header & Footer PHP
17:35

Active Links for Navigation
10:46
+
Internal Pages of Our Website
10 Lectures 02:35:00
Introduction
01:34

Experience Page Part 1
18:00

Experience Page Part 2
20:54

Portfolio Page Part 1
14:31

Portfolio Page Part 2
18:31


Testimonials Page
20:06

Contact Page Part 1
14:35

Contact Page Part 2
15:32

Contact Page Part 3
16:13
+
Responsive Design
7 Lectures 01:26:36


Meta Viewport
05:40

Tablet View Part 1
17:45

Tablet View Part 2
16:26

Mobile View Part 1
12:11

Mobile View Part 2
13:38
+
Going Live With Our Website
5 Lectures 45:23
Introduction
02:03

Domain and Hosting
16:40

Filezilla Upload
08:18

Website Testing
15:30

Thank You!
02:52
+
Bonus Material
5 Lectures 47:12
Bonus Introduction
01:21

Font-Awesome Integration
12:18

Image Optimization
12:44

Adding a Favicon
13:06

Google Analytics
07:43
About the Instructor
James Rogers
4.7 Average rating
13 Reviews
1,560 Students
1 Course
Creative Thinker at Udemy

My name is James, and I'm a freelance graphic designer & web developer currently located in California. I have a Bachelor of Science in Graphic Design, graduated with Honors, and I've been building websites for over 10 years. Give me your creative problem, and I'll give you a creative solution.

My experience as a graphic designer has allowed me to combine the technical functions of building a website with the aesthetic side of creating art, which results in a clean, functional website that looks good and operates the same way. I believe in having a clean design, and clean code.