Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Moderne Web Technologieën

Tom Claus
April 20, 2012
Technology
1
88

Moderne Web Technologieën

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

Tom Claus

April 20, 2012
Tweet

More Decks by Tom Claus

See All by Tom Claus
Responsive Webdesign
tomclaus
4
230
Infosessions testgroup - New Platform
tomclaus
0
55
Modern Technologies
tomclaus
2
350
Social Media
tomclaus
5
200
Responsive & Content
tomclaus
2
140
VikingSpots NG
tomclaus
1
77
Budget Travelling
tomclaus
3
120
Inventis Stages
tomclaus
1
74
HTML5 & CSS3
tomclaus
2
380

Other Decks in Technology

See All in Technology
英語が苦手でも学びが得られるWorkshopについて / About the workshop of re:Invent 2024
taquakisatwo
0
550
組み込みアプリパフォーマンス格闘記　検索画面編
wataruhigasi
1
190
サイボウズフロントエンドエキスパートチームについて / FrontendExpert Team
cybozuinsideout
PRO
5
39k
Web APIをなぜつくるのか
mikanichinose
0
890
クレカ・銀行連携機能における “状態”との向き合い方 / SmartBank Engineer LT Event
smartbank
2
120
サービスでLLMを採用したばっかりに振り回され続けたこの一年のあれやこれや
segavvy
2
640
pg_bigmをRustで実装する（第50回PostgreSQLアンカンファレンス@オンライン 発表資料）
shinyakato_
0
130
AI×医用画像の現状と可能性_2024年版/AI×medical_imaging_in_japan_2024
tdys13
0
490
AWS re:Invent 2024 Recap in ZOZO - Serverless で好きなものをしゃべってみた
chongmyungpark
0
550
Opcodeを読んでいたら何故かphp-srcを読んでいた話
murashotaro
0
350
AWS re:Invent 2024 recap
hkoketsu
0
560
20241218_マルチアカウント環境におけるIAM_Access_Analyzerによる権限管理.pdf
nrinetcom
PRO
3
130

Featured

See All Featured
Principles of Awesome APIs and How to Build Them.
keavy
126
17k
10 Git Anti Patterns You Should be Aware of
lemiorhan
PRO
656
59k
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
jcasabona
29
2k
The Language of Interfaces
destraynor
155
24k
Into the Great Unknown - MozCon
thekraken
34
1.6k
Making Projects Easy
brettharned
116
6k
Visualization
eitanlees
146
15k
Embracing the Ebb and Flow
colly
84
4.5k
A better future with KSS
kneath
238
17k
How GitHub (no longer) Works
holman
311
140k
Fireside Chat
paigeccino
34
3.1k
VelocityConf: Rendering Performance Case Studies
addyosmani
326
24k

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