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

Focused View

Brad Schiff

11:34:23

31 View

01 - Welcome!

001 Course Introduction.mp4

01:59

002 Big Picture Overview of Course (What To Expect).mp4

02:15

02 - HTML Essentials

001 Why HTML is Exciting.mp4

02:11

002 First Look at HTML.mp4

07:09

003 The Easiest Way to Get Started.mp4

06:44

004 Hands On! Create your First HTML File.mp4

06:42

005 Russian Stacking Dolls Bulleted Lists.mp4

04:22

006 HTML Document Structure.mp4

04:51

006 html-document-structure.zip

007 First Look at Attributes Linking Pages Together.mp4

08:16

007 attributes.zip

008 Section 1 Review.mp4

02:18

03 - Adding Media to a Web Page

001 Images.mp4

05:24

001 images.zip

002 Audio Files.mp4

05:48

002 audio.zip

003 Video Files.mp4

08:14

003 video.zip

004 Vector Graphics & Illustrations (SVG & Figma).mp4

11:01

external-links.txt

04 - Text Basics

001 Headings.mp4

03:48

001 headings.zip

002 Lists.mp4

05:47

002 lists.zip

003 Bold & Italic.mp4

07:13

003 bold-italic.zip

004 Special Characters.mp4

03:08

004 special-characters.zip

external-links.txt

05 - Semantics & Organization

001 Semantic Structural Elements.mp4

07:35

002 Navigation.mp4

04:00

002 nav.zip

003 Non-semantic Elements (div and span).mp4

05:28

004 HTML Comments.mp4

02:41

004 comments.zip

005 The Section Element.mp4

04:47

005 section.zip

external-links.txt

06 - Forms

001 Forms.mp4

08:19

001 forms-1.zip

002 Different Types of Inputs.mp4

06:21

002 forms-2.zip

003 Choosing Between a set of options.mp4

10:35

003 forms-3.zip

external-links.txt

07 - Tables

001 How to Create a Table of Data.mp4

07:18

001 table.zip

002 Do Not Use Tables for Layout.mp4

01:46

external-links.txt

08 - CSS Essentials

001 CSS Introduction.mp4

05:17

002 CSS Selectors.mp4

06:51

002 selectors.zip

003 The Cascade.mp4

10:08

004 Box Model.mp4

08:19

005 Quick Note About CSS Floats.mp4

01:37

006 Creating a Page Layout with Floats.mp4

15:34

006 floats.zip

007 Beauty School! Apply What Weve Learned.mp4

11:44

007 beauty-school.zip

external-links.txt

09 - Intermediate CSS

001 Styling Navigation Menu.mp4

08:02

001 dropdown-submenu.zip

001 sidebar-click-submenu.zip

001 style-nav-menu.zip

002 Overlapping Content & Transparent Backgrounds.mp4

15:06

002 position-relative-absolute.zip

external-links.txt

10 - Less Exciting Yet Still Necessary CSS Tasks

001 Styling Data Tables.mp4

12:46

001 table-style.zip

001 table-style-follow-along.zip

002 Styling Forms.mp4

17:20

002 form-style.zip

external-links.txt

11 - CSS Typography

001 CSS Typography.mp4

09:29

002 Using Custom Web Fonts.mp4

12:24

002 custom-fonts.zip

external-links.txt

12 - Developer Timeout!

001 Developer Tools Inspect Elements.mp4

05:43

13 - CSS Backgrounds

001 Background Images.mp4

15:12

001 background-images.zip

002 Gradient Backgrounds.mp4

05:10

002 gradients.zip

003 CSS Sprites.mp4

11:32

003 sprites.zip

004 Full Width Backgrounds - Fixed Width Content.mp4

07:00

004 full-width-backgrounds.zip

external-links.txt

14 - Responsive Web Design

001 Chapter Introduction.mp4

01:25

002 Responsive Web Design.mp4

19:55

002 responsive.zip

002 width-max-width.zip

003 Responsive Grids.mp4

19:58

003 grid.zip

003 grid-start-files.zip

004 Responsive Grid with Flexbox.mp4

02:09

004 responsive-grid-flexbox.zip

external-links.txt

15 - What is Flexbox in CSS

001 Flexbox (Part 1).mp4

18:04

002 Flexbox (Part 2).mp4

09:59

external-links.txt

16 - CSS Grid Layout

001 CSS Grid Part 1.mp4

13:53

002 CSS Grid Part 2.mp4

18:55

003 CSS Grid Part 3.mp4

07:06

external-links.txt

17 - CSS3 Special Effects

001 Box Shadows.mp4

05:55

001 box-shadow.zip

002 Rounded Corners.mp4

06:39

002 rounded-corners.zip

003 CSS Transform.mp4

12:49

003 transform.zip

004 CSS Transitions.mp4

13:08

004 transition.zip

005 CSS Animations.mp4

19:59

005 animation.zip

external-links.txt

18 - Leveraging JavaScript without Writing JavaScript

001 Chapter Introduction.mp4

02:45

002 Slideshow (Part 1).mp4

17:59

002 slideshow.zip

003 Slideshow (Part 2).mp4

09:06

003 slideshow.zip

004 Reveal & Hide Content on Click Tap.mp4

12:13

004 Show-Hide.zip

005 Open Image in Modal Window (Gallery).mp4

18:40

005 modal-image.zip

005 modal-image-start.zip

external-links.txt

19 - What is Bootstrap

001 Bootstrap (Part 1).mp4

19:20

001 bootstrap-example.zip

002 Bootstrap (Part 2).mp4

15:02

002 bootstrap-example.zip

20 - Sass

001 Getting Started With Sass.mp4

19:23

001 package.zip

002 Sass Basics.mp4

15:42

003 Sass Continued.mp4

18:37

003 sass-continued.zip

21 - Pushing a Website Live Up Onto The Web

001 Going Live using GitHub Pages.mp4

14:55

001 my-website.zip

22 - Cross Browser Compatibility

001 Cross Browser Support & Feature Detection.mp4

12:54

23 - Beyond This Course

001 Next Steps.mp4

07:36

002 Bonus Lecture.mp4

05:03

external-links.txt

Description

Want to launch a career in web design? This course will teach you HTML & CSS with no experience necessary.

What You'll 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

Who is this for?

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

What You Need to Know?

No prerequisite knowledge required

No special ($$$) software required

More details

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.
In the summer of 2020 the course has received a new section where we push our website live up onto the web using the free GitHub Pages service; this means you'll be able to share a link to what you've created with your friends, family, colleagues and the world!
I have helped over 100,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 this course is for:
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

User Reviews

Rating

average 0

Total votes0

Focused display

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.

Udemy

View courses Udemy

Students take courses primarily to improve job-related skills.Some courses generate credit toward technical certification. Udemy has made a special effort to attract corporate trainers seeking to create coursework for employees of their company.