SlideShare a Scribd company logo
HTML5 Intro
@kevinderudder working for
eGuidelines and a lecturer at the
Technical University of West Flanders.

Contact me on kevin@eguidelines.be
Agenda

•   Introduction
•   Structure of an HTML5 page
•   New Tags
•   Forms
•   Video and audio
•   Canvas
What is HTML 5

Recommended for you

Improving WordPress performance (xdebug and profiling)
Improving WordPress performance (xdebug and profiling)Improving WordPress performance (xdebug and profiling)
Improving WordPress performance (xdebug and profiling)

Talk given at WordCamp Athens 2017, by Otto Kekäläinen. For more info, see blog post at https://seravo.com/measuring-wordpress-speed/

wordpresssoftware speedsoftware performance
TTW FTW: Plone as the new wordpress
TTW FTW: Plone as the new wordpressTTW FTW: Plone as the new wordpress
TTW FTW: Plone as the new wordpress

This document discusses making Plone more popular by making it easier to deploy and use through thematic templating. It proposes using Diazo, which separates presentation from content, to allow frontend developers and integrators to build complex websites in Plone without advanced Python skills. Many Plone capabilities like portlets and collections could be surfaced through HTML for easier third-party development. The goal is to lower barriers and attract more developers by following the "Plone crack" or "starter drug" principle of making it addictively easy to get started.

plonewordpresscms
Funnelweb ploneconf2010
Funnelweb ploneconf2010Funnelweb ploneconf2010
Funnelweb ploneconf2010

This document discusses content conversion tools for Plone including FunnelWeb and the transmogrify library. FunnelWeb is a recipe and script that crawls websites, filters content, removes templates, and uploads content to Plone. Transmogrify is a Python library for content conversions that includes blueprints for crawling, extracting content, analyzing sites, and uploading to Plone. The document demonstrates using these tools to convert an existing site into a Plone site in an automated manner.

ploneconf2010 plone python transmogrifier
HTML5 = New Markup + JavaScript APIs
Be aware, HTML5 is not finished yet.


Some demo’s will not work in some browsers.
Html5 intro
The question is, when is HTML5 ‘done’

Recommended for you

Modern Perl
Modern PerlModern Perl
Modern Perl

A brief introduction to modern Perl programming tools that I gave at the OpenTech conference in Spetember 2010.

opentechperlmodern perl
Making Symofny shine with Varnish - SymfonyCon Madrid 2014
Making Symofny shine with Varnish - SymfonyCon Madrid 2014Making Symofny shine with Varnish - SymfonyCon Madrid 2014
Making Symofny shine with Varnish - SymfonyCon Madrid 2014

The document discusses using Varnish as a cache accelerator in front of Symfony applications. It provides an overview of Varnish configuration using VCL, the request flow through Varnish, and new features in Varnish 4. It also covers specific techniques for caching Symfony applications, including normalizing URLs and cookies, load balancing backends, handling internationalization, and invalidating caches.

Cool like a Frontend Developer: Grunt, RequireJS, Bower and other Tools
Cool like a Frontend Developer: Grunt, RequireJS, Bower and other ToolsCool like a Frontend Developer: Grunt, RequireJS, Bower and other Tools
Cool like a Frontend Developer: Grunt, RequireJS, Bower and other Tools

Bower, Grunt, and RequireJS are just a few tools that have been re-shaping the frontend development world, replacing cluttered script tags and server-side build solutions with a sophisticated, but sometimes complex approach to dependency management and module loading. In this talk, we'll put on our trendy frontend developer hat and find out how these tools work and how they differ from what we might be used to. Most important, we'll see how using tools like this might look in Symfony2 and how our application can be a friendly place for a frontend guy/gal.

bowerjavascriptgrunt
Html5 intro
This is a problem??
Html5 intro
For now, just use HTML5

      IT’S READY

Recommended for you

Nanoc
NanocNanoc
Nanoc
arrrrcamprubyrails
Developing cacheable PHP applications - PHPLimburgBE 2018
Developing cacheable PHP applications - PHPLimburgBE 2018Developing cacheable PHP applications - PHPLimburgBE 2018
Developing cacheable PHP applications - PHPLimburgBE 2018

In this presentation, I show the audience how to implement HTTP caching best practices in a non-intrusive way in PHP Symfony 4 code base. This presentation focuses on topics like: - Caching using cache-control headers - Cache variations using the Vary header - Conditional requests using headers like ETag & If-None-Match - ESI discovery & parsing using headers like Surrogate-Capability & Surrogate-Control - Caching stateful content using JSON Web Token Validation in Varnish More information about this presentation is available at https://feryn.eu/speaking/developing-cacheable-php-applications-php-limburg-be/

cachingcachehttp
Refresh Austin - Intro to Dexy
Refresh Austin - Intro to DexyRefresh Austin - Intro to Dexy
Refresh Austin - Intro to Dexy

Slides for my Refreshing Documentation talk at Refresh Austin on July 12, 2011. Sources and handouts available from bitbucket: http://bit.ly/qXU3yP

refreshaustin dexy dexyit
Make sure that it works in every browser
Html5 intro
if (Modernizr.canvas) {

}

if (Modernizr.audio) {

}
STRUCTURE

Recommended for you

Plone pwns
Plone pwnsPlone pwns
Plone pwns

The document summarizes Plone, an open source content management system (CMS) built using Python and Zope. It discusses different team roles for Plone projects, options for hosting Plone sites, Plone's security record and theming capabilities. The document also promotes Plone's ease of development and lists commercial support options.

drupalplonejoomla
Developing cacheable PHP applications - Confoo 2018
Developing cacheable PHP applications - Confoo 2018Developing cacheable PHP applications - Confoo 2018
Developing cacheable PHP applications - Confoo 2018

The document discusses developing cacheable PHP applications. It recommends designing software with HTTP caching in mind by making applications stateless, using well-defined time to lives for cache expiration, and conditionally caching content. It also discusses common problems like time to live variations and authentication that make caching challenging. The document provides examples of implementing caching using Symfony, Twig templates, and Edge Side Includes to break pages into cacheable components.

cachingphpsymfony
Plone: The CMS that hits above it's weight
Plone: The CMS that hits above it's weightPlone: The CMS that hits above it's weight
Plone: The CMS that hits above it's weight

This document provides an overview of the Plone content management system (CMS). It discusses Plone's features such as being Python-based, using the Zope Object Database, options for hosting Plone sites, its security record compared to other CMSs, and themes. It also mentions the CMSUI and Chameleon projects which aim to improve Plone's user interface and templating.

fossploneecm
Klassiek


<!DOCTYPE html PUBLIC
       "-//W3C//DTD XHTML 1.0 Transitional//EN"
       "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">

<head>
   <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
   <link rel="stylesheet" type="text/css" href="styles.css" />
   <title></title>
</head>

<body>
    <p>Hello World!</p>
</body>

</html>
DocType


<!DOCTYPE html>



<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">

<head>
   <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
   <link rel="stylesheet" type="text/css" href="styles.css" />
   <title></title>
</head>

<body>
    <p>Hello World!</p>
</body>

</html>
xmlns


<!DOCTYPE html>



<html>

<head>
   <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
   <link rel="stylesheet" type="text/css" href="styles.css" />
   <title></title>
</head>

<body>
    <p>Hello World!</p>
</body>

</html>
Meta charset


<!DOCTYPE html>



<html>

<head>
   <meta charset=“utf-8" />
   <link rel="stylesheet" type="text/css" href="styles.css" />
   <title></title>
</head>

<body>
    <p>Hello World!</p>
</body>

</html>

Recommended for you

How to make Ajax work for you
How to make Ajax work for youHow to make Ajax work for you
How to make Ajax work for you

The document discusses Asynchronous JavaScript and XML (Ajax) and how it can be used to retrieve data from a server without reloading the entire web page. It provides an overview of Ajax fundamentals including the XMLHttpRequest object, DOM manipulation, and different data transport options. It also recommends using a JavaScript library to simplify making Ajax requests instead of writing raw XMLHttpRequest code.

Automatic testing and quality assurance for WordPress plugins
Automatic testing and quality assurance for WordPress pluginsAutomatic testing and quality assurance for WordPress plugins
Automatic testing and quality assurance for WordPress plugins

Talk given at WordCamp Jyväskylä 2018 WordPress plugins have a reputation of low quality. Help us prove them wrong. Start using automatic quality testing!

wordpressphpquality assurance
Leverage HTTP to deliver cacheable websites - Thijs Feryn - Codemotion Rome 2018
Leverage HTTP to deliver cacheable websites - Thijs Feryn - Codemotion Rome 2018Leverage HTTP to deliver cacheable websites - Thijs Feryn - Codemotion Rome 2018
Leverage HTTP to deliver cacheable websites - Thijs Feryn - Codemotion Rome 2018

Most of us are familiar with HTTP, but when it actually comes to creating cacheable web content, there is still a lot to be learned. In this presentation I will show you how to leverage specific mechanism to achieve a good hit rate without losing touch with some of the challenges of real-life web projects. Keywords: cache control, cache variations, conditional requests, stateful content, HTTP fragments, invalidation. The goals is to empower developers to control the behavior of reverse caching proxies like Varnish, Content Delivery Networks, or even browser cache, using the power of HTTP.

