Upgrade to Pro — share decks privately, control downloads, hide ads and more …

CSS Wranglin'

Joe Ellis
March 01, 2013
Technology
6
120

CSS Wranglin'

How to wrangle and organize CSS in a sane way for medium to large applications.

Joe Ellis

March 01, 2013
Tweet

More Decks by Joe Ellis

See All by Joe Ellis
Sass vs Less vs Stylus vs Rework
notjoeellis
3
2.1k
Scalable CSS
notjoeellis
5
350
Barcamp 5 - A Website's Tale
notjoeellis
2
180

Other Decks in Technology

See All in Technology
なぜCodeceptJSを選んだか
goataka
0
160
podman_update_2024-12
orimanabu
1
270
Snowflake女子会#3 Snowpipeの良さを5分で語るよ
lana2548
0
230
サイバー攻撃を想定したセキュリティガイドライン 策定とASM及びCNAPPの活用方法
syoshie
3
1.2k
OpenAIの蒸留機能(Model Distillation)を使用して運用中のLLMのコストを削減する取り組み
pharma_x_tech
4
550
PHPからGoへのマイグレーション for DMMアフィリエイト
yabakokobayashi
1
170
Turing × atmaCup #18 - 1st Place Solution
hakubishin3
0
480
Opcodeを読んでいたら何故かphp-srcを読んでいた話
murashotaro
0
170
AWS re:Invent 2024で発表された コードを書く開発者向け機能について
maruto
0
190
KubeCon NA 2024 Recap / Running WebAssembly (Wasm) Workloads Side-by-Side with Container Workloads
z63d
1
240
How to be an AWS Community Builder | 君もAWS Community Builderになろう！〜2024 冬 CB募集直前対策編?!〜
coosuke
PRO
2
2.8k
Oracle Cloud Infrastructure：2024年12月度サービス・アップデート
oracle4engineer
PRO
0
170

Featured

See All Featured
Reflections from 52 weeks, 52 projects
jeffersonlam
347
20k
How to train your dragon (web standard)
notwaldorf
88
5.7k
Dealing with People You Can't Stand - Big Design 2015
cassininazir
365
25k
Java REST API Framework Comparison - PWX 2021
mraible
PRO
28
8.3k
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
38
1.9k
The Art of Delivering Value - GDevCon NA Keynote
reverentgeek
8
1.2k
Site-Speed That Sticks
csswizardry
2
190
How GitHub (no longer) Works
holman
311
140k
BBQ
matthewcrist
85
9.4k
The Success of Rails: Ensuring Growth for the Next 100 Years
eileencodes
44
6.9k
The World Runs on Bad Software
bkeepers
PRO
65
11k
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
marktimemedia
28
2.1k

Transcript

  1. CSS Wranglin’ Friday, March 1, 13

  2. by Joe Ellis @notjoeellis [email protected] Developer at Audiosocket Friday, March

    1, 13

  3. Disclaimer Friday, March 1, 13

  4. This is for medium to large applications Rules may not

    make sense for small sites. Friday, March 1, 13

  5. YMMV Friday, March 1, 13

  6. Use a CSS precompiler Friday, March 1, 13

  7. File Structure Friday, March 1, 13

  8. Friday, March 1, 13

  9. General Goals Friday, March 1, 13

  10. • Predictable • Reusable • Maintainable • Scalable Good CSS

    is: How to do this? Friday, March 1, 13

  11. Avoid overly specific selectors and parent selectors Friday, March 1,

    13

  12. BAD Friday, March 1, 13

  13. GOOD Friday, March 1, 13

  14. Avoid #IDS Friday, March 1, 13

  15. Avoid overly generic class names Friday, March 1, 13

  16. BAD Friday, March 1, 13

  17. GOOD Friday, March 1, 13

  18. Avoid having classes do too much. Abstract where possible. Friday,

    March 1, 13

  19. BAD Friday, March 1, 13

  20. NOT BAD Friday, March 1, 13

  21. BEST Friday, March 1, 13

  22. Separate CSS styles from JS hooks Friday, March 1, 13

  23. BAD Friday, March 1, 13

  24. GOOD Friday, March 1, 13

  25. Got questions /tips? Friday, March 1, 13

  26. FIN Friday, March 1, 13