Shulou(Shulou.com)06/01 Report--

This article will explain in detail what are the knowledge points about HTML5, the editor thinks it is very practical, so I will share it with you for reference. I hope you can get something after reading this article.

HTML5 is the HTML standard version that replaces the HTML 4.01and XHTML 1.0standards developed in 1999. It is still in the development stage, but most browsers already support some HTML5 technologies. HTML 5 has two major features: first, it enhances the performance of Web pages. Secondly, the functions of Web applications such as local database are added. When it comes to HTML5 in a broad sense, it actually refers to a combination of technologies, including HTML, CSS and JavaScript. It hopes to reduce browser requirements for rich web application services (plug-in-based rich internet application,RIA) that require plug-ins, such as Adobe Flash, Microsoft Silverlight, and Oracle JavaFX, and provide more standards that can effectively enhance web applications.

Html5 characteristics

a. Semantic feature (Class:Semantic)

HTML5 gives web pages better meaning and structure. Richer tags will build data-driven Web that is more valuable to programs and users with the support of RDFa, microdata and microformats.

b. Local storage features (Class: OFFLINE & STORAGE)

Web APP developed based on HTML5 has shorter startup time and faster networking speed, all thanks to HTML5 APP Cache and local storage. Indexed DB (one of the most important technologies for html5 local storage) and API documentation.

c. Device compatibility features (Class: DEVICE ACCESS)

Since the API documents of Geolocation function were made public, HTML5 has provided web application developers with more multi-functional optimization options and brought more advantages of experience functions. HTML5 provides an unprecedented open interface for data and application access. So that external applications can be directly connected to the data inside the browser, for example, video and audio can be directly connected to microphones and cameras

d. Connection characteristics (Class: CONNECTIVITY)

More effective connection efficiency, so that the page-based real-time chat, faster web game experience, more optimized online communication has been realized. HTML5 has more efficient server push technology, and Server-Sent Event and WebSockets are two of them, which can help us to 'push' data from the server to the client.

e. Multimedia features of web pages (Class: MULTIMEDIA)

Support Audio, Video and other multimedia functions on the web side, which complement each other with the APPS, camera, audio and video functions of the website.

f. 3D, graphics and special effects properties (Class: 3D, Graphics & Effects)

Based on the 3D features of SVG, Canvas, WebGL and CSS3, users will be amazed at the amazing visual effects presented in the browser.

g. Performance and integration features (Class: Performance & Integration)

No user will wait for you forever. Loading--HTML5 will use technologies such as XMLHttpRequest2 to help your Web applications and websites work faster in a variety of environments.

H. CSS3 feature (Class: CSS3)

Without sacrificing performance and semantic structure, CSS3 (css2 Manual-CSS3 Manual) provides more style and stronger effects. In addition, Web's Open Font format (WOFF) provides more flexibility and control than previous Web typesetting.

HTML5 important mark

Marking

Definition and usage:

Tags define videos, such as movie clips or other video streams.

Marking

Definition and usage

Tags define sounds, such as music or other audio streams.

Example:

A simple HTML 5 audio

Your browser does not support audio tags.

Marking

Definition and usage:

Tags define graphics, such as charts and other images.

The canvas element of HTML5 uses JavaScript to draw images on a web page.

The canvas is a rectangular area, and you can control each pixel.

Canvas has a variety of ways to draw paths, rectangles, circles, characters, and add images.

Example:

Display a red rectangle through the canvas element:

Var canvas=document.getElementById ('myCanvas')

Var ctx=canvas.getContext ('2d')

Ctx.fillStyle='#FF0000'

Ctx.fillRect (0d0pl 80100)

Program interface

In addition to the original DOM interface, HTML5 adds more API, such as:

1. Canvas tags for instant 2D drawing

2. Scheduled media playback

3. Offline database storage

4. Document editing

5. Drag control

6. Browse History Management

Element change

New parsing order New elements: section, video, progress, nav, meter, time, aside, canvasinput

New attributes of the element: date and time, email, url.

New generic properties: ping, charset, async

Global attributes: id, tabindex, repeat.

Remove elements: center, font, strike.

Exception handling

HTML 5 (text/html) browsers will be more flexible in handling error syntax. HTML 5 is designed to ensure that old browsers can safely ignore new HTML 5 code. Compared to HTML 4.01, HTML 5 gives detailed rules for parsing, trying to enable different browsers to return the same results even when syntax errors occur.

HTML5 can provide:

1. Improve usability and user-friendly experience

two。 There are several new tags that will help developers define important content

3. It can bring more multimedia elements (video and audio) to the site.

4. It is a good substitute for FLASH and Silverlight.

5. SEO-friendly when it comes to crawling and indexing websites

6. Will be widely used in mobile applications and games.

Therefore, we can say that one day HTML5 will be better for WEB, but one day it is not now. We have to mention an important point: so far, there are no popular browsers that fully support all the features of the HTML5 specification. To be clear, today's mainstream browsers will tend to support HTML5, but there is still a lot of incomplete support or compatibility.

Google and HTML5

On May 22nd, Google created a doodle to commemorate Pac Man's video game. This graffiti is an animation, but also a Pac Man game that can be played. The graffiti was created by Google using the HTML5 standard, and of course Google also provides a FLASH version to support browsers that are not compatible with HTML5. I bet this is the first time most Internet users have come into contact with HTML5. For individuals, this is exciting news. In my opinion, this graffiti provides an opportunity to peek into the future trends of the Internet, web pages, mobile applications and games. For search engine optimization, he opened up my imagination, it made me think about the potential of HTML5 in the field of SEO. What are the advantages of moving websites to HTML5 standards for SEO?

HTML5 and SEO

One: make search engines easier to crawl and index

For some sites, especially those that rely heavily on FLASH, HTML5 is a big boon. If you have a site full of FLASH, you will certainly see the benefits of switching to HTML5. First, search engine spiders will be able to grab your site and index your content. All content embedded in the animation will be readable by the search engine. In the basic theory of search engine optimization, this aspect will drive your site to get more right-click traffic.

Second: provide more functions to improve the user-friendly experience

Another benefit of using HTML5 is that it adds more functionality. The functional problems of HTML5 can be seen from the favor of several mainstream sites around the world. Social networking tycoon Facebook has launched their long-awaited HTML5-based iPad app platform, and Pandora recently launched a new version of their HTML5-based music player. Game platform Zynga has recently launched three new HTML5-based games that run on mobile browsers, and so on. Every day, HTML5-based sites and HTML5-based sites are being pushed out. Keeping the site at the forefront of new technologies can also improve the user-friendly experience.

Third, the improvement of usability to improve the user-friendly experience

Finally, from the perspective of usability, HTML5 can better promote the interaction between users and the site. Multimedia websites can get more improvements, especially in applications on mobile platforms, using HTML5 can provide more high-quality video and audio streams. So far, the fact is that iPhone and iPad will not support FLASH, and ADOBE has recently announced that it will stop the development of FLASH based on mobile platforms. Now we can say that video and audio on mobile platforms will be dominated by HTML5 in the future.

This is the end of this article on "what are the knowledge points of HTML5?". I hope the above content can be of some help to you, so that you can learn more knowledge. if you think the article is good, please share it for more people to see.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.