codemotion rome 2018
Link type


<!DOCTYPE html>



<html>

<head>
   <meta charset= "utf-8" />
   <link rel="stylesheet" href="styles.css" />
   <title></title>
</head>

<body>
    <p>Hello World!</p>
</body>

</html>
NEW TAGS
Article      Footer     rt
Aside        Header     Ruby
Audio        Hgroup     Section
Canvas       Keygen     Source
Command      Mark       Summary
Datalist     Meter      Time
Details      Nav        Video
Embed        Output     wbr
Figcaption   Progress
figure       rp
Which class names are used on most pages?

Recommended for you

Leverage HTTP to deliver cacheable websites - Codemotion Rome 2018
Leverage HTTP to deliver cacheable websites - Codemotion Rome 2018Leverage HTTP to deliver cacheable websites - Codemotion Rome 2018
Leverage HTTP to deliver cacheable websites - Codemotion Rome 2018

More information about this HTTP caching talk can be found on https://feryn.eu/speaking/leverage-http-to-deliver-cacheable-websites-codemotion-rome-2018/

cachehttpphp
Seminário de Desenvolvimento Mobile - Etec Cafelândia
Seminário de Desenvolvimento Mobile - Etec CafelândiaSeminário de Desenvolvimento Mobile - Etec Cafelândia
Seminário de Desenvolvimento Mobile - Etec Cafelândia

O seminário discute o desenvolvimento de aplicativos móveis, abordando aplicativos híbridos, HTML5, Apache Cordova e o mercado mobile atual. A agenda inclui recursos e funcionalidades do HTML5, como canvas, multimídia e acesso a dispositivos, além de apresentar Apache Cordova e o crescimento do mercado de aplicativos móveis.

etecaplicativointel xdk
HTML5 Intro
HTML5 IntroHTML5 Intro
HTML5 Intro

A basic introduction to HTML5 and it's new features. Created for the HTML5/CSS3 meetup Frankfurt in March 2010.

introhtml5canvas
footer
menu
title
small
text
content
header
nav
copyright
button
main
search
msonormal
date
smalltext
body
style1
top
white
link

            http://code.google.com/intl/nl-NL/webstats/2005-12/classes.html
div id=“header”
                   div id=“topmenu”

                                div id=“page”



                               div class=“post”
div id=“sidebar”



                               div class=“post”



                    div id=“footer”
<header>
           <nav>

                     <section>



                     <article>
<aside>



                     <article>



          <footer>
Forms

Recommended for you

Intro to html, css & sass
Intro to html, css & sassIntro to html, css & sass
Intro to html, css & sass

The document provides an introduction to HTML, CSS, and SASS. It discusses what each technology is, how they are used together, and some of their key features. It explains that HTML is a markup language used to define the structure and content of web pages, CSS is used to style and lay out HTML elements, and SASS is a CSS preprocessor that adds powerful features like variables, nesting, and mixins to make CSS more efficient to write and maintain. It then provides overviews of important HTML tags, CSS properties and selectors, and features of SASS like mixins and extends.

Html5 intro
Html5 introHtml5 intro
Html5 intro

This document provides an overview of front-end HTML5 web development, including its history from 2004 to becoming a W3C recommendation in 2014. It discusses using new HTML5 features to build complex client-side apps and focuses on teaching attendees how to write front-end code focused on JavaScript to develop modern web applications, demonstrating examples along the way.

Intro to HTML + CSS
Intro to HTML + CSSIntro to HTML + CSS
Intro to HTML + CSS

This document is a class roadmap for an introductory course on HTML and CSS taught by Jamal O'Garro. The course covers the basics of HTML structure and elements, introduces CSS rules and properties for styling elements, explores CSS positioning and the box model, and provides an overview of responsive design and Bootstrap.

web designlearn to codehtml
HTML4 exists out of dumb fields
/^([a-zA-Z0-9_.-])+@(([a-zA-Z0-9-])+.)+([a-zA-Z0-9]{2,4})+$/;
New attributes and input types available
<input type="email" />

Recommended for you

An Intro to HTML & CSS
An Intro to HTML & CSSAn Intro to HTML & CSS
An Intro to HTML & CSS

HTML and CSS can be a little daunting at first. This workshop covers the basics, breaks down the barrier to entry and shows you how you can start using HTML and CSS now.

htmlfront-end developmenthtml5
Intro to HTML
Intro to HTMLIntro to HTML
Intro to HTML

These are the slides from my Intro to HTML talk that I gave for Trade School Indy on 12 Feb, 2014. More information posted at http://randyoest.com/html/ or follow me on Twitter at @amazingrando.

htmlcodinglearning
03 - Web-технологии. Язык разметки HTML
03 - Web-технологии. Язык разметки HTML03 - Web-технологии. Язык разметки HTML
03 - Web-технологии. Язык разметки HTML

1. Основы разметки 2. DOCTYPE 3. Картинки, стили, скрипты и другие ресурсы 4. Блочные и строчные тэги 5. Таблицы и списки 6. Гиперссылки и формы

<input type="url" />
<input   type="date" />
<input   type="month" />
<input   type="week" />
<input   type="time" />
<input   type="datetime" />
<input   type="datetime-local" />
<input type="number" />
<input type="range" />

Recommended for you

DevFest Makerere html5 presentation by caesar mukama
DevFest Makerere html5 presentation by caesar mukamaDevFest Makerere html5 presentation by caesar mukama
DevFest Makerere html5 presentation by caesar mukama

HTML5 is an important new industry standard for web development that provides many new features. It includes 28 new semantic tags for common page elements like articles, sections and headers. It also defines 13 new form input types for things like dates, numbers and colors. HTML5 aims to simplify HTML and supports new multimedia with elements like video and canvas for graphics. It also has improved error handling to make malformed pages work.

technologyweb design and developmentsof
Html 5
Html 5Html 5
Html 5

This document provides an introduction and overview of HTML5. It discusses the new features and elements in HTML5, including video/audio, canvas, drag and drop, geolocation, web storage, web workers, and new form elements. It also covers browser support for various HTML5 features and provides examples of how to implement many of the new technologies.

Web Apps
Web AppsWeb Apps
Web Apps

In this lecture, I provide an overview of what it takes to create amazing Web Apps : rich media, the Canvas API, local storage and offline persistence are covered.

html5web applications
<input type="tel" />
<input type="color" />
<input type="text" id="languageText"
       list="languageList" />

<datalist id="languageList">
  <option value="en" label="English" />
  <option value="nl" label="Nederlands" />
  <option value="fr" label="Français" />
</datalist>
<input id="firstName" required />

Recommended for you

[In Control 2010] HTML5
[In Control 2010] HTML5[In Control 2010] HTML5
[In Control 2010] HTML5

This document discusses HTML5 and provides examples of new HTML5 elements and features such as audio, video, and the canvas element. It demonstrates how to add audio and video to a basic HTML5 page structure and provides code samples using the canvas element to draw shapes. It also discusses HTML5 support in different browsers and techniques for improving compatibility, such as using JavaScript to add support for new elements in older browsers.

html5
Looking into HTML5 + CSS3
Looking into HTML5 + CSS3Looking into HTML5 + CSS3
Looking into HTML5 + CSS3

The document discusses HTML5 and CSS3. It begins by looking at Flash and XHTML. It then covers new HTML5 elements like article, aside, audio and video. It discusses HTML5 audio and video formats and browser support. It provides examples of using Canvas, geolocation, offline applications and local databases in HTML5. It also discusses using CSS3 properties like fonts, shadows, gradients and rounded corners. Finally, it notes some criticisms of HTML5 and looks at the future of CSS3.

htmlweb designhtml5
Web Directions @media 2010
Web Directions @media 2010Web Directions @media 2010
Web Directions @media 2010

HTML5 is a new version of HTML that provides new semantic elements and APIs for multimedia content like video and canvas scriptable graphics without plugins. It standardizes current browser behaviors and introduces new form and media elements that work across browsers. While support is not perfect yet, progressive enhancement approaches ensure graceful degradation. HTML5 provides alternatives to plugins like Flash, giving developers more choice in how to build rich web applications.

html5 web standards
<input id="firstName"
       placeholder=“your firstname” />
<input id="firstName" autofocus />
<input id="firstName" pattern=“[a-zA-Z]” />
Check with JavaScript



 function validateControl() {
        var txt = document.getElementById('myText').validity;
        alert(txt.valid);
  }

Recommended for you

Familiar HTML5 - 事例とサンプルコードから学ぶ 身近で普通に使わているHTML5
Familiar HTML5 - 事例とサンプルコードから学ぶ 身近で普通に使わているHTML5Familiar HTML5 - 事例とサンプルコードから学ぶ 身近で普通に使わているHTML5
Familiar HTML5 - 事例とサンプルコードから学ぶ 身近で普通に使わているHTML5

Familiar HTML5 事例とサンプルコードから学ぶ 身近で普通に使わているHTML5 HTML5 Conference Miyazaki 2013 2013/02/10 ひらい さだあき @sada_h

