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
Responsive Revolution
Search
serge lerner
November 13, 2013
Technology
2
120
Responsive Revolution
Points to keep in-mind while (and before) developing a responsive web project.
serge lerner
November 13, 2013
Tweet
Share
Other Decks in Technology
See All in Technology
20250903_1つのAWSアカウントに複数システムがある環境におけるアクセス制御をABACで実現.pdf
yhana
2
330
AI時代にPdMとPMMはどう連携すべきか / PdM–PMM-collaboration-in-AI-era
rakus_dev
0
280
下手な強制、ダメ!絶対! 「ガードレール」を「檻」にさせない"ガバナンス"の取り方とは?
tsukaman
1
190
スプリントレトロスペクティブはチーム観察の宝庫? 〜チームの衝突レベルに合わせたアプローチ仮説!〜
electricsatie
1
160
ヘブンバーンズレッドのレンダリングパイプライン刷新
gree_tech
PRO
0
540
DuckDB-Wasmを使って ブラウザ上でRDBMSを動かす
hacusk
1
140
Flutterでキャッチしないエラーはどこに行く
taiju59
0
220
テストを軸にした生き残り術
kworkdev
PRO
0
150
【 LLMエンジニアがヒューマノイド開発に挑んでみた 】 - 第104回 Machine Learning 15minutes! Hybrid
soneo1127
0
280
「魔法少女まどか☆マギカ Magia Exedra」の必殺技演出を徹底解剖! -キャラクターの魅力を最大限にファンに届けるためのこだわり-
gree_tech
PRO
0
540
iPhone Eye Tracking機能から学ぶやさしいアクセシビリティ
fujiyamaorange
0
610
AWS環境のリソース調査を Claude Code で効率化 / aws investigate with cc devio2025
masahirokawahara
2
1.2k
Featured
See All Featured
Code Reviewing Like a Champion
maltzj
525
40k
The Art of Programming - Codeland 2020
erikaheidi
55
13k
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
358
30k
Large-scale JavaScript Application Architecture
addyosmani
512
110k
jQuery: Nuts, Bolts and Bling
dougneiner
64
7.9k
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
tammyeverts
8
520
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
PRO
185
54k
The Language of Interfaces
destraynor
161
25k
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
eileencodes
26
3k
Fashionably flexible responsive web design (full day workshop)
malarkey
407
66k
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
285
13k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
34
6k
Transcript
Responsive Revolution
Sergey Lerner Industrial designer Front End Developer
STOP for a moment!
Think like Gary
STYLE
None
STYLE • Usually consistent, But sometimes Not. • Probably will
change in the future. • Should be defined in one place. • Reduce Dependence on Images with CSS. • If its Vector use vector. • Use Relative Units. • Please work with style guides.
LAYOUT
None
LAYOUT • Destine to change. • Always develop a Fluid
Architecture. • Consider different building approaches.
Dude where’s my flying car ?! LOGIC
Dude where’s my flying car ?!
LOGIC • Don’t overkill (Avoid Including Bulky JS Libraries If
You Can Help It). • Use Feature-detection. • Know when to initialize / destroy. • Maybe better of with CSS ?!
PERFORMANCE
None
PERFORMANCE • Consider mobile latency. • Consider CPU. • Load
only what you need. • Avoid Bloats of code. • Look into Rendering. • Large Images are dangerous. • Use Data URIs to Save HTTP Requests.
DEVICE CAPABILITIES
None
DEVICE CAPABILITIES • Touch gestures. • SMS, Call. • Hover.
• URIs: open application. • Use Semantic html to open native Inputs.
CHALLENGES
None
If you're not failing every now and again, it's a
sign you're not doing anything very innovative. Woody Allen
header footer body social gallery navigation feature
None
None
STYLE LAYOUT LOGIC PERFORMANCE DEVICE CAPABILITIES CHALANGES
None
None
None
None
TOOLS to make it just a little bit easier:
Thank You