Learn HTML And CSS by Hands-on Examples
-
Free
-
-
About Course
Start your web development journey and learn HTML and CSS with our beginner-friendly course. This course simplifies learning HTML and CSS for beginners, covering everything from basic structure to styling, enabling you to create professional, responsive websites.
Build A Website With HTML And CSS
Master the art of web design and build a website with HTML and CSS from scratch. In this course, you’ll learn the difference between HTML and CSS, understanding how they work together to create functional, well-designed websites for any project.
In this course you learn how to code in HTML and CSS to build websites. Practical skills you learn from this course are essential for becoming a web designer.
HTML and CSS Learning Objectives
In this self-paced course you will learn:
- Creating simple pages
- Marking up and formatting text
- Adding links and images
- Design elements- color, background, and page layout
- Basics of graphics
HTML and CSS Topics and Subtopics
The following outline is covered in this course:
1. Where Do I Start?
- Where Do I Start?
- What Does a Web Designer Do?
- What Languages Do I Need to Learn?
- What You’ve Learned
2. Creating a Simple Page
- A Web Page, Step by Step
- Before We Begin, Launch a Text Editor
- Step 1: Start with Content
- Step 2: Give the Document Structure
- Step 3: Identify Text Elements
- Step 4: Add an Image
- Step 5: Change the Look with a Style Sheet
- Validating Your Documents
- Element Review: Document Structure
3. Marking up Text
- Paragraphs
- Headings
- Lists
- More Content Elements
- Organizing Page Content
- The Inline Element Roundup
- Generic Elements (div and span)
- Some Special Characters
- Putting It All Together
- Element Review: Text
4. Adding Links
- The href Attribute
- Linking to Pages on the Web
- Linking Within Your Own Site
- Targeting a New Browser Window
- Mail Links
- Telephone Links
- Element Review: Links
5. Adding Images
- First, a Word on Image Formats
- The img Element
- A Window in a Window (iframe)
- Element Review: Replaced Elements
6. Basic Table Markup
- How Tables Are Used
- Minimal Table Structure
- Table Headers
- Spanning Cells
- Table Accessibility
- Wrapping Up Tables
- Element Review: Tables
7. Forms
- How Forms Work
- The form Element
- Variables and Content
- The Great Form Control Round-up
- Form Accessibility Features
- Form Layout and Design
- Element Review: Forms
8. Cascading Style Sheets Orientation
- The Benefits of CSS
- How Style Sheets Work
- The Big Concepts
- Moving Forward with CSS
9. Formatting Text
- The Font Properties
- Changing Text Color
- A Few More Selector Types
- Text Line Adjustments
- Underlines and Other “Decorations”
- Changing Capitalization
- Spaced Out
- Text Shadow
- Changing Lists Bullets and Numbers
- CSS Review: Font and Text Properties
10. Colors and Backgrounds
- Specifying Color Values
- Foreground Color
- Background Color
- Playing with Opacity
11- HTML Tables- Exercise
12- HTML Form- Exercise
13- Project 1- Build personal website
14- Project 2- Build a homepage like google.com
Requirements
None.
Related Courses
- Web Design with WordPress
- Intro to Joomla CMS
- Introduction to Drupal CMS
- Web Design with Bootstrap
- User Experience Best Practices
- Intro to Search Engine Optimization
Complete Training Bundle
If you are serious about learning web design and development, you should enroll in Coding Bootcamps school Web Design and Development Training Bundle. This bundle covers all essential and practical topics related to web development. For $290 monthly subscription, you can have access to 300+ hours of hands-on project-based training covering all courses related to web development like JavaScript, PHP, JavaScript frameworks like React or Angular and many more. Click here to learn more.
Private Tutoring Classes
To take skills you learn from this course to the next level, taking the following tutoring classes are highly recommended. It is also a great opportunity to discuss your questions and problems related to this course with an experienced instructor:
- Web design and development tutoring sessions- Weekly and monthly plans
- HTML, HTML5, CSS and CSS3- Private tutoring sessions
What Is Next?
After finishing this course, you can enroll in any of following classes:
- Tag
- CSS
- Front-end
- HTML
- Web Design
