Hej einsiedler,
Das mit der Schriftgrösse und der Grösse der Fotos (vorallem das) sehe ich irgendwie nicht ein. Was nutzt ein Foto wenn man scrollen muss wie hier (eine Arbeit von mir!)
max-height: 100vh;
Beziehungsweise 100vh abzüglich gewünschter Ränder, zum Beispiel:
max-height: calc(100vh - 10em - 3px);
Sonst ist es auf Handys einfach zu klein...
Da wird auserdem ersichtlich das die Qualität miserabel ist. Und das scrollen finde ich lästig! Tut mir leid, ich möchte das die Bilder sich mit strg++ nicht vergrössern.
s.o.
Die Schriftgrösse ist nun im rem, wenn man im Opera auf 500% vergössert finde ich es nicht gerade leserlich noch hilfreich in der Art.
Wer eine Vergrößerung auf 500% benötigt, wird Deine Meinung nciht teilen ;-)
Das der Textkladeradatsch seitlich (rechts) nicht herausragt mache ich das gesamte Textfenster auf max 500px, so bleibt er innerhalb vom <body> und <article>
Aber nicht auf einem 320px breiten Smartphone! - Nimm besser max-width: 100% - auch hier ggfs. abzüglich von Rändern.
Auf das <figure> kann man leider nicht verzichten, bei horizontal schmaleren Bildern zieht sich sonst der inhalt von <article> zusammen, kommt das nächste breitere Bild drückt es sich wieder auseinander, so ein "springen" finde ich doof.
Ein figure-Element wird immer einem Text o.ä. beigefügt. Wenn du keinen Text hast, benutze ein anderes Element. Wenn es kein passendes gibt, wäre das ein div!
Marc