Description

This training will teach you how to create web pages and applications using HTML5 and CSS3. You will discover the advances offered by HTML5, particularly in terms of rich Web interfaces/RIA, multimedia and means of communication allowing the implementation of attractive client/server applications.

Who is this training for ?

For whom ?

Web developers and project managers.

Prerequisites

Training objectives

Design and develop Web applications in HTML 5 and CSS 3 Implement and validate the HTML 5 structure of Web pages Dress up Web pages in CSS 3 to make them more attractive Make the Web pages of a site responsive Integrate animations and multimedia content

Training program

• Reminders
  • - Reminders about HTML versions (HTML 4, XHTML 1.
  • - x, XHTML 2).
  • - DTDs: strict, transitional, frameset.
  • - The different components of an HTML document: titles, paragraphs, links, tables, forms.
  • - Comments.
  • - The composite structure of an HTML document: images , CSS style sheets, JavaScript, Flash.
  • - The document model (DOM).
  • - The HTTP protocol.
  • - HTTP client/server interaction.
  • - Interpretation of HTML by the browser.
  • - Position of browsers regarding HTML technologies.
• Introduction au HTML 5

  - n'as pas encore du programme

• New structure
  • - The traditional elements structuring an HTML 5 document (doctype, html, head, body, meta.
  • - ).
  • - The
  • - The
    element and the setting up of content blocks.
  • - The
    element and the setting setting up content independent of the document.
  • - The
  • - The
    and < elements footer> and the establishment of introductory and concluding sections of a block.
  • - Other structure tags.
  • - New content categories: Metadata content, Flow content, Sectioning content, Heading content.
  • - New content categories: Phrasing content, Embedded content, Interactive content.
  • - Page validation with the official W3C validator.
  • - Interest of its new structure tags.
  • - Nesting and content type.
  • - Practical work Setting up and validating the structure of a document HTML 5.
• New HTML tags

  - n'as pas encore du programme

• CSS 3 selectors
  • - Reminder about syntax: selectors, rules.
  • - Nth-child(even) repetition selectors.
  • - Target selectors target.
  • - Previous sibling selectors ~.
  • - Only-child selectors.
  • - Media Queries for conditional loading of CSS based on device resolution or orientation.
  • - Creation of layout with flexbox (organization of elements according to a grid).
  • - Practical work Integration of CSS 3 into Web applications.
  • - Selecting elements from an HTML 5 page.
• Text colors and formatting
  • - Reminder about rgb and rgba declarations.
  • - The hsl and hsla models.
  • - The opacity property.
  • - Support for remote fonts
  • - font-face.
  • - Text formatting.
  • - Management of overflows by text-overflow.
  • - Management of sequences by wrap -option, white-space-treatment.
  • - Color and shadow effects on text text-fill-color, text-shadow.
  • - Multicolumn modes with column-count, column-width.
  • - Practical work Application of colors.
  • - Formatting texts.
  • - Multi-column management.
• Formatting boxes and backgrounds
  • - Shadows with box-shadow.
  • - Rounded corners with border-radius.
  • - Multiple backgrounds.
  • - Background gradients (-webkit-gradient).
  • - The backgrounds adjusted to the containers.
  • - Practical work Applying shadows and rounds.
• The transformations
  • - Transformations: translations, rotations, homotheties (-webkit-transform).
  • - Animations: animations, transitions (?webkit-transition).
  • - Practical work Animations and transition effects.