Social Share
featured

Html5 & CSS

3 Curriculum
( 2 Reviews )

Importance of Web Design

  • Lesson 1. Why Learn Web Design?
  • Lesson 2. Scope of Web Design
  • Lesson 3. Usability
  • Lesson 4. Web Standards and its benefits
  • Lesson 5. How Web pages work
  • Lesson 6. What is the Internet
  • Lesson 7. What is a Domain
  • Lesson 8. What is Hosting
  • Lesson 9. Who are Hosting Service providers
  • Lesson 10. Web page content
  • Lesson 11. History of the Internet

Planning Process

  • Lesson 1. Planning
  • Lesson 2. Wireframing
  • Lesson 3. Storyboarding
  • Lesson 4. Information Architecture
  • Lesson 5. UX design considerations

Web design tools

  • Lesson 1. Text editors
  • Lesson 2. Visual editors
  • Lesson 3. Root folders

Defining HTML5

  • Lesson 1. History and overview

Key features

  • Lesson 1. New markup and elements (header, footer, nav elements)
  • Lesson 2. Form Elements
  • Lesson 3. Video and Audio tags
  • Lesson 4. Canvas Element
  • Lesson 5. Styling with CSS3
  • Lesson 6. Other aspects (Geolocation, Offline support, Web Forms)
  • Lesson 7. HTML5 Examples
  • Lesson 8. HTML5 and web browsers, the roadmap

HTML5 Markup

  • Lesson 1. Using the HTML5 Doctype and character encoding
  • Lesson 2. Using the <header> element
  • Lesson 3. Using the <nav> element
  • Lesson 4. Understanding the <article> element
  • Lesson 5. Working with <section> element
  • Lesson 6. Working with dates and caption
  • Lesson 7. Understanding the Role attribute

Creating HTML5 Forms

  • Lesson 1. Working with new input types
  • Lesson 2. URL
  • Lesson 3. Range and number
  • Lesson 4. Search Field
  • Lesson 5. Date Pickers
  • Lesson 6. Placeholder text
  • Lesson 7. Autofocus
  • Lesson 8. HTML 4 fallbacks for forms

Working with the video and audio tags

  • Lesson 1. Video basics (Codecs and browser support)
  • Lesson 2. Working with the video element
  • Lesson 3. Video attributes (autoplay, preloading, looping)
  • Lesson 4. Using the audio element
  • Lesson 5. Audio MIME types and fallbacks
  • Lesson 6. Improving Accessibility

Working with the Canvas element

  • Lesson 1. The role (and limitations) of the canvas element
  • Lesson 2. Creating fallbacks (browser support)
  • Lesson 3. Understanding the coordinate system
  • Lesson 4. Paths
  • Lesson 5. Fills and Strokes
  • Lesson 6. Text
  • Lesson 7. Images
  • Lesson 8. Transforms
  • Lesson 9. Compositing
  • Lesson 10. A Drawing Loop
  • Lesson 11. Adding Interactivity
  • Lesson 12. PNG-based sprite animation

Styling HTML5 elements

  • Lesson 1. Working with CSS
  • Lesson 2. Styling with CSS 2 versus CSS 3 features
  • Lesson 3. Browser support and testing
  • Lesson 4. Borders
  • Lesson 5. Backgrounds
  • Lesson 6. Colors
  • Lesson 7. Text Effects
  • Lesson 8. Sizing and Positioning
  • Lesson 9. Selectors
  • Lesson 10. Web fonts

HTML5 Applications and Interactivity

  • Lesson 1. Understanding HTML5 is offline capabilities
  • Lesson 2. HTML Storage
  • Lesson 3. Working with the revised JavaScript API
  • Lesson 4. Geolocation API
  • Lesson 5. Web Sockets

CSS Training Course: overview of course content

  • Lesson 1. Fundamentals of CSS
  • Lesson 2. Advantages of Using CSS
  • Lesson 3. How to Write CSS
  • Lesson 4. Your First CSS-Enabled Document

Understanding CSS Anatomy

  • Lesson 1. Rules
  • Lesson 2. Selectors
  • Lesson 3. Declarations
  • Lesson 4. Values
  • Lesson 5. Keywords
  • Lesson 6. Strings
  • Lesson 7. Length and Measurement
  • Lesson 8. Number
  • Lesson 9. Colors
  • Lesson 10. Including CSS in a Document
  • Lesson 11. Including an Embedded Style Sheet
  • Lesson 12. Linking to External Style Sheets
  • Lesson 13. The Importance of Good HTML
  • Lesson 14. Doctypes and Quirks Mode

