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

Variable Units

Sponsored · Ship Features Fearlessly Turn features on and off without deploys. Used by thousands of Ruby developers. →
Avatar for Nils Nils
November 28, 2019
Technology
78
0

Variable Units

Folien zum Vortrag bei Webworker Ruhr am 28.11.2019

Avatar for Nils

Nils

November 28, 2019

More Decks by Nils

See All by Nils
Unwrapping Web Design | WW-Ruhr 2023
Avatar for Nils enbee81
0
110
History of Art vs. Web Design vs CSS Development
Avatar for Nils enbee81
1
130
How Studying History Of Arts Helped Me Become A Better Frontend Designer
Avatar for Nils enbee81
0
80
History of Art and modern CSS
Avatar for Nils enbee81
0
280
Size does matter - Responsive Design in 2019 - V2
Avatar for Nils enbee81
0
180
Size does matter - Responsive Design in 2019
Avatar for Nils enbee81
0
75

Other Decks in Technology

See All in Technology
AI時代に越境し、 組織を変えるQAスキルの正体 / QA Skills for Transforming an Organization
Avatar for miisan mii3king
5
4.2k
サービスの信頼性を高めるため、形骸化した「プロダクションミーティング」を立て直すまでの取り組み
Avatar for すてにゃん stefafafan
1
260
「背中を見て育て」からの卒業 〜専門技術としてのテスト設計を軸に、品質保証のバトンを繋ぐ〜 #genda_tech_talk
Avatar for nihonbuson nihonbuson
PRO
2
1.1k
（きっとたぶん）人材育成や教育のような何かの話
Avatar for Takanori Sejima sejima
0
680
多角的な視点から見たAGI
Avatar for Terisuke terisuke
0
130
AIと乗り切った1,500ページ超のヘルプサイト基盤刷新とさらにその先の話
Avatar for mugi / Hajime Mugishima mugi_uno
2
330
ESP32 IoTを動かしながらメモリ使用量を観測してみた話
Avatar for ZOZO Developers zozotech
PRO
0
100
AIが自律的に働く時代へ Amazon Quick で実現するAIエージェント紹介
Avatar for こーへい koheiyoshikawa
0
200
セキュリティ対策、何からはじめる？ CloudNative環境の脅威モデリングと リスク評価実践入門 #cloudnativekaigi
Avatar for varu3 varu3
3
650
マンション備え付けのネットワークとLTE回線を組み合わせた ネットワークの安定化の考案
Avatar for harutiro harutiro
1
120
AI対話分析の夢と、汚いデータの現実 Looker / Dataplex / Dataform で実現する品質ファーストな基盤設計
Avatar for Yuta Ozaki waiwai2111
0
340
「強制アップデート」か「チームの自律」か？エンタープライズが辿り着いたプラットフォームのハイブリッド運用/cloudnative-kaigi-hybrid-platform-operations
Avatar for みずほリサーチ&テクノロジーズ株式会社 先端技術研究部 mhrtech
0
160

Featured

See All Featured
Product Roadmaps are Hard
Avatar for C. Todd Lombardo iamctodd
PRO
55
12k
Beyond borders and beyond the search box: How to win the global "messy middle" with AI-driven SEO
Avatar for David Carrasco davidcarrasco
3
120
GitHub's CSS Performance
Avatar for Jon Rohan jonrohan
1032
470k
From π to Pie charts
Avatar for Rasagy Sharma rasagy
0
180
Exploring anti-patterns in Rails
Avatar for Elle Meredith aemeredith
3
350
Code Review Best Practice
Avatar for Trisha Gee trishagee
74
20k
HDC tutorial
Avatar for Michiel Stock michielstock
2
650
How to build a perfect <img>
Avatar for Jono Alderson jonoalderson
1
5.5k
Highjacked: Video Game Concept Design
Avatar for Ryan Kendrick rkendrick25
PRO
1
350
Build your cross-platform service in a week with App Engine
Avatar for Jose L jlugia
234
18k
The AI Revolution Will Not Be Monopolized: How open-source beats economies of scale, even for LLMs
Avatar for Ines Montani inesmontani
PRO
3
3.4k
A Guide to Academic Writing Using Generative AI - A Workshop
Avatar for Kenji Saito ks91
PRO
1
290

