Responsive Web Design

  1. Foundational HTML and CSS for Responsive Design
    1. Semantic HTML5 Structure
      1. Importance of Semantic Elements
        1. Document Outline and Hierarchy
          1. Common Semantic Elements
            1. Header Element
              1. Main Element
                1. Section Element
                  1. Article Element
                    1. Aside Element
                      1. Figure and Figcaption Elements
                      2. Accessibility Benefits
                        1. SEO Advantages
                        2. The Viewport Meta Tag
                          1. Purpose and Function
                            1. Essential Attributes
                              1. Width Property
                                1. Initial Scale Property
                                  1. Maximum Scale Property
                                    1. Minimum Scale Property
                                      1. User Scalable Property
                                      2. Impact on Layout Rendering
                                        1. Common Implementation Patterns
                                        2. CSS Box Model Fundamentals
                                          1. Box Model Components
                                            1. Content Area
                                              1. Padding Area
                                                1. Border Area
                                                  1. Margin Area
                                                  2. Box Sizing Property
                                                    1. Content Box Model
                                                      1. Border Box Model
                                                        1. Inheritance Considerations
                                                        2. Box Model in Responsive Context
                                                        3. CSS Units for Flexibility
                                                          1. Absolute Units
                                                            1. Pixels
                                                              1. Points
                                                                1. Inches and Centimeters
                                                                2. Relative Units
                                                                  1. Percentages
                                                                    1. Em Units
                                                                      1. Rem Units
                                                                        1. Viewport Units
                                                                          1. Viewport Width
                                                                            1. Viewport Height
                                                                              1. Viewport Minimum
                                                                                1. Viewport Maximum
                                                                                2. Character Units
                                                                                3. Unit Selection Strategy
                                                                                  1. Performance Considerations

                                                                                Previous

                                                                                1. Introduction to Responsive Web Design

                                                                                Go to top

                                                                                Next

                                                                                3. Building Flexible Layouts