Understanding CSS Selectors

  • Lesson 1. Class and ID Selectors
  • Lesson 2. Class Selectors
  • Lesson 3. ID Selectors
  • Lesson 4. The Universal Selector
  • Lesson 5. Descendant Selectors
  • Lesson 6. Pseudo-Classes 5
  • Lesson 7. Dynamic Pseudo-Classes

Working with CSS: Cascading and Inheritance

  • Lesson 1. The Cascade in Cascading Style Sheets (CSS)
  • Lesson 2. The Specificity of a Selector
  • Lesson 3. Important Rules
  • Lesson 4. Inheritance

Styling Text with CSS

  • Lesson 1. Setting Font Faces
  • Lesson 2. Font Families
  • Lesson 3. Italic Text
  • Lesson 4. Bold Text
  • Lesson 5. Small Caps Text
  • Lesson 6. The font-size Property
  • Lesson 7. Absolute Font Sizes
  • Lesson 8. Relative Font Sizes
  • Lesson 9. Length and Percentage Font Sizes
  • Lesson 10. The font Shorthand Property
  • Lesson 11. The font Properties
  • Lesson 12. Line Height
  • Lesson 13. Controlling Spacing between Letters
  • Lesson 14. Controlling Spacing between Words
  • Lesson 15. Indenting Text
  • Lesson 16. Horizontally Aligning Text
  • Lesson 17. Decorating Text
  • Lesson 18. Transforming CASE
  • Lesson 19. Controlling White Space

Styling backgrounds using CSS

  • Lesson 1. Background Colors
  • Lesson 2. Background Images
  • Lesson 3. How Background Images Repeat
  • Lesson 4. Positioning Background Images
  • Lesson 5. Mixing Background Position Valuest
  • Lesson 6. Controlling Position
  • Lesson 7. Using the Center Keywords
  • Lesson 8. Fixing a Background Image in Place
  • Lesson 9. Background Shorthand

Using CSS to Position Content

  • Lesson 1. Margins
  • Lesson 2. Margins with multiple values
  • Lesson 3. Margin Collapsing
  • Lesson 4. Horizontally Aligning Elements
  • Lesson 5. border-width
  • Lesson 6. border-style
  • Lesson 7. border-color
  • Lesson 8. Border Shorthand Properties
  • Lesson 9. Padding
  • Lesson 10. Setting Dimensions
  • Lesson 11. width
  • Lesson 12. height
  • Lesson 13. auto Values for width and height
  • Lesson 14. Percentage Measurements
  • Lesson 15. Quirks Mode in Internet Explorer
  • Lesson 16. Minimum and Maximum Dimensions
  • Lesson 17. Overflowing Content
  • Lesson 18. Floating Content
  • Lesson 19. Floating Box Model
  • Lesson 20. Canceling Floated Content
  • Lesson 21. Float Bugs in IE 6
  • Lesson 22. Vertically Aligning Content
  • Lesson 23. Subscript and Superscript Text
  • Lesson 24. The top, middle, and bottom Keywords
  • Lesson 25. Percentage and Length Value
  • Lesson 26. Vertically Aligning Table Content
  • Lesson 27. Absolute Positioning
  • Lesson 28. Relative Positioning
  • Lesson 29. Fixed Positioning
  • Lesson 30. The z-axis and the z-index Property
  • Lesson 31. Addressing IE version specific problems

Creating Complete Layouts with CSS and HTML

  • Lesson 1. Creating the Page with HTML
  • Lesson 2. Styling Text and Custom Fonts
  • Lesson 3. Building the Layout
  • Lesson 4. Gradient Backgrounds

Responsive Web Design Overview

  • Lesson 1. Foundations of Responsive Design
  • Lesson 2. Defining Responsive Web Design
  • Lesson 3. The User Experience Challenges of a Responsive Design

Creating the Basic Structure of a Responsive Web Design

  • Lesson 1. Using HTML5 for Structure
  • Lesson 2. Styling with Web Fonts
  • Lesson 3. Styling Text with Ems
  • Lesson 4. Defining the Basic Text Styles
  • Lesson 5. Styling a Single-Column Layout for a Responsive Layout
  • Lesson 6. Working with the CSS3 Text-Shadow Property
  • Lesson 7. Working with CSS3 Selectors
  • Lesson 8. Adding Responsive Images

Navigation for a Responsive Design

  • Lesson 1. An Overview of Mobile Navigation
  • Lesson 2. Introduction to Media Queries
  • Lesson 3. Adding a Toggle Menu

Media Queries and Responsive Layout

  • Lesson 1. Adding Styles for a Desktop Layout

Optimizing Responsive Designs

  • Lesson 1. Adding Mobile and Older Browser Support
  • Lesson 2. Testing your Responsive Design
  • Lesson 3. Improving Page Performance