html5html5-miyazakihtml5j
HTML5 (and friends) - History, overview and current status - jsDay Verona 11....
HTML5 (and friends) - History, overview and current status - jsDay Verona 11....HTML5 (and friends) - History, overview and current status - jsDay Verona 11....
HTML5 (and friends) - History, overview and current status - jsDay Verona 11....

1. HTML5 provides new semantic elements like header, footer, nav and article that improve accessibility and help structure documents. It also extends existing APIs and adds new APIs for multimedia, geolocation, offline storage and more. 2. HTML5 introduces new form input types for dates, times, numbers and more. It also provides built-in form validation without JavaScript. 3. The <video> and <audio> elements allow native playback of multimedia across browsers without plugins. The <canvas> element allows dynamic drawing via JavaScript. 4. While still evolving, many HTML5 features can be used today through progressive enhancement and feature detection. It offers developers new capabilities for building web applications and interactive experiences on

htmlaudioweb design
Brave new world of HTML5
Brave new world of HTML5Brave new world of HTML5
Brave new world of HTML5

In this, my talk for Webinale in Berlin, June 1st 2011, I give an overview of HTML5 history and main features, relating it all back to how possible it is use develop with these new features today. Thanks to Patrick Lauke for allowing me to steal a lot of his slides ;-)

audiohistorysemantics
Video and Audio
Video - width - height - poster == Audio
Why do we need a video element???
When you wanted to use video, you needed
        to use the <object/> tag.


The <object/> tag is for foreign objects and
         the video is not foreign

Recommended for you

webinale2011_Chris Mills_Brave new world of HTML5Html5
webinale2011_Chris Mills_Brave new world of HTML5Html5webinale2011_Chris Mills_Brave new world of HTML5Html5
webinale2011_Chris Mills_Brave new world of HTML5Html5

1. HTML5 provides new semantic elements like <header>, <footer>, and <nav> that allow for more structured markup. It also extends existing APIs and adds new APIs for multimedia, forms, and building web applications. 2. HTML5 introduces multimedia elements <video> and <audio> that allow embedded video and audio without plugins. It also includes the <canvas> element for scriptable drawing. 3. HTML5 includes new APIs for building powerful web applications, including geolocation, offline application caching, local storage, and databases. However, browser support is still evolving so these should be used carefully with feature detection.

Top 10 HTML5 features every developer should know!
Top 10 HTML5 features every developer should know!Top 10 HTML5 features every developer should know!
Top 10 HTML5 features every developer should know!

The document summarizes 10 key HTML5 features that every developer should know. It begins with an introduction and agenda listing the features to be covered, including new elements, data input and validation, canvas, SVG, audio and video, feature detection, drag and drop, geolocation, local storage, and the file API. For each feature, it provides details on the new capabilities in HTML5 and examples of how to implement the features in code.

geolocationjavascripthtml5
Html5 drupal7 with mandakini kumari(1)
Html5 drupal7 with mandakini kumari(1)Html5 drupal7 with mandakini kumari(1)
Html5 drupal7 with mandakini kumari(1)

The document provides an overview of HTML5 and how to implement it with Drupal 7. It discusses new HTML5 elements, attributes, and forms; how to make Drupal 7 themes responsive with HTML5; differences between HTML4, XHTML, and HTML5; and how to use CSS3 with HTML5 for effects like shadows and gradients. The document includes links to HTML5 tools and resources for Drupal and recommends familiarity with HTML, CSS, Drupal theming, and modern browsers.

drupal modulehtml5drupal theme
Html5 intro
plugins are also foreign
<video src="boringVideo.ogg"
       autoplay
       controls
       height
       width
       poster
       loop />
Html5 intro

Recommended for you

The Rich Standard: Getting Familiar with HTML5
The Rich Standard: Getting Familiar with HTML5The Rich Standard: Getting Familiar with HTML5
The Rich Standard: Getting Familiar with HTML5

HTML 5 may take some time to find full support in all major browsers, but you may be surprised to discover how many of HTML 5’s features are available today! HTML 5 is the next generation standard for web applications, and it promises to give plug-in based RIAs a serious challenge. In this demo heavy session, you’ll see HTML 5 in action and learn what you can do with today’s browser support for the new standard. If you’re building rich web applications and you’ve never touched HTML 5, this session is a must see.

html5
HTML5 Refresher
HTML5 RefresherHTML5 Refresher
HTML5 Refresher

Mobile applications Development - Lecture 10 HTML5 Refresher This presentation has been developed in the context of the Mobile Applications Development course at the Computer Science Department of the University of L’Aquila (Italy). http://www.di.univaq.it/malavolta

momobile applicationsmobile application development
Introduccion a HTML5
Introduccion a HTML5Introduccion a HTML5
Introduccion a HTML5

Introducción rápida a HTML5, repasando brevemente la historia de HTML, qué APIs se añaden a HTML5, y qué avances en HTML, CSS y JavaScript rodean a este estándar.

html5introduccioncss3
2 new codecs


• Specifications said: all browsers should at least
  have built-in support for 2 new codecs:

  • Ogg Vorbis for audio
  • Ogg Theora for movies
Apple and Nokia said NO
So there is no specification for audio and video
And so the developer-browser story
            continues

Recommended for you

html5
html5html5
html5

HTML5 introduces many new features for improving the semantic structure of documents, incorporating multimedia and graphics, and interacting with forms and graphical objects. These include new elements like <video>, <audio>, <canvas>, and <svg> for embedding multimedia and graphics, as well as new form controls. CSS3 also introduces new selectors and properties for effects like rounded corners, shadows, gradients, and transformations. JavaScript APIs allow access to features like geolocation, offline storage, and communication between frames. Browser support for HTML5 features is increasing but not yet complete, so techniques like feature detection and polyfills are recommended.

html5
Html5 tutorial
Html5 tutorialHtml5 tutorial
Html5 tutorial

HTML5 will be the new standard for HTML and includes several new features such as new semantic elements, canvas element for 2D drawing, video and audio elements, local storage support and new form controls. It is still a work in progress but major browsers already support many of its new APIs and elements. Some of the key rules for HTML5 include that new features should be based on HTML, CSS, DOM and JavaScript and reduce the need for plugins.

htmlhtml5html element
HTML5 Design
HTML5 DesignHTML5 Design
HTML5 Design

This document provides an agenda and notes for a presentation on HTML5. It begins with an introduction comparing XHTML to HTML5. It then covers various HTML5 topics like page structure elements, audio, video, geolocation and captions. For each topic, it provides examples and discusses browser support and best practices. It encourages using open standards like Ogg for audio and video to avoid patent issues. The presentation emphasizes building HTML5 pages that work across browsers using techniques like feature detection and polyfills.

audioweb designhtml5
H.264, Theora and VP8 are the most relevant
               video codecs




   For audio we use MP3, AAC and Vorbis
Theora and Vorbis in an Ogg container
   Firefox 4 supports also WebM
Theora and Vorbis in an Ogg container
  Opera 10.6 supports also WebM
Theora and Vorbis in an Ogg container
   Chrome 6 supports also WebM

Recommended for you

Leave No One Behind with HTML5 - FFWD.PRO, Croatia
Leave No One Behind with HTML5 - FFWD.PRO, CroatiaLeave No One Behind with HTML5 - FFWD.PRO, Croatia
Leave No One Behind with HTML5 - FFWD.PRO, Croatia

This document provides an overview of HTML5 features including accessibility, video, canvas, history API, fullscreen API, camera API, pointer lock API, and polyfills. It emphasizes the open nature of the web and encourages trying new things with HTML5.

htmlhtml5javascript
Html5 + css3+ java script for future - HTML5
Html5 + css3+ java script for future - HTML5Html5 + css3+ java script for future - HTML5
Html5 + css3+ java script for future - HTML5

This document provides an overview of HTML5, including its new semantic tags, forms, audio/video capabilities, canvas and SVG graphics. It discusses the evolution of HTML5 from previous versions and its development as a cooperation between W3C and WHATWG. Examples are given of how to include audio, video, canvas and SVG in HTML5, along with reasons to use HTML5 like accessibility, mobile support and cleaner code. References for further information on HTML5 are also included.

html5
Build your own Cloud/Home security system for 60$
Build your own Cloud/Home security system for 60$Build your own Cloud/Home security system for 60$
Build your own Cloud/Home security system for 60$

This document discusses how to create your own cloud/home security system for $60 using a Raspberry Pi or Arduino microcontroller, motion detectors, and connecting it to the cloud through services like Microsoft Azure. It provides examples of Internet of Things applications and demonstrates programming a Netduino microcontroller to send and receive messages from the cloud through an Azure message queue and worker role hub. The system allows you to monitor your home remotely from anywhere through the cloud.

internet of thingsc#iot
Anything that Quicktime supports, which is a
  long list, but no WebM, Theora, Vorbis

   H.264 video and AAC audio supported
Supports all profiles of H.264 and AAC in an
               MP4 container

                  >= IE9
What to do
1. Encode your video
2. Use multiple sources
3. Control with JavaScript

Recommended for you

Comparing xaml and html
Comparing xaml and htmlComparing xaml and html
Comparing xaml and html

My techays presentation together with @snowball about comparing two different but sometimes simular technologies

