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

Moderne Web Technologieën

Avatar for Tom Claus Tom Claus
April 20, 2012
Technology
1
93

Moderne Web Technologieën

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

Avatar for Tom Claus

Tom Claus

April 20, 2012
Tweet

More Decks by Tom Claus

See All by Tom Claus
Responsive Webdesign
Avatar for Tom Claus tomclaus
4
230
Infosessions testgroup - New Platform
Avatar for Tom Claus tomclaus
0
58
Modern Technologies
Avatar for Tom Claus tomclaus
2
360
Social Media
Avatar for Tom Claus tomclaus
5
210
Responsive & Content
Avatar for Tom Claus tomclaus
2
150
VikingSpots NG
Avatar for Tom Claus tomclaus
1
80
Budget Travelling
Avatar for Tom Claus tomclaus
4
120
Inventis Stages
Avatar for Tom Claus tomclaus
1
77
HTML5 & CSS3
Avatar for Tom Claus tomclaus
2
390

Other Decks in Technology

See All in Technology
AIBuildersDay_track_A_iidaxs
Avatar for iidaxs iidaxs
4
1.3k
Lookerで実現するセキュアな外部データ提供
Avatar for ZOZO Developers zozotech
PRO
0
200
Oracle Database@Google Cloud：サービス概要のご紹介
Avatar for oracle4engineer oracle4engineer
PRO
1
760
フィッシュボウルのやり方 / How to do a fishbowl
Avatar for Pauli pauli
2
370
Bedrock AgentCore Evaluationsで学ぶLLM as a judge入門
Avatar for ShichijoYuhi shichijoyuhi
2
240
ソフトウェアエンジニアとAIエンジニアの役割分担についてのある事例
Avatar for KNOWLEDGE WORK / 株式会社ナレッジワーク kworkdev
PRO
0
220
松尾研LLM講座2025 応用編Day3「軽量化」 講義資料
Avatar for Aratako aratako
3
2.8k
Entity Framework Core におけるIN句クエリ最適化について
Avatar for tkym htkym
0
120
SREが取り組むデプロイ高速化 ─ Docker Buildを最適化した話
Avatar for capytan capytan
0
140
特別捜査官等研修会
Avatar for Nomizo Nomizo nomizone
0
560
AR Guitar: Expanding Guitar Performance from a Live House to Urban Space
Avatar for Ekito ekito_station
0
150
たまに起きる外部サービスの障害に備えたり備えなかったりする話
Avatar for Sohei Iwahori egmc
0
400

Featured

See All Featured
Six Lessons from altMBA
Avatar for Skipper Chong Warson skipperchong
29
4.1k
Building a Scalable Design System with Sketch
Avatar for Laura Van Doore lauravandoore
463
34k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
Avatar for soudai sone soudai
PRO
196
70k
The Web Performance Landscape in 2024 [PerfNow 2024]
Avatar for Tammy Everts tammyeverts
12
980
Crafting Experiences
Avatar for Bethany Jepchumba bethany
0
22
Improving Core Web Vitals using Speculation Rules API
Avatar for Sergey Chernyshev sergeychernyshev
21
1.3k
From Legacy to Launchpad: Building Startup-Ready Communities
Avatar for Dug Song dugsong
0
110
ピンチをチャンスに：未来をつくるプロダクトロードマップ #pmconf2020
Avatar for Aki / @LoveIdahoBurger aki_iinuma
128
55k
How to Think Like a Performance Engineer
Avatar for Harry Roberts csswizardry
28
2.4k
Lightning Talk: Beautiful Slides for Beginners
Avatar for Ines Montani inesmontani
PRO
1
410
Jamie Indigo - Trashchat’s Guide to Black Boxes: Technical SEO Tactics for LLMs
Avatar for Tech SEO Connect techseoconnect
PRO
0
31
Future Trends and Review - Lecture 12 - Web Technologies (1019888BNR)
Avatar for Beat Signer signer
PRO
0
3.1k

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