$30 off During Our Annual Pro Sale. View Details »

Moderne Web Technologieën - KHLim

Avatar for Inventis Web Architects Inventis Web Architects
April 20, 2012
Technology
1
130

Moderne Web Technologieën - KHLim

Presentatie les 20/04/2012 aan de PHL/KHLim studenten grafische vormgeving.

Avatar for Inventis Web Architects

Inventis Web Architects

April 20, 2012
Tweet

More Decks by Inventis Web Architects

See All by Inventis Web Architects
Pukkelpop.be, the continuous search for innovation.
Avatar for Inventis Web Architects inventis
0
140
Social Media
Avatar for Inventis Web Architects inventis
6
400
Informatie Architectuur & WireFraming
Avatar for Inventis Web Architects inventis
2
290
Verkoopproces
Avatar for Inventis Web Architects inventis
1
260
Inventis Stages
Avatar for Inventis Web Architects inventis
1
82
HTML5 & CSS3
Avatar for Inventis Web Architects inventis
5
680
Voorstelling Inventis MasterClass
Avatar for Inventis Web Architects inventis
0
230
Call to action - best practices.
Avatar for Inventis Web Architects inventis
1
120
Inventis Facebook Experiment
Avatar for Inventis Web Architects inventis
0
160

Other Decks in Technology

See All in Technology
.NET 10の概要
Avatar for tomokusaba tomokusaba
0
130
モダンデータスタックの理想と現実の間で～1.3億人Vポイントデータ基盤の現在地とこれから～
Avatar for タロウ taromatsui_cccmkhd
1
220
AWS re:Invent 2025~初参加の成果と学び~
Avatar for Kubo kubomasataka
0
170
AIエージェント開発と活用を加速するワークフロー自動生成への挑戦
Avatar for shibuiwilliam shibuiwilliam
4
740
ZOZOの独自性を生み出す「似合う4大要素」の開発サイクル
Avatar for ZOZO Developers zozotech
PRO
0
110
業務のトイルをバスターせよ 〜AI時代の生存戦略〜
Avatar for staka staka121
PRO
2
240
さくらのクラウド開発ふりかえり2025
Avatar for kazeburo kazeburo
2
180
フィッシュボウルのやり方 / How to do a fishbowl
Avatar for Pauli pauli
2
340
まだ間に合う！ Agentic AI on AWSの現在地をやさしく一挙おさらい
Avatar for みのるん minorun365
17
2.1k
20251219 OpenIDファウンデーション・ジャパン紹介 / OpenID Foundation Japan Intro
Avatar for OpenID Foundation Japan oidfj
0
390
20251218_AIを活用した開発生産性向上の全社的な取り組みの進め方について / How to proceed with company-wide initiatives to improve development productivity using AI
Avatar for yayoi_dd yayoi_dd
0
540
ActiveJobUpdates
Avatar for Kuniaki IGARASHI igaiga
1
290

Featured

See All Featured
For a Future-Friendly Web
Avatar for Brad Frost brad_frost
180
10k
The Invisible Side of Design
Avatar for Vitaly Friedman smashingmag
302
51k
[RailsConf 2023] Rails as a piece of cake
Avatar for Vladimir Dementyev palkan
58
6.2k
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
Avatar for Tammy Everts tammyeverts
10
740
Building an army of robots
Avatar for Kyle Neath kneath
306
46k
AI Search: Implications for SEO and How to Move Forward - #ShenzhenSEOConference
Avatar for Aleyda Solis aleyda
1
1k
Accessibility Awareness
Avatar for Sarah Abderemane sabderemane
0
18
Sharpening the Axe: The Primacy of Toolmaking
Avatar for Bryan Cantrill bcantrill
46
2.6k
Getting science done with accelerated Python computing platforms
Avatar for Jacob Tomlinson jacobtomlinson
0
75
Tell your own story through comics
Avatar for letsgokoyo letsgokoyo
0
750
Making the Leap to Tech Lead
Avatar for Ryan Cromwell cromwellryan
135
9.7k
The Cost Of JavaScript in 2023
Avatar for Addy Osmani addyosmani
55
9.4k

Transcript

  1. Moderne Web Technologieën Tom Claus & Stijn Janssen

  2. Stijn Janssen @stijnj

  3. Tom Claus @tomclaus

  4. None
  5. None
  6. None
  7. None
  8. None

  9. • HTML5 Semantiek en Markup • CSS3 • Offline opslag

    • Realtime communicatie • Javascript API’s • Multimedia Moderne Web Technologieën

  10. • HTML5 Semantiek en Markup • CSS3 • Offline opslag

    • Realtime communicatie • Javascript API’s • Multimedia Moderne Web Technologieën
  11. None

  12. HTML5?

  13. HTML5 CSS3 Javascript SVG @font-face XML

  14. Living Standard specificatie geen finale versie snelle implementatie -webkit -moz

  15. Nieuwe elementen section article time header footer nav

  16. None

  17. <audio>

  18. <video>

  19. Adobe Flash

  20. <canvas>

  21. Adobe Flash

  22. <svg>

  23. forms required email date number tel search color range

  24. forms required email datae number tel search color range

  25. forms required email date number tel search color range

  26. forms required email date number tel search color range

  27. forms required email date number tel search color range

  28. forms required email date number tel search color range

  29. forms required email date number tel search color range

  30. forms required email date number tel search color range

  31. CSS3

  32. FontFace

  33. Border-Radius

  34. Text-Shadow

  35. Box-Shadow

  36. Gradients

  37. Gradients http://colorzilla.com/gradient-editor/

  38. Transform

  39. Transform

  40. BoxModel

  41. RGBA/HSLA

  42. Animations

  43. Selectors

  44. Media Queries

  45. Media Queries http://mediaqueri.es

  46. Cross Browser? http://caniuse.com

  47. Cross Browser? http://caniuse.com http://selectivizr.com

  48. Cross Browser? http://caniuse.com http://selectivizr.com Respond.js

  49. Javascript

  50. None

  51. 44% 2006 9404

  52. Een goede plugin? • Open source? GitHub? • Veel updates?

    • Bugs? • Google: “[plugin] doensn’t work”

  53. Een goede plugin? • Open source? GitHub? • Veel updates?

    • Bugs? • Google: “[plugin] doensn’t work”

  54. Een goede plugin? • Open source? GitHub? • Veel updates?

    • Bugs? • Google: “[plugin] doensn’t work”

  55. Een goede plugin? • Open source? GitHub? • Veel updates?

    • Bugs? • Google: “[plugin] doensn’t work”

  56. Onze favorieten! • html5validator • prettyPhoto • cycle

  57. Onze favorieten! • html5validator • prettyPhoto • cycle

  58. Onze favorieten! • html5validator • prettyPhoto • cycle

  59. Geolocate API

  60. Accelerometer

  61. Casestudies

  62. http://pukkelpop.be

  63. http://inventis.be

  64. Voordelen? • Meer mogelijkheden in de browser • Sneller laadtijden

    • Scherpere layout

  65. Nadelen? • Cross browser krijgen • Meer CSS-code / minder

    overzicht

  66. Vragen?

  67. Bedankt! • Tom Claus • [email protected] • @tomclaus • Stijn

    Janssen • [email protected] • @stijnj