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 Emotional Intelligence 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 Modeling Data Analysis Big Data
Business Fundamentals Entrepreneurship Fundamentals Business Strategy Online Business Business Plan Startup Blogging Freelancing 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
Development Web Development CSS

Learn Web Designing & HTML5/CSS3 Essentials in 4-Hours

Convert Photoshop Designs into Stunning HTML5 & CSS3 websites with confidence. Absolutely no prior experience necessary!
Rating: 4.2 out of 54.2 (1,130 ratings)
46,925 students
Created by Brad Hussey, Code College
Last updated 3/2016
English
English
30-Day Money-Back Guarantee

What you'll learn

  • In this course, you will learn how to slice up a Photoshop mockup and hand-code valid HTML5 & CSS3
  • By the end of the course, you will be able to turn a PSD into a beautiful, usable, and valid HTML5 & CSS3 website
Curated for the Udemy for Business collection

Course content

8 sections • 24 lectures • 4h 11m total length

  • Preview00:23

  • Preview00:19
  • What you need to start
    02:14
  • Preview00:56
  • Code Chunks
    00:50

  • Becoming Familiar with the Layout
    00:49
  • Preview20:14
  • Photoshop Pop Quiz!
    3 questions

  • Coding an HTML5 Skeleton
    13:50
  • Coding the "Header"
    11:57
  • Coding the "Content Section"
    13:43
  • Coding the "Footer"
    06:51
  • HTML5 Pop Quiz!
    4 questions

  • Adding a Stylesheet to your Website
    03:19
  • Normalize vs. Reset: What is the difference?
    04:05
  • Global Styles & Typography
    20:15
  • Layout: Styling the Navigation Bar
    25:41
  • Layout: Styling the Header
    27:25
  • Layout: Styling the "Content Section" — Part I
    15:55
  • Layout: Styling the "Content Section" — Part II
    16:48
  • Layout: Styling the Footer
    26:13
  • CSS3 Pop Quiz!
    3 questions

  • Validating your HTML5
    03:33
  • Validating your CSS3
    12:22
  • Validation Pop Quiz!
    3 questions

  • Review
    02:03

  • Preview13:35
  • How to Code a CSS Sticky Footer
    08:11

Requirements

  • Adobe Photoshop CS3 or higher
  • Very basic knowledge of HTML & CSS
  • Text Editor (TextWranger, Espresso, or Coda recommended)

Description

** Course Updated November 26th, 2014! **
New lecture added: Code a CSS Sticky Footer

- - -

The Best Way to Learn HTML5 & CSS3

PSD to HTML5/CSS3 is a simple course that will teach you to take a Photoshop Mockup Design and hand-code it into a beautiful, semantic, valid HTML5 & CSS3 website.

Start Speaking the Language Right Away

Just like learning a human language, the best way of learning is by speaking from day 1—this course is similar in the sense that we'll begin speaking HTML5 & CSS3 right away!

I believe this is the best way to learn HTML5 and CSS3.

It's simple. It's easy. You can do it!

If you’ve always wanted to know how to build your own website, or have wanted a simple and comprehensive way to dive into PSD to HTML5 & CSS3, this course is definitely for you.

Real World Example

One of my students, who had no previous web design experience, took my course and ran with the skills he acquired. He built a brand new website for his Barbershop in Vancouver!

So, what are you waiting for?

Do you want to hand-code your first website in 4-hours? Let's do this!

Who this course is for:

  • This course is intended for beginners who have minimal knowledge or experience in Photoshop, and coding HTML & CSS
  • A very basic understanding of HTML, CSS, and Photoshop is recommended
  • First year web design students can greatly benefit from this course!

Instructors

Brad Hussey
Marketing Consultant at FreelancingFreedom.com
Brad Hussey
  • 4.5 Instructor Rating
  • 51,519 Reviews
  • 505,334 Students
  • 11 Courses

A highly skilled professional, Brad Hussey is a passionate and experienced freelancing web designer, developer, blogger and digital entrepreneur. Hailing from North Of The Wall (Yellowknife, Canada), Brad made the trek to the Wet Coast (Vancouver, Canada) to educate and equip himself with the necessary skills to become a spearhead in his trade of solving problems on the web, crafting design solutions, and speaking in code. 

Brad's determination and love for what he does has landed him in some pretty interesting places with some neat people. He's had the privilege of working with, and providing solutions for, numerous businesses, big & small, across the Americas. 

Brad builds custom websites, and provides design solutions for a wide-array of clientele at his company, Brightside Studios. He regularly blogs about passive income, living your life to the fullest, and provides premium quality web design tutorials and courses for tens of thousands of amazing people desiring to master the craft. 

500,000+ Students Don't Lie 

Join Brad and adventure into his world of web design, web development, and speaking in code. You won't regret it! 

What are people saying about Brad? 

"[Brad is] the BEST coding instructor on the planet. Brad has a passion for teaching and he does it with joy. He pours his heart into his lessons and makes you feel at ease. It's just like having your best buddy having a chat with you - only this time, you are learning valuable skills. He's the type of guy who is passionate about transforming people's lives through his lessons. He's not after the money. He truly wants you to succeed. Three hearty cheers to Brad - the best coding instructor on planet Earth."

— Cicero, Brad's student

"...These videos are well created, concise, fast-paced, easy to follow, and just funny enough to keep you chuckling as you're slamming out lines of code. I've taken 3 courses from this instructor. Whenever I have questions he is right there with a simple solution or a helpful suggestion to keep me going forward with the course work."

— Brennan, Brad's student

"...Brad is amazing and I honestly think he's the best tutor of all the courses I have taken on Udemy. Will definitely be following him in the future. Thanks Brad!"

— Brad's student

"...Brad has an infectious enthusiasm, a great eye for detail, and expert-level knowledge of the material."

— Brad's student

Code College
The Best Coding Courses on the Web
Code College
  • 4.5 Instructor Rating
  • 34,877 Reviews
  • 435,254 Students
  • 8 Courses

Code College is an online school that provides high quality learning material, courses, and training videos for students looking to learn web design, web development, marketing, online business, and more!

Founded in 2014 by Canadian entrepreneur, successful instructor, and blogger, Brad Hussey, Code College is a growing network of highly skilled instructors who provide the best quality tutorials, courses and learning material on the web.

  • 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.