Upgrade to Pro — share decks privately, control downloads, hide ads and more …
Sign up for free

Variable Units

Sponsored · SiteGround - Reliable hosting with speed, security, and support you can count on. →
Avatar for Nils Nils
November 28, 2019
Technology
80
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
120
History of Art vs. Web Design vs CSS Development
Avatar for Nils enbee81
1
140
How Studying History Of Arts Helped Me Become A Better Frontend Designer
Avatar for Nils enbee81
0
87
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
77

Other Decks in Technology

See All in Technology
"優秀な誰か"の下位互換にならないために
Avatar for Yuto Nagai(Future) yut0naga1_fa
0
140
Deep Data Security 機能解説
Avatar for oracle4engineer oracle4engineer
PRO
2
720
Datadog の学び方 - あるいは、オブザーバビリティを学ぶとは何か
Avatar for iwa mananyuki
1
500
カンファレンスに参加した後の浮遊感とセルフケア
Avatar for Pauli pauli
0
310
AI時代だからこそ推したい！Gitコマンド再入門
Avatar for ムナカタ munakata
0
160
OpenSharing について熱く語る 〜AI アセットの共有について〜
Avatar for camay kameitomohiro
0
240
生成AIを使って「人が」考える技術 ― AI時代の人機共想と実践ノウハウ｜UNITT AC2026
Avatar for 石井力重 ishiirikie
0
560
OSC2026on_the-world-is-waiting-for-your-voice.pdf
Avatar for Naruhiko Ogasawara naruoga
0
360
[2026-09-30]ロックンロールは鳴り止まないっ - 信頼性かまってちゃん - 「データ駆動を投げ捨ててまで。」追いかける信頼性改善に向けた取り組みの話
Avatar for tosite tosite
0
210
DWH の限界突破！ AI エージェント向け爆速リアルタイムデータ基盤 ClickHouse
Avatar for jozono jozono
1
290
購入ドメインでの課題と取り組み
Avatar for ykagano ykagano
0
150
ファミコンでPHPを動かす / PHP on the Famicom side b
Avatar for HASEGAWA Tomoki tomzoh
0
140

Featured

See All Featured
Scaling GitHub
Avatar for Zach Holman holman
464
140k
JAMstack: Web Apps at Ludicrous Speed - All Things Open 2022
Avatar for David Neal reverentgeek
1
620
Exploring anti-patterns in Rails
Avatar for Elle Meredith aemeredith
4
520
Documentation Writing (for coders)
Avatar for Carmen Chung carmenintech
77
5.6k
Code Review Best Practice
Avatar for Trisha Gee trishagee
74
20k
The SEO identity crisis: Don't let AI make you average
Avatar for Varn varn
0
580
SERP Conf. Vienna - Web Accessibility: Optimizing for Inclusivity and SEO
Avatar for Sara Fernández Carmona sarafernandez
2
1.6k
Pawsitive SEO: Lessons from My Dog (and Many Mistakes) on Thriving as a Consultant in the Age of AI
Avatar for David Carrasco davidcarrasco
0
260
HU Berlin: Industrial-Strength Natural Language Processing with spaCy and Prodigy
Avatar for Ines Montani inesmontani
PRO
0
740
Distributed Sagas: A Protocol for Coordinating Microservices
Avatar for Caitie McCaffrey caitiem20
333
23k
Let's Do A Bunch of Simple Stuff to Make Websites Faster
Avatar for Chris Coyier chriscoyier
508
140k
Improving Core Web Vitals using Speculation Rules API
Avatar for Sergey Chernyshev sergeychernyshev
21
1.7k

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