Opendeurdag html5
Upcoming SlideShare
Loading in...5
×
 

Opendeurdag html5

on

  • 570 views

Presentatie Ivo De Wispelaere tijdens OpenDAMdag / Open leerweek van www.waasendurme.be

Presentatie Ivo De Wispelaere tijdens OpenDAMdag / Open leerweek van www.waasendurme.be

Statistics

Views

Total Views
570
Views on SlideShare
524
Embed Views
46

Actions

Likes
0
Downloads
1
Comments
0

2 Embeds 46

http://www.wordwebdesigner.be 26
http://wordwebdesigner.be 20

Accessibility

Categories

Upload Details

Uploaded via as Microsoft PowerPoint

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

    Opendeurdag html5 Opendeurdag html5 Presentation Transcript

    • www.waasendurme.be – info@waasendurme.be
      HTML5 en CSS3
      ….alles evolueert verder…
    • Wat?
      Wat is HTML5?
      HTML5 is de nieuwste telg van de internettaal HTML.Doel: gebruik van proprietaryinternet-technologie als Adobe Flash, Microsoft Silverlight en Sun JavaFX overbodig te makenHTML5 maakt het voor webpagina’s mogelijk om tekst, afbeeldingen, multimedia en webapplicaties weer te geven in een browser.
      Wat is CSS3?
      Veel nieuwe functies in css met extra opmaakmogelijkheden
      www.waasendurme.be – info@waasendurme.be
    • Nieuwigheden in HTML5
      SemanticMarkup
      Geolocation
      FormEnhancements
      Audio / Video
      Canvas
      ContentEditable
      Drag and Drop
      Persistent Data Storage
      www.waasendurme.be – info@waasendurme.be
    • Nieuwigheden in HTML5
      Vb1: SemanticMarkup
      www.waasendurme.be – info@waasendurme.be
    • Nieuwigheden in HTML5
      Vb 2: Geolocation
      Geografische locatie op basis van IP-adres
      Nut: “content locationawareness”http://html5demos.com/geohttp://www.hoppinger.com/blog/2010/04/01/html5-apis-geolocation-api/
      www.waasendurme.be – info@waasendurme.be
    • Nieuwigheden in HTML5
      Vb 3:
      Formenhancementshttp://richardshepherd.com/tv/forms/
      www.waasendurme.be – info@waasendurme.be
    • Nieuwigheden in CSS3
      Randeffecten
      Onbeperkte lettertypes
      Schaduw-effecten
      Schaalbare achtergrond-afbeeldingen
      Verloop
      Tekstkolommen
      Transparantie
      Pseudo-classes
      ….
      www.waasendurme.be – info@waasendurme.be
    • Problemen
      Browsercompatibiliteit: een website wordt op verschillende browsers anders weergegeven.
      www.waasendurme.be – info@waasendurme.be
    • Oplossingen
      Javascripts voor browserupgrade
      Per browser aparte cssspecifiëren
      Voor oudere browsers: streven naar acceptabele layout
      www.waasendurme.be – info@waasendurme.be
    • Apparaten
      Per apparaat kan een andere opmaak (via css) toegepast worden via media-queries.
      www.waasendurme.be – info@waasendurme.be
    • Voorbeelden
      Schaalbare achtergrond: http://www.alistapart.com/d/supersize-that-background-please/index3.html (via Firefox)
      www.waasendurme.be – info@waasendurme.be
    • Voorbeelden II
      Randen, schaduw, kolommen:
      http://www.kreatuur.be/pcvo/upgrades/html5_intro/oefeningen/htm5_2_css_toevoegen/index.html(via Firefox)
      www.waasendurme.be – info@waasendurme.be
    • Voorbeelden III
      Media queries: layout past zich aan aanappararaat
      http://webdesignerwall.com/demo/adaptive-design/final.html (via Firefox; test via ipadpeek.com)
      www.waasendurme.be – info@waasendurme.be