Unprecedented HTML5 resource reference guide

Source: Internet
Author: User
Tags html5 boilerplate
Document directory
  • 1. Basic tutorial
  • 3. Canvas tutorial
  • 4. Local Storage tutorial
  • 5. Form tutorials
  • 6. video and multimedia tutorials
  • 7. mobile device application tutorial
  • 8. More tutorials
  • 11. Framework
  • 12. case presentation
  • 13. demos and Cases
  • 14. Books
  • 15. More resources and tutorials
Although HTML5 standards will not be available in official versions before 2014, many designers have begun to test some HTML5 functions supported by advanced browsers. HTML5 opens a brand new door for web design and application development. Native supports things previously only implemented using JavaScript or flash. We have collected 175 reference resources for learning HTML5, including tutorials, frameworks, and examples. Basically it's HTML5 sunflower collection, right?

1. Basic tutorial

HTML5 tutorial
From w3schools.com.

HTML5 beginners, easy to understand, use now!
From what !? Introduction to HTML5.

28 HTML5 features, tips, and technologies you must know
Practical HTML5 tips from nettuts +.

Introduction to HTML
A 40-minute video tutorial from Google employee Brad neuberg.

Quick Tips: you should use it right awayHTML5 features
Demonstration film from nettuts +.

Learn to love HTML5

A great overview of HTML5 technical advantages and some useful techniques.

Use the semantic class name to prepare for HTML5
Jon tan wrote an article about the new semantic classes in HTML5.

HTML5: Basic Introduction
An HTML5 introduction that describes APIs and new elements.

Everything you must know about HTML5
A literacy article from techradar UK.

HTML5 tutorial
Very basic tutorial site.

Structured tags in HTML5
Describes the structured labels that will replace many DIV elements.

Amazing HTML5
Very practical HTML5 getting started tutorial

HTML5, once again
A Brief Guide on front-end design using HTML5.

HTML5 speech

A huge HTML5 slide is also made using HTML5.

Header element
An article from HTML5 doctor about header elements.

The future of HTML5 and Web
This article covers the HTML5 basics starting in July 2009.

CSS code structure in HTML5: some practical guidelines
Some practical guides from woork.

HTML5: tips, skills, and technology
A HTML5 overview, including semantic tags, forms, and so on.

2. Use HTML5 to create a website

HTML5 tutorial-start from here
A basic HTML5 tutorial, including a basic template file.

Use HTML5 and css3 to write a dynamic professional website

Use HTML5 and css3 to write a backward compatible single-page portfolio

HTML5 & css3 case study tutorial

Touch the Future: Use HTML5 and css3 to create an elegant website

Compile a single page website template for css3 & HTML5

Write an HTML5 layout from scratch

HTML5 and css3: the technology you are about to use

Use HTML5 to code a cool iPhone app website

Simple website layout with HTML5 and css3

Use HTML5 to convert WordPress twentyten themes
Use HTML5 to improve WordPress's default twentyten topic tutorial

HTML5 and css3 in Dreamweaver cs5 Part 1: Building webpages
Part 1 from Adobe about coding HTML and css3 series in Dreamweaver cs5

Use HTML5 and css3 to create a modern website
Tutorials from IMB's developerworks

Use HTML5 to write web pages
From webmonkey site

Use HTML5 to design a blog

3. Canvas tutorial

A slide combining HTML5 canvas and jquery

Use HTML5 and Java Script to design a bounce ball

How to draw images using HTML5 canvas
The Think vitamin tutorial describes how to use canvas to draw images.

HTML5 canvas-Basics
Basic Introduction to HTML5 canvas from Dev. Opera

Considering the accessibility of HTML5 canvas
Canvas accessibility Overview

HTML5 canvas feature Guide
A comprehensive guide from six revisions

Canvas tutorial
Developer networks from Mozilla, including drawing shapes, using images, and more tutorials. Suitable for beginners of canvas.

4. Local Storage tutorial

Use HTML5 local storage to implement the note Function
A local storage practice tutorial

Use HTML5 and css3 technologies to implement the Notes function
In this case, the tabs have a cool animation effect when they are disabled.

Browser storage for HTML5 applications
Another tutorial on using local storage in HTML5 applications

HTML5 local storage-Part 1
Part 1 of an HTML5 local storage tutorial

Quick Tips: Learn HTML5 Local Storage
Video tutorial from nettuts +

WebOS HTML5 database storage tutorial
A tutorial on using the HTML5 local storage function on Palm WebOS

5. Form tutorials

Using HTML5 forms