htmltechdaysnlxaml
ECMASCRIPT.NEXT
ECMASCRIPT.NEXTECMASCRIPT.NEXT
ECMASCRIPT.NEXT

The document discusses the history and evolution of JavaScript and ECMAScript. It notes that JavaScript originated from LiveScript in 1995 and was influenced by Java. ECMAScript was standardized by ECMA to ensure compatibility across implementations. Major versions included ES3, ES5, and ES6 approved in 2014 which introduced many new features and made JavaScript a better language. The session will demonstrate new features of ES.next.

ecmascriptjavascriptecmascript.next
VISUG: Visual studio for web developers
VISUG: Visual studio for web developersVISUG: Visual studio for web developers
VISUG: Visual studio for web developers

Visual Studio 2013 is now the best tool to build web applications. In this session I showed lots of new and cool features.

htmlvisual studio 2013css
Html5 intro
Server Mime Types


 video/ogg   .ogv

 video/mp4   .mp4

 video/webm .webm
1. Encode your video
2. Use multiple sources
3. Control with JavaScript
<video id="theVideo" autoplay controls width="500">
       <source src="../videos/big_buck_bunny.mp4" />
       <source src="../videos/big_buck_bunny.ogv" />
       <source src="../videos/big_buck_bunny.webm" />
       <p>Your browser doesn't support video</p>
</video>

Recommended for you

Testing apps with MTM and Tea Foundation Service
Testing apps with MTM and Tea Foundation ServiceTesting apps with MTM and Tea Foundation Service
Testing apps with MTM and Tea Foundation Service

The document discusses setting up Team Foundation Service to build and test a Windows 8 store application. It provides an overview of TFS hosting options including on-premises, third-party hosting, and Microsoft's Team Foundation Service. It demonstrates using TFS Service to access source code from any browser, setup projects easily with no infrastructure to manage, and request stakeholder feedback. The demo shows building and testing a Win8 app with Microsoft Test Manager 2012 and TFS Service.

tfs;windows 8; xaml; testing; team foundation serv
ECMAScript.Next ECMAScipt 6
ECMAScript.Next ECMAScipt 6ECMAScript.Next ECMAScipt 6
ECMAScript.Next ECMAScipt 6

This document discusses the history and evolution of JavaScript and ECMAScript. It begins with the origins of JavaScript in the mid-1990s as LiveScript and Mocha, developed by Netscape. JavaScript was standardized by Ecma International as ECMAScript, with various versions released over time adding new features. The presentation focuses on the latest ECMAScript 6 specification, covering new features like let/const block scoping, classes, modules, iterators/generators, and more. Code examples are provided to demonstrate these ES6 features.

javascriptecmascript.nextharmony
Building cross platform applications using Windows Azure Mobile Services
Building cross platform applications using Windows Azure Mobile ServicesBuilding cross platform applications using Windows Azure Mobile Services
Building cross platform applications using Windows Azure Mobile Services

This document discusses using Azure Mobile Services to develop cross-platform applications. It outlines two problems that Azure Mobile Services can address by allowing developers to focus on what they enjoy rather than platform-specific code. The document also mentions demonstrating Azure Mobile Services and says thanks.

azureandroidjavascript
1. Encode your video
2. Use multiple sources
3. Control with JavaScript
function playPauseVideo(sender) {
       if (video.paused || video.ended) {
               if (video.ended) {
                       video.currentTime = 0;
               }

                sender.innerHTML = '&#x2590;&#x2590;';
                sender.title = 'play';
                video.play();
       }
       else {
                sender.innerHTML = '&#x25BA;';
                sender.title = 'pause';
                video.pause();
       }
}
video.addEventListener('play' , function () {…;}, false),
video.addEventListener('pause' , function () {…; }, false)
Canvas

Recommended for you

Responsive SharePoint
Responsive SharePointResponsive SharePoint
Responsive SharePoint

This document discusses making SharePoint websites accessible on mobile devices. It explains that responsive design using HTML5, CSS3, and media queries allows a single website to automatically adapt to different screen sizes and devices. It also describes using device channels in SharePoint 2013 to deliver different content for specific devices, but notes limitations. The document demonstrates creating responsive designs with media queries and recommends responsive design over separate mobile pages.

htmlmediaqueriescss
Use html5 to build what you want, where you want it
Use html5 to build what you want, where you want itUse html5 to build what you want, where you want it
Use html5 to build what you want, where you want it

This document discusses how to build Windows 8 apps using existing HTML, CSS, and JavaScript skills. It recommends learning common Windows 8 features like tiles, WinJS controls, and supporting different device states and orientations. The document demonstrates turning an existing website into a Windows 8 Store app in 3 steps: using existing HTML/CSS skills, adding WinJS and controls, and deploying the app. It also covers contracts, tiles, and dynamic tile updates.

Developers and Designers
Developers and DesignersDevelopers and Designers
Developers and Designers

This document discusses differences between developers and designers. It notes that the session will discuss design and that the speaker will discuss guidelines for making good interfaces, even for those without design experience. Examples of Microsoft design principles are provided, such as prioritizing content and making things intuitive for users.

Html5 intro
Html5 intro
Html5 intro
Html5 intro

Recommended for you

Every Web Developer is a Win8 developer
Every Web Developer is a Win8 developerEvery Web Developer is a Win8 developer
Every Web Developer is a Win8 developer

The document discusses building Metro style apps for Windows 8. It notes that HTML5, CSS3, and JavaScript skills can be used to build these apps, and that the Windows Library for JavaScript (WinJS) helps make apps look and feel like the Metro design while allowing for touch and traditional inputs. Media queries and different states can be used to change the UI for different viewports like fullscreen, snapped, or filled modes. Tiles are described as the front doors to apps and should be treated as app extensions.

html5microsoftcss3
Media queries
Media queriesMedia queries
Media queries

This document discusses using media queries to build responsive mobile web applications. It begins by explaining why web developers should target multiple devices and discusses the differences between native and web applications. It then outlines how HTML5 and CSS3 features like media queries can be used to build responsive designs. The document provides an overview of common media query features and demonstrates how to write media queries to apply different styling based on screen width and other device characteristics.

responsive designmedia querieshtml5
BT & Neo4j: Knowledge Graphs for Critical Enterprise Systems.pptx.pdf
BT & Neo4j: Knowledge Graphs for Critical Enterprise Systems.pptx.pdfBT & Neo4j: Knowledge Graphs for Critical Enterprise Systems.pptx.pdf
BT & Neo4j: Knowledge Graphs for Critical Enterprise Systems.pptx.pdf

Presented at Gartner Data & Analytics, London Maty 2024. BT Group has used the Neo4j Graph Database to enable impressive digital transformation programs over the last 6 years. By re-imagining their operational support systems to adopt self-serve and data lead principles they have substantially reduced the number of applications and complexity of their operations. The result has been a substantial reduction in risk and costs while improving time to value, innovation, and process automation. Join this session to hear their story, the lessons they learned along the way and how their future innovation plans include the exploration of uses of EKG + Generative AI.

neo4jneo4j webinarsgraph database
Instead of drawing with a brush, use JavaScript
<canvas></canvas>
<canvas width="100" height="100">
      <p>Your browser does not support the canvas</p>
</canvas>
First, get your canvas context



  var canvas = document.getElementById('theCanvas');
  var ctx = canvas.getContext("2d");

Recommended for you

Quality Patents: Patents That Stand the Test of Time
Quality Patents: Patents That Stand the Test of TimeQuality Patents: Patents That Stand the Test of Time
Quality Patents: Patents That Stand the Test of Time

Is your patent a vanity piece of paper for your office wall? Or is it a reliable, defendable, assertable, property right? The difference is often quality. Is your patent simply a transactional cost and a large pile of legal bills for your startup? Or is it a leverageable asset worthy of attracting precious investment dollars, worth its cost in multiples of valuation? The difference is often quality. Is your patent application only good enough to get through the examination process? Or has it been crafted to stand the tests of time and varied audiences if you later need to assert that document against an infringer, find yourself litigating with it in an Article 3 Court at the hands of a judge and jury, God forbid, end up having to defend its validity at the PTAB, or even needing to use it to block pirated imports at the International Trade Commission? The difference is often quality. Quality will be our focus for a good chunk of the remainder of this season. What goes into a quality patent, and where possible, how do you get it without breaking the bank? ** Episode Overview ** In this first episode of our quality series, Kristen Hansen and the panel discuss: ⦿ What do we mean when we say patent quality? ⦿ Why is patent quality important? ⦿ How to balance quality and budget ⦿ The importance of searching, continuations, and draftsperson domain expertise ⦿ Very practical tips, tricks, examples, and Kristen’s Musts for drafting quality applications https://www.aurorapatents.com/patently-strategic-podcast.html

patentspatent applicationpatent prosecution
Coordinate Systems in FME 101 - Webinar Slides
Coordinate Systems in FME 101 - Webinar SlidesCoordinate Systems in FME 101 - Webinar Slides
Coordinate Systems in FME 101 - Webinar Slides

