UMK Lecture 5 - HTML5 latest v7

ADVANCED WEBSITE
DESIGN
Using HTML5 & CSS3
For the Latest Web Development
Evolution.
Hisham Mat Hussin UMK April 2012

What is the HTML5..
HTML5 is the next generation of HTML.
HTML5 will be the new standard for HTML.
The previous version of HTML, HTML 4.01, came in 1999. The
web has changed a lot since then.
HTML5 is still a work in progress. However, the major browsers
support many of the new HTML5 elements and APIs.
• API= Application Programming Interface

How Did HTML5 Get Started..
HTML5 is a cooperation between the World Wide
Web Consortium (W3C) and the Web Hypertext
Application Technology Working Group (WHATWG).
WHATWG was working with web forms and
applications, and W3C was working with XHTML 2.0.
In 2006, they decided to cooperate and create a new
version of HTML.

HTML5 logo
Between Canvas, WebGL,
and CSS3 3D features,
with stunning visuals
natively rendered in the
browser.

HTML5 logo
More efficient connectivity
means more real-time
chats, faster games, and
better communication.
Improved technology for
server connectivity

HTML5 logo
Beginning with the
Geolocation API, Web
Applications can present
rich, device-aware features
and experiences.
From audio/video input
access to microphones
and cameras, to local data
such as contacts & events,
and even tilt orientation.

HTML5 logo
Make Web Apps and
dynamic web content faster
with a variety of techniques
and technologies such as
Web Workers and
XMLHttpRequest 2.

HTML5 logo
Giving meaning to structure,
semantics.
A richer set of tags, microdata,
and microformats, are enabling a
more useful, data driven web for
both programs and users.

HTML5 logo
Wide range of stylization and effects,
enhancing the web app
performance.
Additionally Web Open Font Format
(WOFF) provides typographic
flexibility and control far beyond
anything the web has offered before.

HTML5 logo
Audio and video are first
class citizens in the
HTML5 web, living in
harmony with your apps
and sites.

HTML5 logo
Web Apps can start faster and
work even if there is no
internet connection
Using the HTML5 App Cache,
as well as the Local Storage,
Indexed DB, and the File API
specifications.

Rules for HTML5 were established:
New features should be based on HTML, CSS, DOM, and JavaScript
Reduce the need for external plugins (like Flash)
Better error handling
More markup to replace scripting
HTML5 should be device independent
The development process should be visible to the public

Revision on CSS
What is CSS?
CSS stands for Cascading Style Sheets
Styles define how to display HTML elements
Styles were added to HTML 4.0 to solve a problem
External Style Sheets can save a lot of work
External Style Sheets are stored in CSS files

HTML5 + CSS3
• HTML5 independent

HTML5 + CSS3 overview
• <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
• "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
• <head>
• <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
• <style type="text/css">
• * { margin:0px; padding:0px;}
• </style>
• <script type="text/javascript" src="http://kreatif.com/blog/demo/js.js"></script>
• </head>
• <body>
• <h1>Welcome To My Site</h1>
• Bagian Artikel
• </body>
• </html>
<!DOCTYPE HTML>

Sample CSS3 – Text Animation

Sample CSS3 – Text Transformation

UMK Lecture 5 - HTML5 latest v7

More Related Content

What's hot (20)

Similar to UMK Lecture 5 - HTML5 latest v7 (20)

More from Hisham Mat Hussin (6)

UMK Lecture 5 - HTML5 latest v7