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
CSS Best Practices
Search
Sponsored
·
Your Podcast. Everywhere. Effortlessly.
Share. Educate. Inspire. Entertain. You do you. We'll handle the rest.
→
mahdi pedramrazi
November 19, 2013
Programming
0
130
CSS Best Practices
mahdi pedramrazi
November 19, 2013
Tweet
Share
More Decks by mahdi pedramrazi
See All by mahdi pedramrazi
CSS Shapes
pedramphp
1
66
Node.js Application Architecture.
pedramphp
0
870
Build Your Application On Node.js
pedramphp
1
130
How to write UI Components
pedramphp
0
96
Other Decks in Programming
See All in Programming
インターン生でもAuth0で認証基盤刷新が出来るのか
taku271
0
190
AI巻き込み型コードレビューのススメ
nealle
0
130
AI前提で考えるiOSアプリのモダナイズ設計
yuukiw00w
0
220
CSC307 Lecture 03
javiergs
PRO
1
490
AgentCoreとHuman in the Loop
har1101
5
220
フロントエンド開発の勘所 -複数事業を経験して見えた判断軸の違い-
heimusu
7
2.8k
OSSとなったswift-buildで Xcodeのビルドを差し替えられるため 自分でXcodeを直せる時代になっている ダイアモンド問題編
yimajo
3
610
Spinner 軸ズレ現象を調べたらレンダリング深淵に飲まれた #レバテックMeetup
bengo4com
1
230
IFSによる形状設計/デモシーンの魅力 @ 慶應大学SFC
gam0022
1
300
CSC307 Lecture 04
javiergs
PRO
0
660
CSC307 Lecture 05
javiergs
PRO
0
500
コントリビューターによるDenoのすゝめ / Deno Recommendations by a Contributor
petamoriken
0
200
Featured
See All Featured
How to train your dragon (web standard)
notwaldorf
97
6.5k
SERP Conf. Vienna - Web Accessibility: Optimizing for Inclusivity and SEO
sarafernandez
1
1.3k
Mobile First: as difficult as doing things right
swwweet
225
10k
Understanding Cognitive Biases in Performance Measurement
bluesmoon
32
2.8k
Ethics towards AI in product and experience design
skipperchong
2
190
Learning to Love Humans: Emotional Interface Design
aarron
275
41k
Building Flexible Design Systems
yeseniaperezcruz
330
40k
Lessons Learnt from Crawling 1000+ Websites
charlesmeaden
PRO
1
1.1k
Fashionably flexible responsive web design (full day workshop)
malarkey
408
66k
Self-Hosted WebAssembly Runtime for Runtime-Neutral Checkpoint/Restore in Edge–Cloud Continuum
chikuwait
0
320
AI: The stuff that nobody shows you
jnunemaker
PRO
2
240
The Pragmatic Product Professional
lauravandoore
37
7.1k
Transcript
CSS Best Practices Mahdi Pedramrazi
#1 Don’t repeat yourself.
DO YOU SEE THE PROBLEM
CAN WE DO BETTER ?
CREATING REUSABLE UNITS
USING CSS PREPROCESSOR Even more reusable units Less
File
#2 Don’t Introduce complexity.
Avoid Using !important
Don’t Use Inline CSS ProperQes <div style=“color: red;”></div>
Avoid Doing Styling With JavaScript
Avoid Using CSS classes used for styling in JS
Bad Good
#3 WRITE LESS CODE
CREATE REUSABLE CLASSES AND MARKUP
WRITE LESS MARKUP Faster reflow and rendering
Thank You