How to Create HTML5 forms across browsers

UseHTML5 and css3 design search box

ReviewHTML5 form

HTML5 form is coming
Some brief information about HTML5's use of Form Design

6. video and multimedia tutorials

Use css3 and jquery to create a custom HTML5 Video Player

How to create an HTML5 Video Player

HTML5 video mapped to 3D space

Build cross-browser HTML5 videos (including iPad)
HTML5 video tutorial

HTML5 video elements
Tutorial on HTML5 video elements from HTML5 doctor

7. mobile device application tutorial

How to create an HTML5-based iPhone application
This tutorial shows you how to create an offline HTML5 application for the iPhone.

HTML5 application: Use geolocation to locate
Introduction to the geolocation API in HTML5

Use HTML5 to create a mobile Web application, part 1
Part 1 of a reference article from IBM's developerworks in 2010

Use HTML5 to create offline Web applications on mobile devices
Another tutorial from IBM's developerworks

HTML5 application: Shenma, Shenma. What should I do?
HTML5 application overview from nettuts +

8. More tutorials

How to Use HTML5, css3, and jquery to create a cute pop-up window Tool
Practical tutorials from spyrestudios

How to make all browsers correctly render HTML5 labels, or even IE6
From nettuts + site

Make HTML5 and css3 no longer pity
Tools and technologies that make HTML5 and css3 more cross-browser compatible

Implement HTML5 drag
A tutorial from nettuts +

My 5 HTML coding habits
Personal coding preferences and guidance

HTML5 micro-data: Welcome to machine world
An overview of microdata specifications

Combined with css3 and HTML5 Technologies
A tutorial from nettuts +

HTML5: Solve the ambiguity of NAV
Some instructions from Jeffrey zeldman on using the nav Element

9. HTML5 memo sheet and quick reference

HTML5 and css3 support
A very convenient table, including HTML5 and css3 browser compatibility check

HTML5 is coming soon
An interactive icon that shows the differences in HTML5 compatibility between mainstream browsers

HTML5 pocket books
A pocket HTML5 Reference Guide

HTML5 canvas memo

HTML5 cheat sheet

HTML 5 memo form (PDF)

HTML5 chart Reference Manual
An icon explains what HTML5 and HTML5 can do.

HTML5 tag Manual
From w3cschools Manual

HTML5 vocabulary
From HTML5 doctor site

HTML 5 Reference Manual
W3C Reference Manual

HTML5 and html4 are different
From W3C site

Features supported by HTML5
A Reference Manual covering browser support for HTML5 features

Why can I use HTML5?
Check HTML5 support differences of different browsers

Layout Engine comparison (HTML5)
Comparison of HTML5 and html4 support by many browser Layout engines, from Wikipedia

HTML5 ID/class naming reference
HTML5 structural element Guide

HTML5 Testing
Test your current browser's support for HTML5 and display the rating of other browsers

HTML5 tracking
A reference table for tracking HTML5 standard revisions

HTML5 security memorandum
A convenient website shows how browsers process HTML5 elements in some scenarios.

10. Professional HTML5 sites

W3C HTML5 logo
Including official HTML5 logos, galleries and product links

HTML5 tutorial
HTML5 tutorial sites have a lot of HTML5 tutorials and news

Free HTML5 templates
A basic and free HTML5 template set

HTML5 rocks
Includes tutorials, resources, and first-level HTML5 test site

HTML5 doctor
Including Q & A, articles, and other HTML5-related information

HTML canvas tutorial
A site that explains HTML5 canvas tutorials and shows cases

Whatwg workgroup blog
Official blog of the HTML5 standard whatwg workgroup

Html5trends.com
An HTML5 news and information site

Mobile HTML5
A website dedicated to teaching HTML5 mobile web applications and development

11. Framework

HTML5 boilerplate
A solid and reliable HTML5 framework

Less framework 4
The less framework 4 Framework is a framework that combines css3 and HTML5. It can be either mobile or desktop.

52 framework
A framework associated with HTML5, css3, and JavaScript

Sproutcore
An HTML5 Application Framework

Roots WordPress topic
A basic WordPress topic for HTML5 and css3

Limejs
An HTML5 game framework

Baseline
A css grid with predefined HTML5 Elements

Baker e-book framework
An e-book framework for iPad, built based on HTML5

Popcorn. js
A HTML5 JavaScript library for videos

Dhtmlx touch
A HTML5-based JavaScript library for mobile applications

HTML5 Multimedia Framework for WordPress
An HTML5 Multimedia Framework WordPress plug-in