Introduction to Bootstrap (Bonus)

  • Lesson 1. What is Bootstrap?
  • Lesson 2. Adding the Bootstrap and Jquery library
  • Lesson 3. Integrating Bootstrap and Jquery
  • Lesson 4. Using the grid design pattern
  • Lesson 5. Using Bootstrap's custom classes
  • Lesson 6. Using Bootstrap's typography
  • Lesson 7. Using Glyphicon icons
  • Lesson 8. Using Styled Buttons

HTML5 and CSS3 Introduction

HTML5 and CSS3 are two of the most popular and powerful technologies for creating modern and attractive web pages. HTML5 is the latest version of the HyperText Markup Language, which defines the structure and content of a web page. CSS3 is the latest version of the Cascading Style Sheets, which describes the style and layout of a web page. Together, HTML5 and CSS3 enable web developers and designers to create web pages that are responsive, interactive, and accessible. HTML5 introduces new features and elements that make web development easier and more efficient. Some of the new features of HTML5 are: - Semantic elements that provide more meaningful and clear structure to a web page, such as `<header>`, `<footer>`, `<article>`, `<section>`, and `<nav>`. - Multimedia elements that allow embedding audio and video content without using external plugins, such as `<audio>` and `<video>`. - Graphics elements that enable drawing and rendering graphics on the web, such as `<canvas>` and `<svg>`. - Form elements that support new input types and attributes. - Application elements that enable creating web applications that can work offline and store data locally, such as `<appcache>`, `<localStorage>`, and `<webSocket>`. CSS3 introduces new features and properties that make web design more flexible and creative. Some of the new features of CSS3 are: -Selectors that allow targeting specific elements based on their attributes, pseudo-classes, and pseudo-elements, such as `[attribute=value]`, `:nth-child(n)`, and `::before`. -Box model that defines how the size and spacing of elements are calculated, such as `box-sizing`, `margin`, `padding`, and `border`. -Layout modules that provide different ways of arranging and aligning elements on the web, such as `display`, `position`, `float`, `flexbox`, and `grid`. -Typography properties that control the appearance and behavior of text on the web, such as `font-family`, `font-size`, `font-weight`, `text-align`, and `text-shadow`. -Visual effects that enhance the look and feel of elements on the web, such as `background-image`, `border-radius`, `box-shadow`, `transform`, and `transition`. HTML5 and CSS3 are the essential tools for creating web pages that are compatible with different browsers, devices, and screen sizes. By learning HTML5 and CSS3, you can build web pages that are dynamic, engaging, and user-friendly..

Why Learn HTML5 and CSS3

HTML5 and CSS3 are the essential building blocks of the web. By learning HTML5 and CSS3, you wll be able to create any type of website you can imagine. Whether you want to build a blog, a portfolio, or an e-commerce website, HTML5 and CSS3 are the skills you need. HTML5 provides the structure and content of a webpage, while CSS3 defines its style and appearance. HTML5 allows you to add features and multimedia to your webpages without needing extra plugins or technologies. CSS3 enables you to create responsive and interactive webpages with various layouts, fonts, colors, and animations. Some of the benefits of learning HTML5 and CSS3 are: You can create webpages that are compatible with different devices, platforms, and browsers. You can enhance the user experience and engagement of your webpages with dynamic and interactive elements. You can improve the performance and accessibility of your webpages with semantic and clean code. You can boost your career prospects and opportunities as a web developer or designer.

Review

Average Rating
4
Details
  • 1 Star
    0
  • 2 Star
    0
  • 3 Star
    0
  • 4 Star
    2
  • 1 Star
    0

Comments ( 2 )

  • Ram MNovember 1, 2017

    Cras porttitor sed diam
    Vestibulum a mauris orci. Sed eros enim, euismod at eros ac, vestibulum volutpat tortor. Suspendisse neque dui, rutrum congue ligula ut, semper pulvinar diam.


  • Andre DubusNovember 1, 2017

    Maecenas euismod mi ac risus faucibus
    Suspendisse vitae iaculis purus, non malesuada odio. Nunc nec interdum est, vel porta lacus. Praesent leo magna, lacinia non arcu eget, pulvinar tristique sapien. Etiam eget urna eget magna sollicitudin molestie. Praesent vitae libero ligula. Suspendisse ut tortor nulla. Nunc a bibendum nibh. Etiam ornare scelerisque velit sed egestas.

  • Ram MNovember 1, 2017

    Cras porttitor sed diam
    Vestibulum a mauris orci. Sed eros enim, euismod at eros ac, vestibulum volutpat tortor. Suspendisse neque dui, rutrum congue ligula ut, semper pulvinar diam.