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
100
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
Discord とビルダー&チャットボットの使い方 / How to use Discord and Builder & Chatbots
ks91
PRO
0
130
2024/4/26 コンピュータ歴史博物館解説告知
toshi_atsumi
0
190
AIQ株式会社 エンジニア向け会社紹介資料
aiqlab
0
360
テストプロセスで大事にしていること #jasstnano
makky_tyuyan
0
110
Autonomous Database Cloud 技術詳細 / adb-s_technical_detail_jp
oracle4engineer
PRO
13
35k
Garoon 開発チーム / Garoon development team
cybozuinsideout
PRO
1
2.9k
Tableau事例紹介 / Tableau Case Study of Eureka
kazuya_araki_tokyo
1
170
クラウドサインにおけるプロダクトマネージャーの役割と開発プロセス / 20240410_cloudsign-PdM
bengo4com
1
670
Four keys改善の取り組み事例紹介
sansantech
PRO
2
230
キャラクター制御のためのプロンプト術 for LINE Bot
uezo
0
520
オーナーシップを持つ領域を明確にする
konifar
9
1.7k
長期運用プロジェクトでのMySQLからTiDB移行の検証
colopl
1
590
Featured
See All Featured
How GitHub (no longer) Works
holman
304
140k
The Invisible Side of Design
smashingmag
293
49k
Why You Should Never Use an ORM
jnunemaker
PRO
50
8.6k
[RailsConf 2023 Opening Keynote] The Magic of Rails
eileencodes
8
8.3k
Designing for Performance
lara
601
67k
Ruby is Unlike a Banana
tanoku
95
10k
Gamification - CAS2011
davidbonilla
76
4.6k
Building Your Own Lightsaber
phodgson
97
5.7k
The Art of Programming - Codeland 2020
erikaheidi
41
12k
Testing 201, or: Great Expectations
jmmastey
27
6.3k
Dealing with People You Can't Stand - Big Design 2015
cassininazir
355
22k
A better future with KSS
kneath
230
16k
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