HTML5, a markup language for the web has got its popularity due to the current internet era. CSS3, paves the way by giving good look and feel, adding animation, viewing the web pages in different devices etc. These two technologies together is a must learn language for any front end developer who wants to build websites or a wants niche career in UI technologies .

Objectives:

At the end of ‘HTML5 & CSS3 from Scratch’ training course, the participants will:

  • Build websites easily by using HTML Tags
  • Give the web pages good look and feel using CSS3.
  • Create and add animation using CSS3.
  • Build and view web pages from different devices using media queries
  •  

    What you will learn:

  • Basic and new tags of HTML5
  • New Input tags like email, number, range in HTML5
  • To add audios, videos and drawings using HTML5
  • Basic form validation
  • To use local and session storage
  • Do animation using CSS3
  • Use media queries to get output in multiple devices
  • About browser support for different tags
  •  

    Prerequisites:

  • Basic HTML and CSS knowledge
  •  

    Course Designed for:

    • Newbie’s who want to kick start a career in web designing
    • Web designers/developers, to upgrade their knowledge in HTML5 And CSS3.
    • This course together with javascript is a good start for getting into a career in front end web development.
     

    Course Content

    Introduction to HTML5

  • What is HTML5?
  • Why to use it?
  • When can it be used?
  • HTML5 Markup
  • Deprecated Elements And Attributes
  • Browser Support
  •  
    Features in HTML5

  • Doctype declaration and character encoding
  • Semantics and markup
  • New semantic tags
  • New And Updated Elements
  • Structural Elements
  • New Attributes
  • Video, Audio and codecs
  • Canvas
  • SVG
  •  
    HTML Forms

  • New Input Types
  • New Attributes
  • Setting form autofocus
  • Using placeholder data
  • Marking required fields
  • Working with number inputs
  • Using date picker
  • Form Validation
  • Browser Support
  • Data Storage

  • Problems With The Existing Cookie-based Model
  • Hacks Prior To HTML5
  • New Storage Options
  • Web Storage
  • Local Storage
  • SessionStorage
  • Browser Support
  •  
    HTML5 Messaging APIs

  • Cross-document Messaging
  • XML Http Request Level 2
  • Cross-document XML Http Request
  • Progress Events
  • Server-sent Event
  • Browser Support
  •  
    HTML5 Web Sockets

  • Overview Of Web Communication Options
  • Overview Of Web Sockets API And Protocol
  • Introduction to CSS3

  • CSS selectors
  • Rounded corners
  • Text shadows
  • Box shadows
  • Multi columns
  •  
    Gradients and Multiple Backgrounds

  • Linear gradients
  • Radial Gradients
  • Repeating gradients
  • Multiple background images
  • Background size
  • Transformations and Transitions

  • Transformations: translate, scale, rotate
  • Transitions: property, duration, timing,
  • Animation
  •  
    Media Queries

  • Targeting multiple devices
  • Targeting different screen sizes
  • Project Work

  • Creating a static website using all the concepts learnt