If you’ve ever had to analyze a map or GPS data, chances are you’ve encountered and even worked with coordinate systems. As historical data continually updates through GPS, understanding coordinate systems is increasingly crucial. However, not everyone knows why they exist or how to effectively use them for data-driven insights. During this webinar, you’ll learn exactly what coordinate systems are and how you can use FME to maintain and transform your data’s coordinate systems in an easy-to-digest way, accurately representing the geographical space that it exists within. During this webinar, you will have the chance to: - Enhance Your Understanding: Gain a clear overview of what coordinate systems are and their value - Learn Practical Applications: Why we need datams and projections, plus units between coordinate systems - Maximize with FME: Understand how FME handles coordinate systems, including a brief summary of the 3 main reprojectors - Custom Coordinate Systems: Learn how to work with FME and coordinate systems beyond what is natively supported - Look Ahead: Gain insights into where FME is headed with coordinate systems in the future Don’t miss the opportunity to improve the value you receive from your coordinate system data, ultimately allowing you to streamline your data analysis and maximize your time. See you there!

Password Rotation in 2024 is still Relevant
Password Rotation in 2024 is still RelevantPassword Rotation in 2024 is still Relevant
Password Rotation in 2024 is still Relevant

Password Rotation in 2024 is still Relevant

passwordmanagementrotation
Html5 intro
ctx.beginPath();
ctx.moveTo(75, 50);
ctx.lineTo(75, 100);
ctx.lineTo(25, 100);
ctx.fill();
var context = canvas.getContext("2d");

var img = new Image(); img.onload = function () {
       alert('loaded');
       context.drawImage(img, 0, 0, 250, 375);
}

img.src = '../images/Soldier_stub.png';
Lot’s of possibilities

• Transformations
  • setTransform
  • Rotate, scale, skew, pan, …


• Run over Pixels
• Save canvas content

Recommended for you

WPRiders Company Presentation Slide Deck
WPRiders Company Presentation Slide DeckWPRiders Company Presentation Slide Deck
WPRiders Company Presentation Slide Deck

YOUR RELIABLE WEB DESIGN & DEVELOPMENT TEAM — FOR LASTING SUCCESS WPRiders is a web development company specialized in WordPress and WooCommerce websites and plugins for customers around the world. The company is headquartered in Bucharest, Romania, but our team members are located all over the world. Our customers are primarily from the US and Western Europe, but we have clients from Australia, Canada and other areas as well. Some facts about WPRiders and why we are one of the best firms around: More than 700 five-star reviews! You can check them here. 1500 WordPress projects delivered. We respond 80% faster than other firms! Data provided by Freshdesk. We’ve been in business since 2015. We are located in 7 countries and have 22 team members. With so many projects delivered, our team knows what works and what doesn’t when it comes to WordPress and WooCommerce. Our team members are: - highly experienced developers (employees & contractors with 5 -10+ years of experience), - great designers with an eye for UX/UI with 10+ years of experience - project managers with development background who speak both tech and non-tech - QA specialists - Conversion Rate Optimisation - CRO experts They are all working together to provide you with the best possible service. We are passionate about WordPress, and we love creating custom solutions that help our clients achieve their goals. At WPRiders, we are committed to building long-term relationships with our clients. We believe in accountability, in doing the right thing, as well as in transparency and open communication. You can read more about WPRiders on the About us page.

web development agencywpriderswordpress development
Cookies program to display the information though cookie creation
Cookies program to display the information though cookie creationCookies program to display the information though cookie creation
Cookies program to display the information though cookie creation

Java Servlet programs

The Rise of Supernetwork Data Intensive Computing
The Rise of Supernetwork Data Intensive ComputingThe Rise of Supernetwork Data Intensive Computing
The Rise of Supernetwork Data Intensive Computing

Invited Remote Lecture to SC21 The International Conference for High Performance Computing, Networking, Storage, and Analysis St. Louis, Missouri November 18, 2021

distributed supercomputerdistributed machine learning
Resources
Html5 intro
Html5 intro
Thank you

Recommended for you

Active Inference is a veryyyyyyyyyyyyyyyyyyyyyyyy
Active Inference is a veryyyyyyyyyyyyyyyyyyyyyyyyActive Inference is a veryyyyyyyyyyyyyyyyyyyyyyyy
Active Inference is a veryyyyyyyyyyyyyyyyyyyyyyyy

Not so much to say

Choose our Linux Web Hosting for a seamless and successful online presence
Choose our Linux Web Hosting for a seamless and successful online presenceChoose our Linux Web Hosting for a seamless and successful online presence
Choose our Linux Web Hosting for a seamless and successful online presence

Our Linux Web Hosting plans offer unbeatable performance, security, and scalability, ensuring your website runs smoothly and efficiently. Visit- https://onliveserver.com/linux-web-hosting/

cheap linux hosting
Research Directions for Cross Reality Interfaces
Research Directions for Cross Reality InterfacesResearch Directions for Cross Reality Interfaces
Research Directions for Cross Reality Interfaces

An invited talk given by Mark Billinghurst on Research Directions for Cross Reality Interfaces. This was given on July 2nd 2024 as part of the 2024 Summer School on Cross Reality in Hagenberg, Austria (July 1st - 7th)

augmented realitycross realityvirtual reality

More Related Content

What's hot

The goodies of zope, pyramid, and plone (2)
The goodies of zope, pyramid, and plone (2)The goodies of zope, pyramid, and plone (2)
The goodies of zope, pyramid, and plone (2)
Dylan Jay
 
Contributing to WordPress Core - Peter Wilson
Contributing to WordPress Core - Peter WilsonContributing to WordPress Core - Peter Wilson
Contributing to WordPress Core - Peter Wilson
WordCamp Sydney
 
It's a Mod World - A Practical Guide to Rocking Modernizr
It's a Mod World - A Practical Guide to Rocking ModernizrIt's a Mod World - A Practical Guide to Rocking Modernizr
It's a Mod World - A Practical Guide to Rocking Modernizr
Michael Enslow
 
Improving WordPress performance (xdebug and profiling)
Improving WordPress performance (xdebug and profiling)Improving WordPress performance (xdebug and profiling)
Improving WordPress performance (xdebug and profiling)
Otto Kekäläinen
 
TTW FTW: Plone as the new wordpress
TTW FTW: Plone as the new wordpressTTW FTW: Plone as the new wordpress
TTW FTW: Plone as the new wordpress
Dylan Jay
 
Funnelweb ploneconf2010
Funnelweb ploneconf2010Funnelweb ploneconf2010
Funnelweb ploneconf2010
Dylan Jay
 
Modern Perl
Modern PerlModern Perl
Modern Perl
Dave Cross
 
Making Symofny shine with Varnish - SymfonyCon Madrid 2014
Making Symofny shine with Varnish - SymfonyCon Madrid 2014Making Symofny shine with Varnish - SymfonyCon Madrid 2014
Making Symofny shine with Varnish - SymfonyCon Madrid 2014
Barel Barelon
 
Cool like a Frontend Developer: Grunt, RequireJS, Bower and other Tools
Cool like a Frontend Developer: Grunt, RequireJS, Bower and other ToolsCool like a Frontend Developer: Grunt, RequireJS, Bower and other Tools
Cool like a Frontend Developer: Grunt, RequireJS, Bower and other Tools
Ryan Weaver
 
Developing cacheable PHP applications - PHPLimburgBE 2018
Developing cacheable PHP applications - PHPLimburgBE 2018Developing cacheable PHP applications - PHPLimburgBE 2018
Developing cacheable PHP applications - PHPLimburgBE 2018
Thijs Feryn
 
Refresh Austin - Intro to Dexy
Refresh Austin - Intro to DexyRefresh Austin - Intro to Dexy
Refresh Austin - Intro to Dexy
ananelson
 
Plone pwns
Plone pwnsPlone pwns
Plone pwns
Dylan Jay
 
Developing cacheable PHP applications - Confoo 2018
Developing cacheable PHP applications - Confoo 2018Developing cacheable PHP applications - Confoo 2018
Developing cacheable PHP applications - Confoo 2018
Thijs Feryn
 
Plone: The CMS that hits above it's weight
Plone: The CMS that hits above it's weightPlone: The CMS that hits above it's weight
Plone: The CMS that hits above it's weight
Dylan Jay
 
How to make Ajax work for you
How to make Ajax work for youHow to make Ajax work for you
How to make Ajax work for you
Simon Willison
 
Automatic testing and quality assurance for WordPress plugins
Automatic testing and quality assurance for WordPress pluginsAutomatic testing and quality assurance for WordPress plugins
Automatic testing and quality assurance for WordPress plugins
Otto Kekäläinen
 
Leverage HTTP to deliver cacheable websites - Thijs Feryn - Codemotion Rome 2018
Leverage HTTP to deliver cacheable websites - Thijs Feryn - Codemotion Rome 2018Leverage HTTP to deliver cacheable websites - Thijs Feryn - Codemotion Rome 2018
Leverage HTTP to deliver cacheable websites - Thijs Feryn - Codemotion Rome 2018
Codemotion
 
Leverage HTTP to deliver cacheable websites - Codemotion Rome 2018
Leverage HTTP to deliver cacheable websites - Codemotion Rome 2018Leverage HTTP to deliver cacheable websites - Codemotion Rome 2018
Leverage HTTP to deliver cacheable websites - Codemotion Rome 2018
Thijs Feryn
 

