Udemy
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
Development
Web Development Data Science Mobile Development Programming Languages Game Development Database Design & Development Software Testing Software Engineering Development Tools No-Code Development
Business
Entrepreneurship Communications Management Sales Business Strategy Operations Project Management Business Law Business Analytics & Intelligence Human Resources Industry E-Commerce Media Real Estate Other Business
Finance & Accounting
Accounting & Bookkeeping Compliance Cryptocurrency & Blockchain Economics Finance Finance Cert & Exam Prep Financial Modeling & Analysis Investing & Trading Money Management Tools Taxes Other Finance & Accounting
IT & Software
IT Certification Network & Security Hardware Operating Systems Other IT & Software
Office Productivity
Microsoft Apple Google SAP Oracle Other Office Productivity
Personal Development
Personal Transformation Personal Productivity Leadership Career Development Parenting & Relationships Happiness Esoteric Practices Religion & Spirituality Personal Brand Building Creativity Influence Self Esteem & Confidence Stress Management Memory & Study Skills Motivation Other Personal Development
Design
Web Design Graphic Design & Illustration Design Tools User Experience Design Game Design Design Thinking 3D & Animation Fashion Design Architectural Design Interior Design Other Design
Marketing
Digital Marketing Search Engine Optimization Social Media Marketing Branding Marketing Fundamentals Marketing Analytics & Automation Public Relations Advertising Video & Mobile Marketing Content Marketing Growth Hacking Affiliate Marketing Product Marketing Other Marketing
Lifestyle
Arts & Crafts Beauty & Makeup Esoteric Practices Food & Beverage Gaming Home Improvement Pet Care & Training Travel Other Lifestyle
Photography & Video
Digital Photography Photography Portrait Photography Photography Tools Commercial Photography Video Design Other Photography & Video
Health & Fitness
Fitness General Health Sports Nutrition Yoga Mental Health Dieting Self Defense Safety & First Aid Dance Meditation Other Health & Fitness
Music
Instruments Music Production Music Fundamentals Vocal Music Techniques Music Software Other Music
Teaching & Academics
Engineering Humanities Math Science Online Education Social Science Language Teacher Training Test Prep Other Teaching & Academics
AWS Certification Microsoft Certification AWS Certified Solutions Architect - Associate AWS Certified Cloud Practitioner CompTIA A+ Cisco CCNA Amazon AWS CompTIA Security+ AWS Certified Developer - Associate
Graphic Design Photoshop Adobe Illustrator Drawing Digital Painting InDesign Character Design Canva Figure Drawing
Life Coach Training Neuro-Linguistic Programming Mindfulness Personal Development Personal Transformation Meditation Life Purpose Coaching Neuroscience
Web Development JavaScript React CSS Angular PHP WordPress Node.Js Python
Google Flutter Android Development iOS Development Swift React Native Dart Programming Language Mobile Development Kotlin SwiftUI
Digital Marketing Google Ads (Adwords) Social Media Marketing Google Ads (AdWords) Certification Marketing Strategy Internet Marketing YouTube Marketing Email Marketing Retargeting
SQL Microsoft Power BI Tableau Business Analysis Business Intelligence MySQL Data Analysis Data Modeling Data Science
Business Fundamentals Entrepreneurship Fundamentals Business Strategy Online Business Business Plan Startup Freelancing Blogging Home Business
Unity Game Development Fundamentals Unreal Engine C# 3D Game Development C++ 2D Game Development Unreal Engine Blueprints Blender
30-Day Money-Back Guarantee

This course includes:

  • 7 hours on-demand video
  • 8 articles
  • Full lifetime access
  • Access on mobile and TV
Development Web Development CSS

Code a Responsive Website Using HTML5 and CSS for Beginners

Learn to hand code a responsive HTML5 site with beautiful CSS, scalable images and a functional web form.
Rating: 4.1 out of 54.1 (412 ratings)
2,205 students
Created by Paul Cheney
Last updated 10/2020
English
English
30-Day Money-Back Guarantee

What you'll learn

  • By the end of this course you will be able to link documents and images together.
  • By the end of this course, you will be able to use media queries to create phone and desktop navigation.
  • By the end of this course you will be able to send an email to yourself from a web form
  • By the end of this course you will be able to not only create a beautiful multiple page website but also explain what each line of HTML and CSS does

Course content

