HTML5/CSS3 Training

 

Introduction to HTML5

HTML5 has been around for a couple of years now but this latest version of the language will undoubtedly change the way you think about web application development. HTML5 is the latest version of HTML or Hypertext Markup Language. Several of HTML5′s features are now supported by most of the major browsers including Safari, Mozilla, Opera, and Chrome as well as smart phone browsers such as iPhone’s Mobile Safari, but the next year should see a large increase in usage. It isn’t expected to be completed until 2014, but the features that are available now are a great way to become acquainted with HTML5 and add some cool elements to your website. This introductory class will explore HTML5 structure and structural elements, video, audio, geolocation, offline storage, dynamic graphic generation using a drawing canvas and much, much more. It should be emphasized that this is NOT an HTML class.

Introduction to CSS3

Cascading Style Sheets (CSS) offer increased flexibility in the presentation of website content. In essence, it just makes everything prettier. Although CSS3 isn’t supported by all browsers yet, it’s becoming increasingly popular because it makes these changes so much easier than trying to get the same effect using something like a Javascript plugin or creating slightly different versions of the exact same image.

Features

  • Any HTML5 syntax requires a doctype to be specified so that the browser can render the page in standards mode. The good news though is that the doctype declaration has also been simplified from previous HTML. It is now just:
  • The audio and visual support in HTML5 is outstanding. As soon as it’s fully running and all browsers support HTML5, you will find it easy to add audio and video to websites without the need for outside plugins.
  • Editing the content of your website is simplified with HTML5. Using the contenteditable attribute, you can quickly and painlessly change your text by adding contenteditable=“true” to any element.
  • The canvas element makes it possible for you to bypass Photoshop to make your 2D images and directly place them in your code.
  • The application cache enables you to navigate web applications while you are offline.

Why Use It

  • HTML5 will load much quicker than its older brother because it implements WebSockets.
  • Mobile phone applications will be much more accessible if written in HTML5 because you will not have to write applications for a specific brand of phone but rather can create universal applications for all phones.
  • You have more flexibility in creating your website.
  • Video, audio and images are all easily written right into the code, eliminating the need for any third party software.
  • This language is growing and will only result in more, new, better and faster features that will leave old websites looking outdated.
  • HTML5 simply builds on HTML4, so the old markup can stay in place as you develop the new features.
  • HTML5 and CSS3 together will give you some serious designer credibility.

HTML5 Training

Structure

  • Background and Structure
  • Exploring new HTML5 elements
  • Microdata
  • CSS and HTML5
  • When to use HTML5

Working with Text

  • HTML5 Outlines
  • Blog posts and comments
  • WAI-ARIA

Transforming Objects

  • Working with Forms
  • Input Types
  • Attributes
  • Backward Compatibility
  • JavaScript and DIY Validation

Video/Audio and Data Storage

  • Audio and Video Tag
  • Codecs/Video Codecs/Audio Codecs
  • Web Storage

Canvas

  • Basics of Canvas
  • Shapes and Fills
  • Paths
  • Capture
  • Animation
  • Saving/Exporting

Offline Web Applications

  • Caches
  • Network and Fallback
  • Browser-Server Processes
  • Application Cache

CSS3 Training

  • Introduction to CSS3
  • CSS3 and HTML5
  • In Depth CSS
  • Formatting a Page with CSS3
  • CSS3 Special Effects
  • CSS3 Animations, Transitions and Transformations
  • CSS3 and Mobile Devices
  • CSS3 Advanced Techniques
  • Fluid, Multicolumn Pages
  • Stylized Links
  • Format Form Fields with CSS3
  • CSS3 Sprites
  • CSS3 Drop-Down Menus

Any prior experience?

You should know HTML and basic CSS. Although not required, familiarity with JavaScript or basic programming is beneficial.
No special software is required for this course. We will provide webspace without ads to post homework assignments.

Request a Quote Now!