Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Moderne Web Technologieën - KHLim
Search
Sponsored
·
Ship Features Fearlessly
Turn features on and off without deploys. Used by thousands of Ruby developers.
→
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.
Inventis Web Architects
April 20, 2012
Tweet
Share
More Decks by Inventis Web Architects
See All by Inventis Web Architects
Pukkelpop.be, the continuous search for innovation.
inventis
0
140
Social Media
inventis
6
400
Informatie Architectuur & WireFraming
inventis
2
290
Verkoopproces
inventis
1
260
Inventis Stages
inventis
1
83
HTML5 & CSS3
inventis
5
680
Voorstelling Inventis MasterClass
inventis
0
230
Call to action - best practices.
inventis
1
130
Inventis Facebook Experiment
inventis
0
170
Other Decks in Technology
See All in Technology
OCI技術資料 : コンピュート・サービス 概要
ocise
4
54k
JAWSDAYS2026 [C02] 楽しく学ぼう!AWSとは?AWSの歴史 入門
hiragahh
0
120
AI時代のSaaSとETL
shoe116
1
120
Evolution of Claude Code & How to use features
oikon48
1
590
わからなくて良いなら、わからなきゃだめなの?
kotaoue
1
290
白金鉱業Meetup_Vol.22_Orbital Senseを支える衛星画像のマルチモーダルエンベディングと地理空間のあいまい検索技術
brainpadpr
2
290
JAWSDAYS2026_A-6_現場SEが語る 回せるセキュリティ運用~設計で可視化、AIで加速する「楽に回る」運用設計のコツ~
shoki_hata
0
3k
[2026-03-07]あの日諦めたスクラムの答えを僕達はまだ探している。〜守ることと、諦めることと、それでも前に進むチームの話〜
tosite
0
200
Abuse report だけじゃない。AWS から緊急連絡が来る状況とは?昨今の攻撃や被害の事例の紹介と備えておきたい考え方について
kazzpapa3
1
550
Claude Code のコード品質がばらつくので AI に品質保証させる仕組みを作った話 / A story about building a mechanism to have AI ensure quality, because the code quality from Claude Code was inconsistent
nrslib
13
7k
Shifting from MCP to Skills / ベストプラクティスの変遷を辿る
yamanoku
4
820
タスク管理も1on1も、もう「管理」じゃない ― KiroとBedrock AgentCoreで変わった"判断の仕事"
yusukeshimizu
5
2.6k
Featured
See All Featured
Navigating the Design Leadership Dip - Product Design Week Design Leaders+ Conference 2024
apolaine
0
220
Improving Core Web Vitals using Speculation Rules API
sergeychernyshev
21
1.4k
AI: The stuff that nobody shows you
jnunemaker
PRO
3
380
世界の人気アプリ100個を分析して見えたペイウォール設計の心得
akihiro_kokubo
PRO
67
37k
The Web Performance Landscape in 2024 [PerfNow 2024]
tammyeverts
12
1.1k
Beyond borders and beyond the search box: How to win the global "messy middle" with AI-driven SEO
davidcarrasco
3
68
Lightning Talk: Beautiful Slides for Beginners
inesmontani
PRO
1
480
How People are Using Generative and Agentic AI to Supercharge Their Products, Projects, Services and Value Streams Today
helenjbeal
1
140
Reflections from 52 weeks, 52 projects
jeffersonlam
356
21k
Collaborative Software Design: How to facilitate domain modelling decisions
baasie
0
160
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
rmw
35
3.4k
Faster Mobile Websites
deanohume
310
31k
Transcript
Moderne Web Technologieën Tom Claus & Stijn Janssen
Stijn Janssen @stijnj
Tom Claus @tomclaus
None
None
None
None
None
• HTML5 Semantiek en Markup • CSS3 • Offline opslag
• Realtime communicatie • Javascript API’s • Multimedia Moderne Web Technologieën
• HTML5 Semantiek en Markup • CSS3 • Offline opslag
• Realtime communicatie • Javascript API’s • Multimedia Moderne Web Technologieën
None
HTML5?
HTML5 CSS3 Javascript SVG @font-face XML
Living Standard specificatie geen finale versie snelle implementatie -webkit -moz
Nieuwe elementen section article time header footer nav
None
<audio>
<video>
Adobe Flash
<canvas>
Adobe Flash
<svg>
forms required email date number tel search color range
forms required email datae number tel search color range
forms required email date number tel search color range
forms required email date number tel search color range
forms required email date number tel search color range
forms required email date number tel search color range
forms required email date number tel search color range
forms required email date number tel search color range
CSS3
FontFace
Border-Radius
Text-Shadow
Box-Shadow
Gradients
Gradients http://colorzilla.com/gradient-editor/
Transform
Transform
BoxModel
RGBA/HSLA
Animations
Selectors
Media Queries
Media Queries http://mediaqueri.es
Cross Browser? http://caniuse.com
Cross Browser? http://caniuse.com http://selectivizr.com
Cross Browser? http://caniuse.com http://selectivizr.com Respond.js
Javascript
None
44% 2006 9404
Een goede plugin? • Open source? GitHub? • Veel updates?
• Bugs? • Google: “[plugin] doensn’t work”
Een goede plugin? • Open source? GitHub? • Veel updates?
• Bugs? • Google: “[plugin] doensn’t work”
Een goede plugin? • Open source? GitHub? • Veel updates?
• Bugs? • Google: “[plugin] doensn’t work”
Een goede plugin? • Open source? GitHub? • Veel updates?
• Bugs? • Google: “[plugin] doensn’t work”
Onze favorieten! • html5validator • prettyPhoto • cycle
Onze favorieten! • html5validator • prettyPhoto • cycle
Onze favorieten! • html5validator • prettyPhoto • cycle
Geolocate API
Accelerometer
Casestudies
http://pukkelpop.be
http://inventis.be
Voordelen? • Meer mogelijkheden in de browser • Sneller laadtijden
• Scherpere layout
Nadelen? • Cross browser krijgen • Meer CSS-code / minder
overzicht
Vragen?
Bedankt! • Tom Claus •
[email protected]
• @tomclaus • Stijn
Janssen •
[email protected]
• @stijnj