Search
START TYPING AND PRESS ENTER TO SEARCH

Introduction to HTML and CSS - Ratio

/ 0 comment
Introduction to HTML and CSS

Introduction to HTML and CSS

SKU: INTRODUCTION-TO-HTML-AND-CSS Category:

Description

Description

This course serves as a quick HTML and CSS primer for students who need basic knowledge of these technologies. By learning the fundamentals of these languages, students will have a better understanding of how modern websites are built. The course covers various topics, including the basics of HTML, CSS syntax and selectors, typography, colors, and text properties. Throughout the course, students will engage in hands-on exercises to reinforce their learning and gain practical experience.

This course can be useful for project managers and other people who work with web developers who would benefit from having a better understanding of how websites are built. It can also serve as an entry-level course for new web developers.

Training Objectives

  • Strong foundation: The course lays a solid foundation in HTML and CSS enabling students to build more complex web pages and applications in the future.
  • Accessibility: Students will learn best practices for creating accessible websites ensuring that their web content is usable by a wide range of users including those with disabilities.
  • Visual appeal: Understanding CSS allows students to create visually appealing websites with customized designs enhancing user experience and engagement.
  • Hands-on experience: The course includes practical exercises that enable students to apply their knowledge in real-world scenarios preparing them for future web development projects.

Course Outline

  • Outline<br />
  • A Quick Overview of Web Development<br />
  • Client-side Programming<br />
  • HTML<br />
  • Cascading Style Sheets<br />
  • JavaScript<br />
  • Ajax<br />
  • JavaScript Frameworks<br />
  • Server-side Programming<br />
  • Java EE<br />
  • ASP.NET<br />
  • Python<br />
  • PHP<br />
  • ColdFusion<br />
  • Node.js<br />
  • Introduction to HTML<br />
  • Getting Started<br />
  • Exercise: A Simple HTML Document<br />
  • The HTML Skeleton<br />
  • The <head> Element<br />
  • The <body> Element<br />
  • Whitespace<br />
  • Viewing Page Source<br />
  • HTML Elements<br />
  • Attributes<br />
  • Empty vs. Container Tags<br />
  • Blocks and Inline Elements<br />
  • Comments<br />
  • Special Characters<br />
  • History of HTML<br />
  • lang Attribute<br />
  • Paragraphs, Headings, and Text<br />
  • Paragraphs<br />
  • Breaks and Horizontal Rules<br />
  • Exercise: Creating an HTML Page<br />
  • Quoted Text<br />
  • Preformatted Text<br />
  • Text-Level Semantic Elements<br />
  • HTML Links<br />
  • Text Links<br />
  • Absolute vs. Relative Paths<br />
  • Absolute Paths<br />
  • Relative Paths<br />
  • Default Pages<br />
  • Targeting New Windows<br />
  • Email Links<br />
  • Exercise: Adding Links<br />
  • Targeting a Specific Location on the Page<br />
  • The title Attribute<br />
  • HTML Images<br />
  • Inserting Images<br />
  • Making Images Accessible<br />
  • Alternative Text<br />
  • Long Descriptions<br />
  • Height and Width Attributes<br />
  • Image Links<br />
  • Exercise: Adding Images to the Page<br />
  • HTML Lists<br />
  • Unordered Lists<br />
  • Nesting Unordered Lists<br />
  • Ordered Lists<br />
  • Nesting Ordered Lists<br />
  • The type Attribute<br />
  • The start Attribute<br />
  • Definition Lists<br />
  • Exercise: Creating Lists<br />
  • Crash Course in CSS<br />
  • Benefits of Cascading Style Sheets<br />
  • CSS Rules<br />
  • CSS Comments<br />
  • Selectors<br />
  • Type Selectors<br />
  • Class Selectors<br />
  • ID Selectors<br />
  • Attribute Selectors<br />
  • The Universal Selector<br />
  • Grouping<br />
  • Combinators<br />
  • Descendant Combinators<br />
  • Child Combinators<br />
  • General Sibling Combinators<br />
  • Adjacent Sibling Combinators<br />
  • Precedence of Selectors<br />
  • How Browsers Style Pages<br />
  • CSS Resets<br />
  • CSS Normalizers<br />
  • External Stylesheets, Embedded Stylesheets, and Inline Styles<br />
  • External Stylesheets<br />
  • Embedded Stylesheets<br />
  • Inline Styles<br />
  • Exercise: Creating an External Stylesheet<br />
  • Exercise: Creating an Embedded Stylesheet<br />
  • Exercise: Adding Inline Styles<
  • <div> and <span><br />
  • Exercise: Divs and Spans<br />
  • Media Types<br />
  • Units of Measurement<br />
  • Absolute vs. Relative Units<br />
  • Pixels<br />
  • Ems and Rems<br />
  • Percentages<br />
  • Other Units<br />
  • Inheritance<br />
  • The inherit Value<br />
  • CSS Fonts<br />
  • font-family<br />
  • Specifying by Font Name<br />
  • Specifying Font by Category<br />
  • @font-face<br />
  • Getting Fonts<br />
  • font-size<br />
  • Relative font-size Terms<br />
  • Best Practices<br />
  • font-style<br />
  • font-variant<br />
  • font-weight<br />
  • line-height<br />
  • font<br />
  • Exercise: Styling Fonts<br />
  • Color and Opacity<br />
  • About Color and Opacity<br />
  • Color and Opacity Values<br />
  • Color Keywords<br />
  • RGB Hexadecimal Notation<br />
  • RGB Functional Notation<br />
  • HSL Functional Notation<br />
  • color<br />
  • opacity<br />
  • Exercise: Adding Color and Opacity to Text<br />
  • CSS Text<br />
  • letter-spacing<br />
  • text-align<br />
  • text-decoration<br />
  • text-indent<br />
  • text-shadow<br />
  • text-transform<br />
  • white-space<br />
  • word-break<br />
  • word-spacing<br />
  • Exercise: Text Properties

Have a Question About This Course?




    Related products