What's hot (19)

The goodies of zope, pyramid, and plone (2)
The goodies of zope, pyramid, and plone (2)The goodies of zope, pyramid, and plone (2)
The goodies of zope, pyramid, and plone (2)
 
Contributing to WordPress Core - Peter Wilson
Contributing to WordPress Core - Peter WilsonContributing to WordPress Core - Peter Wilson
Contributing to WordPress Core - Peter Wilson
 
It's a Mod World - A Practical Guide to Rocking Modernizr
It's a Mod World - A Practical Guide to Rocking ModernizrIt's a Mod World - A Practical Guide to Rocking Modernizr
It's a Mod World - A Practical Guide to Rocking Modernizr
 
Improving WordPress performance (xdebug and profiling)
Improving WordPress performance (xdebug and profiling)Improving WordPress performance (xdebug and profiling)
Improving WordPress performance (xdebug and profiling)
 
TTW FTW: Plone as the new wordpress
TTW FTW: Plone as the new wordpressTTW FTW: Plone as the new wordpress
TTW FTW: Plone as the new wordpress
 
Funnelweb ploneconf2010
Funnelweb ploneconf2010Funnelweb ploneconf2010
Funnelweb ploneconf2010
 
Modern Perl
Modern PerlModern Perl
Modern Perl
 
Making Symofny shine with Varnish - SymfonyCon Madrid 2014
Making Symofny shine with Varnish - SymfonyCon Madrid 2014Making Symofny shine with Varnish - SymfonyCon Madrid 2014
Making Symofny shine with Varnish - SymfonyCon Madrid 2014
 
Cool like a Frontend Developer: Grunt, RequireJS, Bower and other Tools
Cool like a Frontend Developer: Grunt, RequireJS, Bower and other ToolsCool like a Frontend Developer: Grunt, RequireJS, Bower and other Tools
Cool like a Frontend Developer: Grunt, RequireJS, Bower and other Tools
 
Nanoc
NanocNanoc
Nanoc
 
Developing cacheable PHP applications - PHPLimburgBE 2018
Developing cacheable PHP applications - PHPLimburgBE 2018Developing cacheable PHP applications - PHPLimburgBE 2018
Developing cacheable PHP applications - PHPLimburgBE 2018
 
Refresh Austin - Intro to Dexy
Refresh Austin - Intro to DexyRefresh Austin - Intro to Dexy
Refresh Austin - Intro to Dexy
 
Plone pwns
Plone pwnsPlone pwns
Plone pwns
 
Developing cacheable PHP applications - Confoo 2018
Developing cacheable PHP applications - Confoo 2018Developing cacheable PHP applications - Confoo 2018
Developing cacheable PHP applications - Confoo 2018
 
Plone: The CMS that hits above it's weight
Plone: The CMS that hits above it's weightPlone: The CMS that hits above it's weight
Plone: The CMS that hits above it's weight
 
How to make Ajax work for you
How to make Ajax work for youHow to make Ajax work for you
How to make Ajax work for you
 
Automatic testing and quality assurance for WordPress plugins
Automatic testing and quality assurance for WordPress pluginsAutomatic testing and quality assurance for WordPress plugins
Automatic testing and quality assurance for WordPress plugins
 
Leverage HTTP to deliver cacheable websites - Thijs Feryn - Codemotion Rome 2018
Leverage HTTP to deliver cacheable websites - Thijs Feryn - Codemotion Rome 2018Leverage HTTP to deliver cacheable websites - Thijs Feryn - Codemotion Rome 2018
Leverage HTTP to deliver cacheable websites - Thijs Feryn - Codemotion Rome 2018
 
Leverage HTTP to deliver cacheable websites - Codemotion Rome 2018
Leverage HTTP to deliver cacheable websites - Codemotion Rome 2018Leverage HTTP to deliver cacheable websites - Codemotion Rome 2018
Leverage HTTP to deliver cacheable websites - Codemotion Rome 2018
 

Viewers also liked

Seminário de Desenvolvimento Mobile - Etec Cafelândia
Seminário de Desenvolvimento Mobile - Etec CafelândiaSeminário de Desenvolvimento Mobile - Etec Cafelândia
Seminário de Desenvolvimento Mobile - Etec Cafelândia
Diego Cavalca
 
HTML5 Intro
HTML5 IntroHTML5 Intro
HTML5 Intro
PavingWays Ltd.
 
Intro to html, css & sass
Intro to html, css & sassIntro to html, css & sass
Intro to html, css & sass
Sean Wolfe
 
Html5 intro
Html5 introHtml5 intro
Html5 intro
Ynon Perek
 
Intro to HTML + CSS
Intro to HTML + CSSIntro to HTML + CSS
Intro to HTML + CSS
Jamal Sinclair O'Garro
 
An Intro to HTML & CSS
An Intro to HTML & CSSAn Intro to HTML & CSS
An Intro to HTML & CSS
Shay Howe
 
Intro to HTML
Intro to HTMLIntro to HTML
Intro to HTML
Randy Oest II
 
03 - Web-технологии. Язык разметки HTML
03 - Web-технологии. Язык разметки HTML03 - Web-технологии. Язык разметки HTML
03 - Web-технологии. Язык разметки HTML
Roman Brovko
 

Viewers also liked (8)

Seminário de Desenvolvimento Mobile - Etec Cafelândia
Seminário de Desenvolvimento Mobile - Etec CafelândiaSeminário de Desenvolvimento Mobile - Etec Cafelândia
Seminário de Desenvolvimento Mobile - Etec Cafelândia
 
HTML5 Intro
HTML5 IntroHTML5 Intro
HTML5 Intro
 
Intro to html, css & sass
Intro to html, css & sassIntro to html, css & sass
Intro to html, css & sass
 
Html5 intro
Html5 introHtml5 intro
Html5 intro
 
Intro to HTML + CSS
Intro to HTML + CSSIntro to HTML + CSS
Intro to HTML + CSS
 
An Intro to HTML & CSS
An Intro to HTML & CSSAn Intro to HTML & CSS
An Intro to HTML & CSS
 
Intro to HTML
Intro to HTMLIntro to HTML
Intro to HTML
 
03 - Web-технологии. Язык разметки HTML
03 - Web-технологии. Язык разметки HTML03 - Web-технологии. Язык разметки HTML
03 - Web-технологии. Язык разметки HTML
 

Similar to Html5 intro

DevFest Makerere html5 presentation by caesar mukama
DevFest Makerere html5 presentation by caesar mukamaDevFest Makerere html5 presentation by caesar mukama
DevFest Makerere html5 presentation by caesar mukama
Emily Karungi
 
Html 5
Html 5Html 5
Html 5
Nguyen Quang
 
Web Apps
Web AppsWeb Apps
Web Apps
Tim Wray
 
[In Control 2010] HTML5
[In Control 2010] HTML5[In Control 2010] HTML5
[In Control 2010] HTML5
Christopher Schmitt
 
Looking into HTML5 + CSS3
Looking into HTML5 + CSS3Looking into HTML5 + CSS3
Looking into HTML5 + CSS3
Christopher Schmitt
 
Web Directions @media 2010
Web Directions @media 2010Web Directions @media 2010
Web Directions @media 2010
Patrick Lauke
 
Familiar HTML5 - 事例とサンプルコードから学ぶ 身近で普通に使わているHTML5
Familiar HTML5 - 事例とサンプルコードから学ぶ 身近で普通に使わているHTML5Familiar HTML5 - 事例とサンプルコードから学ぶ 身近で普通に使わているHTML5
Familiar HTML5 - 事例とサンプルコードから学ぶ 身近で普通に使わているHTML5
Sadaaki HIRAI
 
HTML5 (and friends) - History, overview and current status - jsDay Verona 11....
HTML5 (and friends) - History, overview and current status - jsDay Verona 11....HTML5 (and friends) - History, overview and current status - jsDay Verona 11....
HTML5 (and friends) - History, overview and current status - jsDay Verona 11....
Patrick Lauke
 
Brave new world of HTML5
Brave new world of HTML5Brave new world of HTML5
Brave new world of HTML5
Chris Mills
 
webinale2011_Chris Mills_Brave new world of HTML5Html5
webinale2011_Chris Mills_Brave new world of HTML5Html5webinale2011_Chris Mills_Brave new world of HTML5Html5
webinale2011_Chris Mills_Brave new world of HTML5Html5
smueller_sandsmedia
 
Top 10 HTML5 features every developer should know!
Top 10 HTML5 features every developer should know!Top 10 HTML5 features every developer should know!
Top 10 HTML5 features every developer should know!
Gill Cleeren
 
Html5 drupal7 with mandakini kumari(1)
Html5 drupal7 with mandakini kumari(1)Html5 drupal7 with mandakini kumari(1)
Html5 drupal7 with mandakini kumari(1)
Mandakini Kumari
 
The Rich Standard: Getting Familiar with HTML5
The Rich Standard: Getting Familiar with HTML5The Rich Standard: Getting Familiar with HTML5
The Rich Standard: Getting Familiar with HTML5
Todd Anglin
 
HTML5 Refresher
HTML5 RefresherHTML5 Refresher
HTML5 Refresher
Ivano Malavolta
 