Transcript

  1. @supremebeing09 VARIABLE UNITS

  2. @supremebeing09 VARIABLE UNITS Kill the Pixel!

  3. @supremebeing09 NILS BINDER @supreme-being @nilsbinder

  4. @supremebeing09 Design Backend Development Frontend Development

  5. @supremebeing09 Backend Development Frontend Development Design

  6. @supremebeing09 UX Engineer Backend Development Frontend Development Design

  7. @supremebeing09 UX Engineer Backend Development Frontend Development Design Frontend Designer

  8. @supremebeing09 UX Engineer Backend Development Frontend Development Design Frontend Designer

    Interface Developer

  9. @supremebeing09 UX Engineer Backend Development Frontend Development Design

  10. @supremebeing09 UX Engineer Backend Development Frontend Development Design Fotografie UX-Design

    CSS Accessibility Speed API Data Storage Illustration UI-Design HTML Presentational JS JS Frameworks Business Logic

  11. @supremebeing09 UX Engineer Backend Development Frontend Development Design Fotografie UX-Design

    CSS Accessibility Speed API Data Storage Illustration UI-Design HTML Presentational JS JS Frameworks Business Logic

  12. @supremebeing09 UX Engineer Backend Development Frontend Development Design Fotografie UX-Design

    CSS Accessibility Speed API Data Storage Illustration UI-Design HTML Presentational JS JS Frameworks Business Logic

  13. @supremebeing09 UX Engineer Backend Development Frontend Development Design Fotografie UX-Design

    CSS Accessibility Speed API Data Storage Illustration UI-Design HTML Presentational JS JS Frameworks Business Logic

  14. @supremebeing09 UX Engineer Backend Development Frontend Development Design Fotografie UX-Design

    CSS Accessibility Speed API Data Storage Illustration UI-Design HTML Presentational JS JS Frameworks Business Logic

  15. @supremebeing09 UX Engineer Backend Development Frontend Development Design Fotografie UX-Design

    CSS Accessibility Speed API Data Storage Illustration UI-Design HTML Presentational JS JS Frameworks Business Logic

  16. @supremebeing09 Backend Development Frontend Development Design Fotografie UX-Design API Data

    Storage Illustration UI-Design Presentational JS JS Frameworks Business Logic

  17. @supremebeing09 Backend Development Frontend Development Design Fotografie UX-Design API Data

    Storage Illustration UI-Design Presentational JS JS Frameworks Business Logic

  18. @supremebeing09

  19. @supremebeing09

  20. @supremebeing09 Die Qual der Wahl…

  21. @supremebeing09 der Wahl… Die Qual

  22. @supremebeing09 px der Wahl… Die Qual

  23. @supremebeing09 px % der Wahl… Die Qual

  24. @supremebeing09 px % em der Wahl… Die Qual

  25. @supremebeing09 px % em rem der Wahl… Die Qual

  26. @supremebeing09 px % em rem vw/vh der Wahl… Die Qual

  27. @supremebeing09 px % em rem vw/vh vmin/vmax der Wahl… Die

    Qual

  28. @supremebeing09 px % em rem vw/vh vmin/vmax ch der Wahl…

    Die Qual

  29. @supremebeing09 px % em rem vw/vh vmin/vmax ch fr der

    Wahl… Die Qual

  30. @supremebeing09 px % em rem vw/vh vmin/vmax ch fr -keine-

    der Wahl… Die Qual

  31. @supremebeing09 px vw/vh vmin/vmax % fr rem em ch -keine-

    der Wahl… Die Qual

  32. @supremebeing09 Wie viel em sind 10px??

  33. @supremebeing09 Wie viel em sind 10px?? 10 / 16 =

    0.625 em

  34. @supremebeing09 Wie viel em sind 10px?? 10 / 16 =

    0.625 em 22 / 16 = 1.375em

  35. @supremebeing09 Wie viel em sind 10px?? 10 / 16 =

    0.625 em 22 / 16 = 1.375em 756 / 1440 * 100 = 52.5vw

  36. @supremebeing09 Meet Alfred www.alfredapp.com

  37. @supremebeing09 Meet Alfred www.alfredapp.com