Extrema

Back to courses

HTML5 and CSS3

Duration:
Three days of eight hours each
Language:
This course can be delivered in English for in-house courses.
Aimed at:
Designers and server-side web developers (java, python, ruby). It is recommended to have at least one year of experience developing web applications (HTML and CSS). No experience with JavaScript is required.
Requirements:
Each student is required to carry his/her own laptop, and should have an administrator account. Windows (XP, Vista, 7) or Linux distributions are preferred, since they are the ones the instructor will be most familiar with. Other software tools will be installed during the labs. During in-house courses an Internet connection for everyone is required.

Objectives

The goals of this course are:

  • Separate contents and presentation
  • Introduce the new tags available with HTML5..
  • Introduce the new selectors available with CSS3.
  • Introduce the basics of JavaScript and JQuery.
  • Apply the new form elements and validation rules of HTML5.
  • Understand the browser market share, specially regarding Internet Explorer.
  • Learn how to simplify your HTML code.
  • Introduce several CSS frameworks (Twitter Bootstrap, Compass).
  • Improve performance by reducing traffic between browser and server.
  • Improve accesibility.
  • Optimize your search engine results position.
  • Keep a consistent appearance including legacy browsers without HTML5 o CSS3 support.
  • Learn how to write alternate CSS stylesheets for print.
  • Learn how to apply responsive design.
  • Introduce new fonts other than web-safe.
  • Learn new UI patterns for web design.

After completing this course

Once this course has been completed, you will be able to:

  • Create and understand wireframes.
  • Develop web applications based on HTML5 y CSS3.
  • Replace JavaScript-based animations with faster and more efficient CSS3 transitions.
  • Develop a responsive web page suitable for any device.
  • Use and create your own sprite images.
  • Write efficient CSS selectors that help improve rendering time.
  • Use font-face icons to minimize server requests.
  • Diagnose your web page in any A-class browser.
  • Introduce new HTML5 tags in existing or new applications without breaking browser compatibility.
  • Use schema.org in your own projects.
  • Use Modernizr and polyfills to include support for legacy browsers.
  • Use CSS frameworks and CSS resets.
  • Manage your stylesheets using a CSS preprocessor (Sass, LESS, Stylus).
  • Validate the accesibility and structure of your HTML fles.
  • Optimize the consumed bandwidth of your web applications.
  • Use online development tools.
  • Get started with SEO.
  • Identify browser support for the new standards.
  • Test with different versions of Internet Explorer at the same time.
  • Use LiveReload to edit your web page more efficiently.