Introduccion a HTML5
Introduccion a HTML5Introduccion a HTML5
Introduccion a HTML5
Pablo Garaizar
 
html5
html5html5
Html5 tutorial
Html5 tutorialHtml5 tutorial
Html5 tutorial
madhavforu
 
HTML5 Design
HTML5 DesignHTML5 Design
HTML5 Design
Christopher Schmitt
 
Leave No One Behind with HTML5 - FFWD.PRO, Croatia
Leave No One Behind with HTML5 - FFWD.PRO, CroatiaLeave No One Behind with HTML5 - FFWD.PRO, Croatia
Leave No One Behind with HTML5 - FFWD.PRO, Croatia
Robert Nyman
 
Html5 + css3+ java script for future - HTML5
Html5 + css3+ java script for future - HTML5Html5 + css3+ java script for future - HTML5
Html5 + css3+ java script for future - HTML5
Harshana Weerasinghe
 

Similar to Html5 intro (20)

DevFest Makerere html5 presentation by caesar mukama
DevFest Makerere html5 presentation by caesar mukamaDevFest Makerere html5 presentation by caesar mukama
DevFest Makerere html5 presentation by caesar mukama
 
Html 5
Html 5Html 5
Html 5
 
Web Apps
Web AppsWeb Apps
Web Apps
 
[In Control 2010] HTML5
[In Control 2010] HTML5[In Control 2010] HTML5
[In Control 2010] HTML5
 
Looking into HTML5 + CSS3
Looking into HTML5 + CSS3Looking into HTML5 + CSS3
Looking into HTML5 + CSS3
 
Web Directions @media 2010
Web Directions @media 2010Web Directions @media 2010
Web Directions @media 2010
 
Familiar HTML5 - 事例とサンプルコードから学ぶ 身近で普通に使わているHTML5
Familiar HTML5 - 事例とサンプルコードから学ぶ 身近で普通に使わているHTML5Familiar HTML5 - 事例とサンプルコードから学ぶ 身近で普通に使わているHTML5
Familiar HTML5 - 事例とサンプルコードから学ぶ 身近で普通に使わているHTML5
 
HTML5 (and friends) - History, overview and current status - jsDay Verona 11....
HTML5 (and friends) - History, overview and current status - jsDay Verona 11....HTML5 (and friends) - History, overview and current status - jsDay Verona 11....
HTML5 (and friends) - History, overview and current status - jsDay Verona 11....
 
Brave new world of HTML5
Brave new world of HTML5Brave new world of HTML5
Brave new world of HTML5
 
webinale2011_Chris Mills_Brave new world of HTML5Html5
webinale2011_Chris Mills_Brave new world of HTML5Html5webinale2011_Chris Mills_Brave new world of HTML5Html5
webinale2011_Chris Mills_Brave new world of HTML5Html5
 
Top 10 HTML5 features every developer should know!
Top 10 HTML5 features every developer should know!Top 10 HTML5 features every developer should know!
Top 10 HTML5 features every developer should know!
 
Html5 drupal7 with mandakini kumari(1)
Html5 drupal7 with mandakini kumari(1)Html5 drupal7 with mandakini kumari(1)
Html5 drupal7 with mandakini kumari(1)
 
The Rich Standard: Getting Familiar with HTML5
The Rich Standard: Getting Familiar with HTML5The Rich Standard: Getting Familiar with HTML5
The Rich Standard: Getting Familiar with HTML5
 
HTML5 Refresher
HTML5 RefresherHTML5 Refresher
HTML5 Refresher
 
Introduccion a HTML5
Introduccion a HTML5Introduccion a HTML5
Introduccion a HTML5
 
html5
html5html5
html5
 
Html5 tutorial
Html5 tutorialHtml5 tutorial
Html5 tutorial
 
HTML5 Design
HTML5 DesignHTML5 Design
HTML5 Design
 
Leave No One Behind with HTML5 - FFWD.PRO, Croatia
Leave No One Behind with HTML5 - FFWD.PRO, CroatiaLeave No One Behind with HTML5 - FFWD.PRO, Croatia
Leave No One Behind with HTML5 - FFWD.PRO, Croatia
 
Html5 + css3+ java script for future - HTML5
Html5 + css3+ java script for future - HTML5Html5 + css3+ java script for future - HTML5
Html5 + css3+ java script for future - HTML5
 

More from Kevin DeRudder

Build your own Cloud/Home security system for 60$
Build your own Cloud/Home security system for 60$Build your own Cloud/Home security system for 60$
Build your own Cloud/Home security system for 60$
Kevin DeRudder
 
Comparing xaml and html
Comparing xaml and htmlComparing xaml and html
Comparing xaml and html
Kevin DeRudder
 
ECMASCRIPT.NEXT
ECMASCRIPT.NEXTECMASCRIPT.NEXT
ECMASCRIPT.NEXT
Kevin DeRudder
 
VISUG: Visual studio for web developers
VISUG: Visual studio for web developersVISUG: Visual studio for web developers
VISUG: Visual studio for web developers
Kevin DeRudder
 
Testing apps with MTM and Tea Foundation Service
Testing apps with MTM and Tea Foundation ServiceTesting apps with MTM and Tea Foundation Service
Testing apps with MTM and Tea Foundation Service
Kevin DeRudder
 
ECMAScript.Next ECMAScipt 6
ECMAScript.Next ECMAScipt 6ECMAScript.Next ECMAScipt 6
ECMAScript.Next ECMAScipt 6
Kevin DeRudder
 
Building cross platform applications using Windows Azure Mobile Services
Building cross platform applications using Windows Azure Mobile ServicesBuilding cross platform applications using Windows Azure Mobile Services
Building cross platform applications using Windows Azure Mobile Services
Kevin DeRudder
 
Responsive SharePoint
Responsive SharePointResponsive SharePoint
Responsive SharePoint
Kevin DeRudder
 
Use html5 to build what you want, where you want it
Use html5 to build what you want, where you want itUse html5 to build what you want, where you want it
Use html5 to build what you want, where you want it
Kevin DeRudder
 
Developers and Designers
Developers and DesignersDevelopers and Designers
Developers and Designers
Kevin DeRudder
 
Every Web Developer is a Win8 developer
Every Web Developer is a Win8 developerEvery Web Developer is a Win8 developer
Every Web Developer is a Win8 developer
Kevin DeRudder
 
Media queries
Media queriesMedia queries
Media queries
Kevin DeRudder
 

More from Kevin DeRudder (12)

Build your own Cloud/Home security system for 60$
Build your own Cloud/Home security system for 60$Build your own Cloud/Home security system for 60$
Build your own Cloud/Home security system for 60$
 
Comparing xaml and html
Comparing xaml and htmlComparing xaml and html
Comparing xaml and html
 
ECMASCRIPT.NEXT
ECMASCRIPT.NEXTECMASCRIPT.NEXT
ECMASCRIPT.NEXT
 
VISUG: Visual studio for web developers
VISUG: Visual studio for web developersVISUG: Visual studio for web developers
VISUG: Visual studio for web developers
 
Testing apps with MTM and Tea Foundation Service
Testing apps with MTM and Tea Foundation ServiceTesting apps with MTM and Tea Foundation Service
Testing apps with MTM and Tea Foundation Service
 
ECMAScript.Next ECMAScipt 6
ECMAScript.Next ECMAScipt 6ECMAScript.Next ECMAScipt 6
ECMAScript.Next ECMAScipt 6
 
Building cross platform applications using Windows Azure Mobile Services
Building cross platform applications using Windows Azure Mobile ServicesBuilding cross platform applications using Windows Azure Mobile Services
Building cross platform applications using Windows Azure Mobile Services
 
Responsive SharePoint
Responsive SharePointResponsive SharePoint
Responsive SharePoint
 
Use html5 to build what you want, where you want it
Use html5 to build what you want, where you want itUse html5 to build what you want, where you want it
Use html5 to build what you want, where you want it
 
Developers and Designers
Developers and DesignersDevelopers and Designers
Developers and Designers
 
Every Web Developer is a Win8 developer
Every Web Developer is a Win8 developerEvery Web Developer is a Win8 developer
Every Web Developer is a Win8 developer
 
Media queries
Media queriesMedia queries
Media queries
 

Recently uploaded

BT & Neo4j: Knowledge Graphs for Critical Enterprise Systems.pptx.pdf
BT & Neo4j: Knowledge Graphs for Critical Enterprise Systems.pptx.pdfBT & Neo4j: Knowledge Graphs for Critical Enterprise Systems.pptx.pdf
BT & Neo4j: Knowledge Graphs for Critical Enterprise Systems.pptx.pdf
Neo4j
 
Quality Patents: Patents That Stand the Test of Time
Quality Patents: Patents That Stand the Test of TimeQuality Patents: Patents That Stand the Test of Time
Quality Patents: Patents That Stand the Test of Time
Aurora Consulting
 
Coordinate Systems in FME 101 - Webinar Slides
Coordinate Systems in FME 101 - Webinar SlidesCoordinate Systems in FME 101 - Webinar Slides
Coordinate Systems in FME 101 - Webinar Slides
Safe Software
 
