TIL about text-orientation

A presentation at Tech Talk @ Tagesspiegel in January 2020 in Berlin, Germany by Gunnar Bittersmann

Slide 1

Slide 1

TIL about text disorientation πŸ™‚ πŸ™ƒ

Slide 2

Slide 2

YOURS TRULY

Slide 3

Slide 3

YOURS REALLY TRULY

Slide 4

Slide 4

YOURS REALLY REALLY T

Slide 5

Slide 5

YOURS REALLY REALLY TRULY

Slide 6

Slide 6

ε›½ι™…εŒ–ζ΄»εŠ¨W3CδΈ‡η»΄ β½Ήθ”η›Ÿ writing-mode: horizontal-tb

Slide 7

Slide 7

W3C β½Ήε›½ 联际 η›ŸεŒ– ζ΄» 动 writing-mode: vertical-rl δΈ‡ η»΄

Slide 8

Slide 8

writing-mode: vertical-rl; } YOURS REALLY REALLY TRULY footer {

Slide 9

Slide 9

writing-mode: vertical-rl; transform: rotate(0.5turn); } YOURS REALLY REALLY TRULY footer {

Slide 10

Slide 10

Β© YOURS TRULY

Slide 11

Slide 11

footer { writing-mode: vertical-rl; πŸ€” 🀬 🀒 😰 🧐 Β© } YOURS TRULY transform: rotate(0.5turn);

Slide 12

Slide 12

ε›½ Lo – Letter, other W Lu – Letter, uppercase Β© So – Symbol, other W3C β½Ήε›½ 联际 η›ŸεŒ– ζ΄» 动 writing-mode: vertical-rl δΈ‡ η»΄

Slide 13

Slide 13

footer { writing-mode: vertical-rl; Β© } YOURS TRULY transform: rotate(0.5turn);

Slide 14

Slide 14

footer { writing-mode: vertical-rl; text-orientation: sideways; } Β© YOURS TRULY transform: rotate(0.5turn);

Slide 15

Slide 15

TIL

about text orientation πŸ™‚