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
赤煉瓦倉庫勉強会「Databricksを選んだ理由と、絶賛真っ只中のデータ基盤移行体験記」
ivry_presentationmaterials
2
370
Tokyo_reInforce_2025_recap_iam_access_analyzer
hiashisan
0
190
インフラ寄りSREの生存戦略
sansantech
PRO
2
510
ビズリーチが挑む メトリクスを活用した技術的負債の解消 / dev-productivity-con2025
visional_engineering_and_design
3
7.8k
CRE Camp #1 エンジニアリングを民主化するCREチームでありたい話
mntsq
1
130
PO初心者が考えた ”POらしさ”
nb_rady
0
210
OSSのSNSツール「Misskey」をさわってみよう(右下ワイプで私のOSCの20年を振り返ります) / 20250705-osc2025-do
akkiesoft
0
170
KubeCon + CloudNativeCon Japan 2025 Recap
ren510dev
1
390
american airlines®️ USA Contact Numbers: Complete 2025 Support Guide
supportflight
1
110
さくらのIaaS基盤のモニタリングとOpenTelemetry/OSC Hokkaido 2025
fujiwara3
3
450
「クラウドコスト絶対削減」を支える技術—FinOpsを超えた徹底的なクラウドコスト削減の実践論
delta_tech
4
170
Reach American Airlines®️ Instantly: 19 Calling Methods for Fast Support in the USA
flyamerican
1
170
Featured
See All Featured
Easily Structure & Communicate Ideas using Wireframe
afnizarnur
194
16k
KATA
mclloyd
30
14k
Large-scale JavaScript Application Architecture
addyosmani
512
110k
The Art of Delivering Value - GDevCon NA Keynote
reverentgeek
15
1.5k
Code Review Best Practice
trishagee
69
19k
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
eileencodes
138
34k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
130
19k
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
tammyeverts
53
2.9k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
PRO
181
54k
RailsConf 2023
tenderlove
30
1.1k
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
tammyeverts
6
310
We Have a Design System, Now What?
morganepeng
53
7.7k
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