Build an HTML and CSS Website From Scratch
Jonathan Grover, Developer / Designer / Creative Technologist
-
-
1. Trailer
1:03 -
2. Web Fundamentals
10:30 -
3. Getting Started
2:17 -
4. Document Structure
16:35 -
5. Text Formatting
24:13 -
6. Images
12:37 -
7. Links
22:00 -
8. Validating HTML
6:29 -
9. Site Publishing
14:01 -
10. Introducing Tables, Forms, & Iframes
19:27 -
11. Tables
10:14 -
12. Iframes
4:47 -
13. Forms
8:31 -
14. Video
11:01 -
15. Prep for HTML5
10:40 -
16. HTML5 Semantic Elements
13:19 -
17. Metadata
4:14 -
18. Styling the Front-end
10:05 -
19. Setting up an External Style Sheet
4:23 -
20. Type Selector
14:28 -
21. Color Systems
15:11 -
22. Font Shorthand
2:46 -
23. Web Fonts
6:36 -
24. Class Selector
7:52 -
25. ID Selector
8:47 -
26. Descendant Selector
6:58 -
27. Psuedo Selector
14:54 -
28. Developer Tools (part 1)
11:51 -
29. Element Display
9:39 -
30. Box Model
38:08 -
31. Box Aesthetics
17:51 -
32. Floating
37:08 -
33. Prep Layout
8:26 -
34. Applying Box Properties
6:43 -
35. Styling Tables
6:44 -
36. Styling Forms
6:29 -
37. Styling Iframe
1:43 -
38. Centering Content
4:30 -
39. Applying Box Shadow
3:28 -
40. Applying Gradients
4:07 -
41. Styling the Logo
3:27 -
42. Styling Main Sections
6:32 -
43. Styling Details Section
1:45 -
44. Creating Column Structure
26:48 -
45. Developer Tools (part 2)
6:49 -
46. Positioning Techniques
11:01 -
47. Z-Index Layering
4:51 -
48. Sprite Rollovers
4:51 -
49. Styling Navigation
16:17 -
50. Styling the Social Media Bar
16:55 -
51. Responsive Layout Techniques
12:31 -
52. Setting Up Local Responsive Testing
11:47 -
53. Prep HTML for Responsive Layout
8:48 -
54. Applying CSS3 Media Queries
40:31 -
55. Adding PHP Mailer Script
16:16 -
56. Resets, Grid Systems, & Templates
10:11
-
About This Class
This class is perfect for anyone with a great website idea or just an interest in learning how to code. This is a beginner-level class so if you have basic computer literacy and an internet connection, you're all set. Learn at your own pace.Â
You'll leave this class with the skills to create your very own stylish, professional, and responsive website.
What You Will Learn
- HTML and Web Fundamentals. You'll start with text editing basics, headings, images and linking between pages.
- Tables, Forms, and Iframes. After learning the essentials you'll learn how to add more elements like tables, forms, and Iframes to your pages.
- HTML5 Elements. You'll add HTML 5 semantic containers, metadata, and media to your pages.
- CSS Fundamentals. You'll use CSS to create a style sheet that will allow you to fluidly change your pages contents.
- Building Page Layouts. You'll build with columns and utilize the box model.
- Positioning and Sprites. You'll use z-index and sprites to creat advanced layout features.Â
- Responsive Layout. You'll create responsive site design that allows your site to alter its style and content positioning based on the size of the device it is being viewed on.
What You'll Make
Spread throughout the course are Code Challenges. Code Challenges are opportunities for you to put what you've learned to practice by coding on your own. A continuous project will be built out of the code challenges adding more to your site project with each challenge.
Handouts and Resources
You will be provided with extensive handouts and suggested reference materials to continue your learning even after the course.
More courses from this instructor at: