Create Websites Using Notepad: HTML 5 and CSS core knowledge
Learn how to build websites with this starter course. It teaches the basic structural language to create websites. The course is a first step to web development. It includes both HTML5 and CSS.
The video lectures are short, clear, and impactful. This is ideal for people who are absolute beginners and are starting out.
The course is about 3 hours long and can easily be digested in a short period of time, giving you a jump start to your web development journey.
90% of core fundamental knowledge is presented, and a path to improve as a web developer is also presented!
There are at least 30 lectures that exist.
Get started on your web development journey today!!
Requirements:
- 0 or absolutely No knowledge of programming experience.
- Notepad only or even a HTML editor on a mobile device (no heavyweight software or downloads)
- A modern web browser like chrome, Firefox, Microsoft edge etc.
What you will learn:
- HTML Fundamentals
- Explain the role of HTML in web development and how browsers render HTML pages.
- Create valid HTML5 documents using the <!DOCTYPE>, <html>, <head>, and <body> structure.
- Apply semantic HTML5 tags (<header>, <nav>, <section>, <footer>, etc.) for accessible, SEO-friendly layouts.
- Use text-formatting tags (<h1>-<h6>, <p>, <strong>, <em>, <br>, <hr>).
- Implement escape characters (e.g., , <) for special symbols.
- Create ordered (<ol>), unordered (<ul>), and definition (<dl>) lists.
- Insert images (<img>) with attributes (alt, width, height) and hyperlinks (<a>) to internal/external pages.
- Embed audio (<audio>) and video (<video>) with controls.
- Design tables (<table>, <tr>, <td>, <th>) and apply basic styling (borders, alignment).
- Integrate third-party content (e.g., maps, videos) using <iframe>.
- Build forms (<form>, <input>, <textarea>, <select>) with input types (text, email, radio, checkbox).
- Use <meta> tags for character sets, viewports, and descriptions.
- Style elements inline (e.g., style="color: red") for simple visual adjustments.
- Plan next steps: Outline pathways to advance skills (e.g., CSS, JavaScript, Front End libraries).
- CSS Fundamentals
- Understand the role of CSS in web design and how it styles HTML elements.
- Apply CSS using inline styles, <style> tags, and external stylesheets for flexibility.
- Target elements effectively with classes, IDs, and descendant selectors.
- Control typography with font-family, font-styling (bold, italic), and text-align.
- Master web colors (hex, RGB, keywords) for consistent designs.
- Structure pages with the box model (margin, padding, borders) and understand block vs. inline elements.
- Create fluid layouts with the float property and modern alternatives.
- Precisely position elements using relative, absolute, and z-index for layered designs.
- Add depth with box-shadow and customize backgrounds using background-image.
- Handle content overflow gracefully with the overflow property.
- Use absolute (px) and relative units (em, rem, %) for responsive designs.
- Style interactive states with pseudo-classes (:hover, :focus).
- Write clean, maintainable CSS with inheritance and specificity best practices.
- Plan next steps: Transition to CSS frameworks (Bootstrap) or preprocessors (Sass).