9 sections • 102 lectures • 7h 12m total length

  • Preview05:00
  • Preview08:13

  • Preview04:06
  • Preview02:29
  • Preview03:23

  • Downloads and Example Web Pages
    00:14
  • Markup Rules
    03:33
  • HTML Semantics
    03:46
  • Setting up your Workspace for Windows
    02:42
  • Setting up your Workspace for Macintosh
    02:48
  • Document Title
    01:08
  • Heading and Paragraph
    01:11
  • Block Quote and Break Tag
    01:36
  • HTML Comments
    01:20
  • Inline Tags
    02:28
  • HTML Lists
    02:59
  • HTML5 Entities
    01:37
  • Linking Documents
    10:27
  • Linking to Folders
    02:34
  • Four Parts of an HTML Page
    05:36
  • Build Example Site Part A
    04:36
  • Build Example Site Part B
    08:30
  • Build Example Site Part C
    02:25
  • Build Example Site Part D (INCLUDES subdomain for "sandbox")
    03:30
  • View the Completed Example Site
    00:02

  • Introduction to CSS
    06:35
  • Linking to an External Style Sheet
    02:39
  • CSS Reset
    03:26
  • Styling Built-in Selectors
    02:28
  • Styling Lists
    04:28
  • Styling Borders
    02:27
  • Setting Padding and Margin
    01:34
  • Color Theory
    05:47
  • Colors
    01:23
  • Adding a Google Font Family
    08:44
  • Navigation
    10:26
  • Build Example Site Part A
    07:39
  • Build Example Site Part B
    08:10
  • Build Example Site Part C
    05:33
  • Build Example Site Part D
    06:54
  • View the completed example site
    00:02

  • Overview of Images for the Web
    02:57
  • Web Page Speed and Images
    04:29
  • Using Photoshop to Prepare Images
    03:04
  • Using PIXLR to Prepare Images
    03:29
  • Add an Image to a Web Page
    07:38
  • Using a PNG Image
    04:03
  • Creating an Image Gallery
    06:02
  • Image Gallery Using Flexbox
    07:05
  • Build the Example Site Part A
    04:25
  • Build the Example Site Part B
    03:44
  • Build the Example Site Part C
    02:12
  • Build the Example Site Part D
    12:03
  • View the completed example site
    00:02

  • Introduction to Forms
    02:42
  • Create a Basic Form
    05:48
  • New HTML5 Input Types
    06:06
  • Creating a Fieldset
    02:03
  • Adding Radio Buttons
    03:56
  • Adding Checkboxes
    02:14
  • Adding a Textarea for Comments
    01:27
  • Implementing a Select with Dropdowns
    02:59
  • Adding Hidden Inputs
    01:51
  • Using HTML5 Required and Pattern
    05:35
  • Styling Your Form with CSS
    09:19
  • Build the Example Site part A
    03:07
  • Build the Example Site part B
    05:54
  • Build the Example Site part C
    01:31
  • Build the Example Site part D
    07:11
  • Build the Example Site part E
    12:00
  • Build the Example Site part F
    03:38
  • View the completed example site
    00:02

  • Overview of Advanced CSS
    02:24
  • Add a Gradient Image
    06:56
  • Add a Background Image
    05:38
  • Implement a CSS Gradient
    03:01
  • Add a Graphic for Lists
    04:50
  • Creating Drop Shadows
    04:29
  • Building Navigation using Media Queries
    10:03
  • Tell Phones Not to Lie
    04:11
  • Build the Example Site Part A
    05:15
  • Build the Example Site Part B
    04:57
  • Build the Example Site Part C
    07:19
  • Build the Example Site Part D
    01:00
  • View the completed example site
    00:02

  • Overview of Media
    01:09
  • Implementing iFrames
    06:57
  • Recording with Audacity
    04:04
  • Adding an Audio File
    04:30
  • Add a Table
    03:37
  • Styling a Table with CSS
    05:48
  • Link to a PDF file
    04:13
  • Build the Example Site Part A
    02:26
  • Build the Example Site Part B
    04:50
  • Build the Example Site Part C
    07:42
  • Build the Example Site Part D
    02:22
  • Build the Example Site Part E
    03:15
  • Build the Example Site Part F
    02:44
  • Build the Example Site Part G
    04:32
  • View the completed example site
    00:02

  • Web Analytics
    11:08
  • What's Next?
    00:25

Requirements

  • Students will need to download a free copy of Brackets for Macintosh OR Windows.
  • Several internet browsers to test your work
  • Students will need an FTP client. I will demonstrate Cyberduck which is FREE for Macintosh and Windows.

Description

Course Overview

This course is the equivalent of a 3 semester-hour college course on Web Design, without all the nasty tests. This course will introduce you to the basics of HTML5 markup so you can create a website with forms, images, responsive navigation, etc. Because the course does not rely on a specific WYSIWYG code editor, you will also understand what each line of HTML markup and CSS does. This is essential so that later when you start using a WYSIWYG code editor and you need to make changes, you know what is going on under the hood.

Course Materials

In addition to the video screencasts, this course includes a start file for each unit and a completed example so you can see the code in action.

Course Structure

This course contains 8 units, each of which build on the previous unit. By the end you will have a fully functional website.

Who this course is for:

  • This course is designed for beginners who want to understand what the code does and how to solve problems.

Instructor

Paul Cheney
Web Designer and Developer
Paul Cheney
  • 4.2 Instructor Rating
  • 1,684 Reviews
  • 33,773 Students
  • 9 Courses

Paul received his master's degree from Utah State University in Instructional Technology and worked as a civilian for the United States Air Force doing interactive computer-based firefighter training. He and his family then moved to Provo, Utah where he worked at Brigham Young University for five years in the Instructional Technology Center. While there, he was involved in authoring multimedia, digitizing video, training faculty in instructional technology. He then moved with his family to Buena Vista, VA where he joined the faculty at Southern Virginia University. While there he taught digital media courses. Ten years later he returned to Utah where he is now an Assistant Professor at Utah Valley University teaching courses in their Digital Media department in the Internet and Web Technologies degree.

  • Udemy for Business
  • Teach on Udemy
  • Get the app
  • About us
  • Contact us
  • Careers
  • Blog
  • Help and Support
  • Affiliate
  • Terms
  • Privacy policy
  • Cookie settings
  • Sitemap
  • Featured courses
Udemy
© 2021 Udemy, Inc.