Matthias Scharwies: flexible Bilderwand

Beitrag lesen

Servus!

ka, nicht 30x20px, aber evtl 6em x 3em?

Hab mal ein wenig hin und her überlegt, mit em wird das doch dann schrecklich klein bei kleinem Browserfenster, oder?

Die Schriftgröße sollte immer gleich bleiben.

1em ≙≈ 16px

Das wären dann ca. 100px x 50px. (Besser wäre ein Verhältnis von 2/3 oder 3/4)

Hierzu im Wiki: Vergessen Sie den Begriff Pixel!

(*1 - Rest) Und an dieser Stelle stelle ich ein Dilemma fest (oder habe ein Verständnissproblem) alle möglichen Elemente kann man mit em beliebig anpassen, aber Bilder haben eine definierte Größe in Pixel (keine css Pixel) das bedeutet am Ende die Bilder werden irgendwann mit den Elementen in denen sie stecken nicht mehr mitwachsen können ohne die sichtbare Qualität zu verschlechtern.

Ja, das stimmt prinzipiell. Es gibt aber keine genau zuordnenbare Pixel (mehr) und deshalb sollten Deine Thumbnails ca. doppelt so groß wie der zugewiesene Platz sein, also bei den oben vorgeschlagenen Maßen ca. 200px Breite.

Hm... geschmackssache, oder? Falls du mal hier schauen möchtest, das stellt die Fotocommunity zur Verfügung. Imho darf ein Thumbnail schon mal was erkennen lassen, damit man eventuell überlegen kann ob man das mal genauer inspizieren will oder nicht, besonders wenn's um das Bild hinter dem Thumbdingens geht. Oder...?

Diese 250px Breite deiner thumbnails sind auch ok, auf Deiner alten Seite waren sie viel kleiner (60x40px). Auf meinem Tablet sind 5 Bilder nebeneinander und drei Reihen sichtbar. Das finde ich übersichtlicher als 1000 Bilder auf einmal.

Ich habe Deine Seite mit Rechtsklick im Seiteninspektor untersucht. Du hast im html-Element eine Schriftgröße von 10px festgelegt - das würde ich weglassen, bzw. alles durch em ersetzen.

Die Bilder sind in einer Liste ul, die li-Elemente werden mit display: inline-block;nebeneinander angezeigt; was nicht mehr reinpasst, kommt eine Zeile nach unten. Gut!

Die thumbnails dort sind passend groß (wsl. durch ein Skript erzeugt) und verlinken dann auf das große Photo, das nur geladen wird, wenn man draufklickt. Das finde ich gut.

Danke schon mal im Voraus & auf Wiederlesen! der torsten

Herzliche Grüße

Matthias Scharwies

--
25 Jahre SELFHTML → SELF-Treffen 05.-07. Juni 2020 in Mannheim