Password Rotation in 2024 is still Relevant
Password Rotation in 2024 is still RelevantPassword Rotation in 2024 is still Relevant
Password Rotation in 2024 is still Relevant
Bert Blevins
 
WPRiders Company Presentation Slide Deck
WPRiders Company Presentation Slide DeckWPRiders Company Presentation Slide Deck
WPRiders Company Presentation Slide Deck
Lidia A.
 
Cookies program to display the information though cookie creation
Cookies program to display the information though cookie creationCookies program to display the information though cookie creation
Cookies program to display the information though cookie creation
shanthidl1
 
The Rise of Supernetwork Data Intensive Computing
The Rise of Supernetwork Data Intensive ComputingThe Rise of Supernetwork Data Intensive Computing
The Rise of Supernetwork Data Intensive Computing
Larry Smarr
 
Active Inference is a veryyyyyyyyyyyyyyyyyyyyyyyy
Active Inference is a veryyyyyyyyyyyyyyyyyyyyyyyyActive Inference is a veryyyyyyyyyyyyyyyyyyyyyyyy
Active Inference is a veryyyyyyyyyyyyyyyyyyyyyyyy
RaminGhanbari2
 
Choose our Linux Web Hosting for a seamless and successful online presence
Choose our Linux Web Hosting for a seamless and successful online presenceChoose our Linux Web Hosting for a seamless and successful online presence
Choose our Linux Web Hosting for a seamless and successful online presence
rajancomputerfbd
 
Research Directions for Cross Reality Interfaces
Research Directions for Cross Reality InterfacesResearch Directions for Cross Reality Interfaces
Research Directions for Cross Reality Interfaces
Mark Billinghurst
 
How Social Media Hackers Help You to See Your Wife's Message.pdf
How Social Media Hackers Help You to See Your Wife's Message.pdfHow Social Media Hackers Help You to See Your Wife's Message.pdf
How Social Media Hackers Help You to See Your Wife's Message.pdf
HackersList
 
7 Most Powerful Solar Storms in the History of Earth.pdf
7 Most Powerful Solar Storms in the History of Earth.pdf7 Most Powerful Solar Storms in the History of Earth.pdf
7 Most Powerful Solar Storms in the History of Earth.pdf
Enterprise Wired
 
UiPath Community Day Kraków: Devs4Devs Conference
UiPath Community Day Kraków: Devs4Devs ConferenceUiPath Community Day Kraków: Devs4Devs Conference
UiPath Community Day Kraków: Devs4Devs Conference
UiPathCommunity
 
What's New in Copilot for Microsoft365 May 2024.pptx
What's New in Copilot for Microsoft365 May 2024.pptxWhat's New in Copilot for Microsoft365 May 2024.pptx
What's New in Copilot for Microsoft365 May 2024.pptx
Stephanie Beckett
 
Mitigating the Impact of State Management in Cloud Stream Processing Systems
Mitigating the Impact of State Management in Cloud Stream Processing SystemsMitigating the Impact of State Management in Cloud Stream Processing Systems
Mitigating the Impact of State Management in Cloud Stream Processing Systems
ScyllaDB
 
Measuring the Impact of Network Latency at Twitter
Measuring the Impact of Network Latency at TwitterMeasuring the Impact of Network Latency at Twitter
Measuring the Impact of Network Latency at Twitter
ScyllaDB
 
Transcript: Details of description part II: Describing images in practice - T...
Transcript: Details of description part II: Describing images in practice - T...Transcript: Details of description part II: Describing images in practice - T...
Transcript: Details of description part II: Describing images in practice - T...
BookNet Canada
 
20240702 QFM021 Machine Intelligence Reading List June 2024
20240702 QFM021 Machine Intelligence Reading List June 202420240702 QFM021 Machine Intelligence Reading List June 2024
20240702 QFM021 Machine Intelligence Reading List June 2024
Matthew Sinclair
 
How RPA Help in the Transportation and Logistics Industry.pptx
How RPA Help in the Transportation and Logistics Industry.pptxHow RPA Help in the Transportation and Logistics Industry.pptx
How RPA Help in the Transportation and Logistics Industry.pptx
SynapseIndia
 
Quantum Communications Q&A with Gemini LLM
Quantum Communications Q&A with Gemini LLMQuantum Communications Q&A with Gemini LLM
Quantum Communications Q&A with Gemini LLM
Vijayananda Mohire
 

Recently uploaded (20)

BT & Neo4j: Knowledge Graphs for Critical Enterprise Systems.pptx.pdf
BT & Neo4j: Knowledge Graphs for Critical Enterprise Systems.pptx.pdfBT & Neo4j: Knowledge Graphs for Critical Enterprise Systems.pptx.pdf
BT & Neo4j: Knowledge Graphs for Critical Enterprise Systems.pptx.pdf
 
Quality Patents: Patents That Stand the Test of Time
Quality Patents: Patents That Stand the Test of TimeQuality Patents: Patents That Stand the Test of Time
Quality Patents: Patents That Stand the Test of Time
 
Coordinate Systems in FME 101 - Webinar Slides
Coordinate Systems in FME 101 - Webinar SlidesCoordinate Systems in FME 101 - Webinar Slides
Coordinate Systems in FME 101 - Webinar Slides
 
Password Rotation in 2024 is still Relevant
Password Rotation in 2024 is still RelevantPassword Rotation in 2024 is still Relevant
Password Rotation in 2024 is still Relevant
 
WPRiders Company Presentation Slide Deck
WPRiders Company Presentation Slide DeckWPRiders Company Presentation Slide Deck
WPRiders Company Presentation Slide Deck
 
Cookies program to display the information though cookie creation
Cookies program to display the information though cookie creationCookies program to display the information though cookie creation
Cookies program to display the information though cookie creation
 
The Rise of Supernetwork Data Intensive Computing
The Rise of Supernetwork Data Intensive ComputingThe Rise of Supernetwork Data Intensive Computing
The Rise of Supernetwork Data Intensive Computing
 
Active Inference is a veryyyyyyyyyyyyyyyyyyyyyyyy
Active Inference is a veryyyyyyyyyyyyyyyyyyyyyyyyActive Inference is a veryyyyyyyyyyyyyyyyyyyyyyyy
Active Inference is a veryyyyyyyyyyyyyyyyyyyyyyyy
 
Choose our Linux Web Hosting for a seamless and successful online presence
Choose our Linux Web Hosting for a seamless and successful online presenceChoose our Linux Web Hosting for a seamless and successful online presence
Choose our Linux Web Hosting for a seamless and successful online presence
 
Research Directions for Cross Reality Interfaces
Research Directions for Cross Reality InterfacesResearch Directions for Cross Reality Interfaces
Research Directions for Cross Reality Interfaces
 
How Social Media Hackers Help You to See Your Wife's Message.pdf
How Social Media Hackers Help You to See Your Wife's Message.pdfHow Social Media Hackers Help You to See Your Wife's Message.pdf
How Social Media Hackers Help You to See Your Wife's Message.pdf
 
7 Most Powerful Solar Storms in the History of Earth.pdf
7 Most Powerful Solar Storms in the History of Earth.pdf7 Most Powerful Solar Storms in the History of Earth.pdf
7 Most Powerful Solar Storms in the History of Earth.pdf
 
UiPath Community Day Kraków: Devs4Devs Conference
UiPath Community Day Kraków: Devs4Devs ConferenceUiPath Community Day Kraków: Devs4Devs Conference
UiPath Community Day Kraków: Devs4Devs Conference
 
What's New in Copilot for Microsoft365 May 2024.pptx
What's New in Copilot for Microsoft365 May 2024.pptxWhat's New in Copilot for Microsoft365 May 2024.pptx
What's New in Copilot for Microsoft365 May 2024.pptx
 
Mitigating the Impact of State Management in Cloud Stream Processing Systems
Mitigating the Impact of State Management in Cloud Stream Processing SystemsMitigating the Impact of State Management in Cloud Stream Processing Systems
Mitigating the Impact of State Management in Cloud Stream Processing Systems
 
Measuring the Impact of Network Latency at Twitter
Measuring the Impact of Network Latency at TwitterMeasuring the Impact of Network Latency at Twitter
Measuring the Impact of Network Latency at Twitter
 
Transcript: Details of description part II: Describing images in practice - T...
Transcript: Details of description part II: Describing images in practice - T...Transcript: Details of description part II: Describing images in practice - T...
Transcript: Details of description part II: Describing images in practice - T...
 
20240702 QFM021 Machine Intelligence Reading List June 2024
20240702 QFM021 Machine Intelligence Reading List June 202420240702 QFM021 Machine Intelligence Reading List June 2024
20240702 QFM021 Machine Intelligence Reading List June 2024
 
How RPA Help in the Transportation and Logistics Industry.pptx
How RPA Help in the Transportation and Logistics Industry.pptxHow RPA Help in the Transportation and Logistics Industry.pptx
How RPA Help in the Transportation and Logistics Industry.pptx
 
Quantum Communications Q&A with Gemini LLM
Quantum Communications Q&A with Gemini LLMQuantum Communications Q&A with Gemini LLM
Quantum Communications Q&A with Gemini LLM
 

Html5 intro