Resource collection for HTML5 development

Source: Internet
Author: User

resources from: HTTPS://GITHUB.COM/MAXZHANG/MAXZHANG.GITHUB.COM/ISSUES/12

HTML5 is not a very fresh stuff, first of all, do not have the concept of misunderstanding, I think the title of the main HTML5 refers to a pan concept, HTML5 is composed of the following several technologies of a whole:

HTML5 ~= HTML + CSS + JS

Recommend a PPT can give you a comprehensive understanding of html5:http://slides.html5rocks.com/

The HTML section includes the HTML4.01 standard http://www.w3.org/TR/html401/that you have already known
And there's the HTML 5 candidate recommendation http://www.w3.org/TR/html5/that's about to become standard.

HTML5 adds more semantic tags to the HTML4 base, such as:

And on the original tag, more markup attributes have been extended, such as:

<input type="text" required /><input type="email" value="[email protected]" />

HTML5 In addition, there are many new tags and attributes introduced, such as: webapp Development direction of progress, barrier-free browsing aria, SEO optimization microdata and so on.

    • HTML Standard list: Http://www.w3.org/standards/techs/html#w3c_all

The CSS section is also the same, you already know the CSS2 standard http://www.w3.org/TR/CSS2/
The latest is the CSS LEVEL3 standard, because CSS3 contains a lot of content, documents are separate, temporarily no way to give all the standard address, first paste part of the Common standard bar:

    • CSS Standard list: Http://www.w3.org/standards/techs/css#w3c_all
    • CSS Selector CSS Picker http://www.w3.org/TR/2013/WD-selectors4-20130502/
    • Transition Animation Transition Effect http://www.w3.org/TR/2013/WD-css3-transitions-20131119/
    • Animation Page Animation http://www.w3.org/TR/2013/WD-css3-animations-20130219/

JS section for HTML5 mainly reflected in the Web API aspect, all API is BOM object, below I also listed some common standard address:

List of JavaScript API standards: Http://www.w3.org/standards/techs/js#w3c_all
Touch Events Touchscreen gesture Event: http://www.w3.org/TR/touch-events/
Geolocation Location: http://www.w3.org/TR/geolocation-API/
Web Storage Web Storage: http://www.w3.org/TR/webstorage/

With the above content, you probably already know what HTML5 is, and here are some of the resources that HTML5 development app can use. In fact, HTML5 development and the previous web does not have the essential difference, the main difference is reflected in the HTML5 of some new features and is not well supported by the old class library, so you need some more modern class library to use HTML5 to do development.

The first is the JS Library/framework,

Lightweight libraries include

    • Zepto.js http://zeptojs.com/, a lightweight library that works well on the mobile side, is very small, but the functionality is simple;
    • JQuery 2.0 http://jquery.com/Here is the 2.0 version, only support some advanced browsers, using a lot of HTML5 features, although the mobile development volume relative zepto larger, but as a basic library is really addictive;

App Framework (the frameworks below are not just for mobile-only development)

    • jquery Mobile http://jquerymobile.com/and jquery are the same programming ideas, which are very convenient to use, including browsing history management, view navigation rendering, UI components and other functions;
    • APP Framework https://github.com/01org/appframework/is a very similar framework to jquery Mobile, and I haven't actually used it, I've seen the API, basically similar to jquery mobile;
    • Sencha Touch Http://www.sencha.com/products/touch/Sencha Products, when I use EXT, I have been very fond of, is a complete Web component of the idea, used to do enterprise application development is very good, but, There are also many shortcomings, such as volume, complexity, performance and so on;

MVC Framework

    • Backbone Http://backbonejs.org/MVC Frame I only recommend Backbone, not because Backbone is good, but for mobile development, Backbone volume is relatively small, and the function is very simple, very easy to get started, Angularjs is too big, too complicated;

UI Framework

    • Bootsrap 3 http://getbootstrap.com/This needless to say, used to build html/css;
    • Pure CSS http://purecss.io/The same stuff as Bootstrap;

Tool Library (Speaking of tools, it is too much, I can not list each one, depending on the time when the subject of the subject is closer)

    • Iscroll Https://github.com/cubiq/iscroll Simulation Area scrolling, used in mobile development
    • Pointer.js https://github.com/borismus/pointer.js Touch gesture tool for compatibility with pointer event model and touch event model;
    • Deeptissue.js http://deeptissuejs.com/Touch gesture tool to extend various gesture events
    • Quo.js http://quojs.tapquo.com/Ibid.
    • Hammer.js https://github.com/EightMedia/hammer.js/is also a gesture tool, but this is a jquery plugin;
    • Spin.js http://fgnass.github.io/spin.js/loading in animation widget
    • Css3patterns http://lea.verou.me/css3patterns/using CSS3 to draw the background
    • Svgpatterns http://philbit.com/svgpatterns/using SVG to draw the background
    • Textillate.js http://jschr.github.io/textillate/various text animation effects
    • Effeckt.css http://h5bp.github.io/Effeckt.css/dist/various CSS3 animation effects
    • Jplayer http://www.jplayer.org/audio and video playback tools

CSS3 Code generation Tool

    • Http://ie.microsoft.com/testdrive/Graphics/hands-on-css3/see-also.htm IE officially provides a tool, very useful, a lot of features;
    • Http://cubic-bezier.com Bezier Curve
    • Http://the-echoplex.net/flexyboxes/flexbox layout
    • HTTP://CSSARROWPLEASE.COM/CSS3 Arrow
    • Http://heartcode.robertpataki.com/canvasloader/canvas loading
    • http://www.css88.com/tool/css3Preview/Transform.html Transform Deformation
    • http://www.responsivewebcss.com/-Responsive layout
    • http://nmsdvid.com/snippets/@media Tools
    • Http://css3ps.com/PhotoShop CSS3 Plugin

Finally share a few of the mobile development resources I collected, although mobile development, but mobile development is currently closest to the direction of HTML5 technology

      • Https://github.com/exfork/mobileTech
      • Https://github.com/exfork/Mars

Resource collection for HTML5 development

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.