H5 WordPress topic
A WordPress topic based on HTML5

Switchtohtml5
An HTML5 framework Builder

Jo
A mobile HTML5 Application Framework

Official HTML5 template Guide
Guide from nettuts + site

12. case presentation

HTML5 mania
HTML5 web design Gallery

HTML5 display
Professional HTML5 site Gallery

HTML5 website
There is an HTML5 site Gallery

HTML5 elites
There is an HTML5 Case Study

HTML5-based
HTML5 web design case presentation

HTML5 case: 48 cases that beat flash

HTML5 Gallery
HTML5 site collection

Canvas case
HTML5 canvas applications, games, tools, and tutorials

12 beautiful HTML5 web design cases
Display of 12 HTML5 sites

Lurking in the future: 25 ultra-modern HTML5 websites
25 HTML5-based site case studies

30 magnificent websites with HTML5 core support
Another demonstration case based on HTML5 sites

13. demos and Cases

HTML5 demonstration and case studies
HTML5 function demonstration, a browser compatibility Manual

HTML5 canvas and Audio Video and Audio experiments
A cool HTML5 canvas Animation

HTML5 and css3 experiments
A series of HTML5 elements, layout experiments and demonstrations

Sublimevideo
An HTML5 Video Player

Projekktor
A free HTML5 Video Player

10 HTML5 demos that make you forget flash

12 incredible HTML5 experiments

Video for everyone
Another HTML5 Video Player

HTML5 Media
Allows video and audio to be used normally in browsers.

Modernizr
A JavaScript library that makes HTML5 and css3 elements compatible with old browsers

14. Books

For web designersHTML5 books

HTML5: Design rich Web Applications

HTML5 and CSS 3 in the real world

Use the game to learn HTML5 and JavaScript, a basic HTML5 tutorial

HTML5 and css3: Use tomorrow's standards for today's Design

HTML5 canvas: Native interaction and animation

Professional HTML5 and css3 design modes

Professional HTML5 programming: Powerful APIs for developing rich Web Applications

HTML5 solution: basic technologies suitable for HTML5 developers

ExploitationHTML5 canvas game implementation

HTML5 animation using JavaScript

HTML5 video authoritative guide

HTML5 24-hour training

Go deep into HTML5

HTML5 Introduction

Amazing HTML5

15. More resources and tutorials

How does HTML5 web sockets interact with proxy servers?

HTML5 Overview
From a list apart, released in December 2007

Yes, you can use HTML5 now!
A sitepoint article published in mid-2009

HTML5 and css3 power
An article in-depth introduction to HTML5 and css3 was published in 2009

HTML5 Semantics
An article on HTML5 element semantics published on a list apart in 2009

Kaltura HTML5 media library
A JavaScript class library allows you to apply HTML5 videos and audios in various browsers.

Development naming conventions, microformats, and HTML5
From for a beautiful web site

HTML5's rise
From adactio site

Steve Smith talks about HTML5 and css3
What does HTML5 and css3 mean for web design? Think vitamin

HTML5 and css3 bring you to another design level
From the web design ledger site

HTML5: Reality and myth
Many myths and misunderstandings about HTML5 from smashing magazine

HTML5 and you
From nettuts + site

HTML5 applications on apps
Describes how HTML5 is applied on apps

16. More HTML5 search

Ultimate HTML5 Toolkit: 60 + articles, tutorials, resources and inspirational case presentations

Learning HTML5: 10 reasons

The future of HTML5

HTML5 and css3 resource Ultimate Collection

15 practical css3 and HTML5 templates and frameworks

23 high-quality HTML5 Resources

70 HTML5 and css3 tutorial resources that must be added to favorites

HTML5 tutorial Resource Collection

25 high-quality HTML5 tutorials and technologies

HTML5 tutorials and technologies that keep you busy

15 practical HTML5 tutorials and memos

The only HTML5 resource that needs to be read right away

22 excellent HTML5 tutorials

HTML5 tutorials, technologies, and cases for more than 40 developers

30 + practical HTML5 cases, tutorials and technologies

Original English version: The ultimate HTML5 Resource Guide | webdesigner depot
Translation: Ultimate HTML5 resource reference guide | mango xiaozhan

All rights reserved. For more information, see the source.

Reprinted from <
Href = "http://www.mangguo.org/the-ultimate-html5-resource-guide"
Title = "unprecedented HTML5 resource reference guide" rel = "bookmark"> unprecedented HTML5 resource reference guide |
Mango xiaozhan </a>

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.