web gallery

[Ulli Horlacher]

Ich hatte diverse Fragen zu denen ich hier prima Antworten bekam, vor
allem von Arno Welzel.

Damit konnte ich mein web gallery Projekt umsetzen.

Der Anwender muss nur ein zip Archiv mit seinen Bildern hochladen und es
wird automatisch eine web gallery erstellt. Beispiel:

https://fex.rus.uni-stuttgart.de/dox/fram...@rus.uni-stuttgart.de/public/gallery/Herbsttour-2020/

Getestet habe ich es selber nur mit Linux. Feedback ist erwuenscht :-)


--
Ullrich Horlacher Server und Virtualisierung
Rechenzentrum TIK
Universitaet Stuttgart E-Mail: horl...@tik.uni-stuttgart.de
Allmandring 30a Tel: ++49-711-68565868
70569 Stuttgart (Germany) WWW: http://www.tik.uni-stuttgart.de/

[Arno Welzel]

Ulli Horlacher:

> Ich hatte diverse Fragen zu denen ich hier prima Antworten bekam, vor
> allem von Arno Welzel.
>
> Damit konnte ich mein web gallery Projekt umsetzen.
>
> Der Anwender muss nur ein zip Archiv mit seinen Bildern hochladen und es
> wird automatisch eine web gallery erstellt. Beispiel:
>
> https://fex.rus.uni-stuttgart.de/dox/fram...@rus.uni-stuttgart.de/public/gallery/Herbsttour-2020/
>
> Getestet habe ich es selber nur mit Linux. Feedback ist erwuenscht :-)

Das ist allerdings sehr einfach in der Handhabung.

Aber ganz ketzerisch gefragt: wäre die Integration einer "Lightbox" auf
Basis von PhotoSwipe mit JavaScript etwas, was Du komplett ablehnen würdest?

Also konkret wie z.B. hier:

<https://fahrradzukunft.de/34/steckdose-unterwegs-9#bild-1>

In der "Lightbox", in der man dann auch per Tastatur blättern (Cursor
links/rechts), reinzommen oder auf Vollbildansicht umschalten (geht auch
mit Tastenkürzel "f").

Bildunterschriften muss man nicht haben - es geht auch ohne.

Wer kein JavaScript mag, der kann weiterhin die aktuelle Lösung nutzen.
Aber für Leute mit JavaScript mag das vielleicht eine interessante
Alternative sein.


--
Arno Welzel
https://arnowelzel.de

[Ulli Horlacher]

Arno Welzel <use...@arnowelzel.de> wrote:

> > Der Anwender muss nur ein zip Archiv mit seinen Bildern hochladen und es
> > wird automatisch eine web gallery erstellt. Beispiel:
> >
> > https://fex.rus.uni-stuttgart.de/dox/fram...@rus.uni-stuttgart.de/public/gallery/Herbsttour-2020/
>

> Das ist allerdings sehr einfach in der Handhabung.

Das war ein wichtiges Design-Ziel :-)

> Aber ganz ketzerisch gefragt: wäre die Integration einer "Lightbox" auf
> Basis von PhotoSwipe mit JavaScript etwas, was Du komplett ablehnen würdest?

Sagt mir nichts.

> Also konkret wie z.B. hier:
>
> <https://fahrradzukunft.de/34/steckdose-unterwegs-9#bild-1>
>
> In der "Lightbox", in der man dann auch per Tastatur blättern (Cursor
> links/rechts), reinzommen oder auf Vollbildansicht umschalten (geht auch
> mit Tastenkürzel "f").

Das geht mit meiner web gallery auch.
Welchen sonstigen Vorteil hat das?

[Arno Welzel]

Ulli Horlacher:

> Arno Welzel <use...@arnowelzel.de> wrote:
[...]

>> Also konkret wie z.B. hier:
>>
>> <https://fahrradzukunft.de/34/steckdose-unterwegs-9#bild-1>
>>
>> In der "Lightbox", in der man dann auch per Tastatur blättern (Cursor
>> links/rechts), reinzommen oder auf Vollbildansicht umschalten (geht auch
>> mit Tastenkürzel "f").
>
> Das geht mit meiner web gallery auch.

Wo kann man bei deiner web gallery in ein Bild reinzommen, ohne es
separat im Browser zu laden und *dann* im *Browser* zu hoffen, dass er
zoomen kann?

Und wo genau geht der Vollbildmodus ohne das Bild vorher im Browser zu
laden und dann den *Browser* in den Vollbildmodus zu versetzen?

Der Vorteil bei PhotoSwipe ist, dass der ganze Ablauf viel einfacher ist:

1) Bild anklicken.

2) Mit einem Mausklick direkt rein- und wieder auszoomen, ohne dass das
Bild nochmal geladen werden muss.

3) Per "f" Vollbildmodus aktivieren, wenn gewünscht.

Auch auf mobilen Geräten kann man mit den üblichen Finger-Gesten
reinzommen und zum nächsten Bild "wischen", wenn man das möchte. Das
dürfte bei Dir so direkt auch nicht gehen.

[Ulli Horlacher]

Arno Welzel <use...@arnowelzel.de> wrote:

> >> In der "Lightbox", in der man dann auch per Tastatur blättern (Cursor
> >> links/rechts), reinzommen oder auf Vollbildansicht umschalten (geht auch
> >> mit Tastenkürzel "f").
> >
> > Das geht mit meiner web gallery auch.
>
> Wo kann man bei deiner web gallery in ein Bild reinzommen, ohne es
> separat im Browser zu laden

Achso, ohne nachladen?
Nein, das geht nicht, ist aber fuer den Benutzer egal. Er merkt den
Unterschied nicht.

> und *dann* im *Browser* zu hoffen, dass er zoomen kann?

Gibt es Browser ohne Zoom-Funktion? Ich kenne keinen.

> Auch auf mobilen Geräten kann man mit den üblichen Finger-Gesten
> reinzommen und zum nächsten Bild "wischen", wenn man das möchte. Das
> dürfte bei Dir so direkt auch nicht gehen.

Mobilgeraete unterstuetze ich nicht extra, ich kann das mangels Hardware
eh nicht testen.

[Arno Welzel]

Ulli Horlacher:

> Arno Welzel <use...@arnowelzel.de> wrote:
>
>>>> In der "Lightbox", in der man dann auch per Tastatur blättern (Cursor
>>>> links/rechts), reinzommen oder auf Vollbildansicht umschalten (geht auch
>>>> mit Tastenkürzel "f").
>>>
>>> Das geht mit meiner web gallery auch.
>>
>> Wo kann man bei deiner web gallery in ein Bild reinzommen, ohne es
>> separat im Browser zu laden
>
> Achso, ohne nachladen?
> Nein, das geht nicht, ist aber fuer den Benutzer egal. Er merkt den
> Unterschied nicht.

Also *mir* als Benutzer ist das nicht egal. Ich merke den Unterschied
sehr wohl und ich kann mir auch nicht vorstellen, dass *niemand* einen
Unterschied zwischen deiner aktuellen Lösung und der Verwendung eines
Lightbox-Scripts sieht.

Aber ich entnehme deiner Antwort, dass Du deine Lösung für gut genug
hältst und kein Interesse hast, da noch irgendwas hinzuzufügen.

>> Auch auf mobilen Geräten kann man mit den üblichen Finger-Gesten
>> reinzommen und zum nächsten Bild "wischen", wenn man das möchte. Das
>> dürfte bei Dir so direkt auch nicht gehen.
>
> Mobilgeraete unterstuetze ich nicht extra, ich kann das mangels Hardware
> eh nicht testen.

Zum Testen braucht man keine Hardware. Emulatoren für Android inkl.
Browser existieren. Aber dass Du Dir das nicht zusätzlich anschauen
willst, wenn es dafür keinen Bedarf gibt, ist nachvollziehbar.

Nur der Vollständigkeit haber:

Du musst mobile Geräte auch nicht "extra" unterstützen. Das kann die
Lightbox ganz alleine, ohne das man dafür etwas extra tut. Und um eine
Web-Oberfläche so zu bauen, dass sie auch auf mobilen Geräten halbwegs
brauchbar nutzbar ist, muss man ebenfalls nicht viel tun.

[Ulli Horlacher]

Arno Welzel <use...@arnowelzel.de> wrote:

> >>>> In der "Lightbox", in der man dann auch per Tastatur blättern (Cursor
> >>>> links/rechts), reinzommen oder auf Vollbildansicht umschalten (geht auch
> >>>> mit Tastenkürzel "f").
> >>>
> >>> Das geht mit meiner web gallery auch.
> >>
> >> Wo kann man bei deiner web gallery in ein Bild reinzommen, ohne es
> >> separat im Browser zu laden
> >
> > Achso, ohne nachladen?
> > Nein, das geht nicht, ist aber fuer den Benutzer egal. Er merkt den
> > Unterschied nicht.
>
> Also *mir* als Benutzer ist das nicht egal. Ich merke den Unterschied
> sehr wohl

Weil die URL sich aendert und das Nachladen 1 s dauert?
Das ist meinen Benutzern egal.

> Aber ich entnehme deiner Antwort, dass Du deine Lösung für gut genug
> hältst und kein Interesse hast, da noch irgendwas hinzuzufügen.

Funktionalen Verbesserungen bin ich immer aufgeschlossen, aber ich sehe
hier keinen Mehrwert.
Zudem zieht eine Komplexizitaetsebene mehr ein, die ich nicht verstehe,
wenn es zu einem Problem kommt.
MEINEN Code kann ich debuggen, fremdes Javascript nicht.

[Arno Welzel]

Ulli Horlacher:

> Arno Welzel <use...@arnowelzel.de> wrote:
>
>>>>>> In der "Lightbox", in der man dann auch per Tastatur blättern (Cursor
>>>>>> links/rechts), reinzommen oder auf Vollbildansicht umschalten (geht auch
>>>>>> mit Tastenkürzel "f").
>>>>>
>>>>> Das geht mit meiner web gallery auch.
>>>>
>>>> Wo kann man bei deiner web gallery in ein Bild reinzommen, ohne es
>>>> separat im Browser zu laden
>>>
>>> Achso, ohne nachladen?
>>> Nein, das geht nicht, ist aber fuer den Benutzer egal. Er merkt den
>>> Unterschied nicht.
>>
>> Also *mir* als Benutzer ist das nicht egal. Ich merke den Unterschied
>> sehr wohl
>
> Weil die URL sich aendert und das Nachladen 1 s dauert?

Nein, weil dann zusätzliche Arbeitsschritte nötig sind:

1. Bild aus der Galerie anklicken, wird mit Steuerelementen etc. geladen.

Zum Vergrößern:

2. Bild anklicken, wird neu geladen.
3. In Bild reinzoomen.
4. Im Browser wieder zurückgehen zur alten URL.
5. Jetzt kann man auch zum nächsten Bild wechseln.

Bei der Lightbox dagegen:

1. Bild aus der Galerie anklicken, wird in der Lightbox geladen

Zum Vergrößeren:

2. Bild anklicken, wird direkt vergrößert, ohne neuladen.
3. Bild wechseln geht direkt mit Cursortasten oder den Pfeil-Buttons in
der Lightbox, ohne dass man wieder zurückgehen muss.

> Das ist meinen Benutzern egal.

D.h. Du hast sie dazu schon gefragt?

>> Aber ich entnehme deiner Antwort, dass Du deine Lösung für gut genug
>> hältst und kein Interesse hast, da noch irgendwas hinzuzufügen.
>
> Funktionalen Verbesserungen bin ich immer aufgeschlossen, aber ich sehe
> hier keinen Mehrwert.

Ich schon.

> Zudem zieht eine Komplexizitaetsebene mehr ein, die ich nicht verstehe,
> wenn es zu einem Problem kommt.
> MEINEN Code kann ich debuggen, fremdes Javascript nicht.

Das würde auch dann gelten, wenn es eine auch in deinen Augen funkionale
Verbesserung wäre - auch dann könntest Du es nicht debuggen, wenn dazu
fremdes JavaScript verwendet wird.

Man kann es daher verkürzen zu:

"MEINEN Code kann ich debuggen, fremdes Javascript nicht. Daher baue ich
das nicht ein, egal was es bringt."

[Arno Welzel]

Arno Welzel:

Ergänzend:

Man könnte auch in deiner bestehenden Lösung das Bild vergrößert
anzeigen lassen, ohne es neu zu laden. Das ginge auch ohne "fremdes
JavaScript".

[Ulli Horlacher]

Arno Welzel <use...@arnowelzel.de> wrote:

> > Weil die URL sich aendert und das Nachladen 1 s dauert?
>
> Nein, weil dann zusätzliche Arbeitsschritte nötig sind:
>
> 1. Bild aus der Galerie anklicken, wird mit Steuerelementen etc. geladen.
>
> Zum Vergrößern:
>
> 2. Bild anklicken, wird neu geladen.
> 3. In Bild reinzoomen.
> 4. Im Browser wieder zurückgehen zur alten URL.
> 5. Jetzt kann man auch zum nächsten Bild wechseln.
>
> Bei der Lightbox dagegen:
>
> 1. Bild aus der Galerie anklicken, wird in der Lightbox geladen
>
> Zum Vergrößeren:
>
> 2. Bild anklicken, wird direkt vergrößert, ohne neuladen.
> 3. Bild wechseln geht direkt mit Cursortasten oder den Pfeil-Buttons in
> der Lightbox, ohne dass man wieder zurückgehen muss.

Der einzige Unterschied zu meiner Loesung ist das Nachladen von dem der
nornale Benutzer nichts mitbekommt.
Also funktional fuer den Benutzer kein Unterschied.

> > Das ist meinen Benutzern egal.
>
> D.h. Du hast sie dazu schon gefragt?

Ja.

[Ulli Horlacher]

Arno Welzel <use...@arnowelzel.de> wrote:

> Man könnte auch in deiner bestehenden Lösung das Bild vergrößert
> anzeigen lassen, ohne es neu zu laden. Das ginge auch ohne "fremdes
> JavaScript".

Interessant! Wie?

[Arno Welzel]

Ulli Horlacher:

> Arno Welzel <use...@arnowelzel.de> wrote:
>
>> Man könnte auch in deiner bestehenden Lösung das Bild vergrößert
>> anzeigen lassen, ohne es neu zu laden. Das ginge auch ohne "fremdes
>> JavaScript".
>
> Interessant! Wie?

Eine gebrauchsfertige Lösung habe ich jetzt nicht sofort parat, aber
wenn Du möchtest, können wir uns gerne genauer dazu austauschen.

Generell kann man mit JavaScript ja das DOM des geladenen HTML ändern
und z.B. auch das Bild neu positionieren, mit anderen Styles versehen
oder zusätzliche Elemente einblenden - z.B. eine Knopf zur Rückkehr von
der "Zoom"-Ansicht zur Normaldarstellung.

Letztlich macht das "PhotoSwipe"-Script ja auch nicht viel anderes, nur
dass es noch ein paar Dinge mehr berücksichtigt wie Fingergesten auf
mobilen Geräten etc..

Es sind sicher ein paar Zeilen Code, die man einbauen muss, aber wenn
wir uns etwas ausführlicher damit befassen, auf jeden Fall machbar und
auch ohne externe Frameworks o.Ä..

[Arno Welzel]

Ulli Horlacher:

> Arno Welzel <use...@arnowelzel.de> wrote:
>
>>> Weil die URL sich aendert und das Nachladen 1 s dauert?
>>
>> Nein, weil dann zusätzliche Arbeitsschritte nötig sind:
>>
>> 1. Bild aus der Galerie anklicken, wird mit Steuerelementen etc. geladen.
>>
>> Zum Vergrößern:
>>
>> 2. Bild anklicken, wird neu geladen.
>> 3. In Bild reinzoomen.
>> 4. Im Browser wieder zurückgehen zur alten URL.
>> 5. Jetzt kann man auch zum nächsten Bild wechseln.
>>
>> Bei der Lightbox dagegen:
>>
>> 1. Bild aus der Galerie anklicken, wird in der Lightbox geladen
>>
>> Zum Vergrößeren:
>>
>> 2. Bild anklicken, wird direkt vergrößert, ohne neuladen.
>> 3. Bild wechseln geht direkt mit Cursortasten oder den Pfeil-Buttons in
>> der Lightbox, ohne dass man wieder zurückgehen muss.
>
> Der einzige Unterschied zu meiner Loesung ist das Nachladen von dem der
> nornale Benutzer nichts mitbekommt.

Seufz... es sind zwei zusätzliche Schritt nötig, wenn man aus dem
"gezoomten" Bild zum nächsten Bild wechseln will - eben erst einmal
zurück zur Normalansicht und dann zum nächsten Bild wechseln.

> Also funktional fuer den Benutzer kein Unterschied.

Ja, so wie zwischen Naben- und Kettenschaltung funktional kein
Unterschied besteht: beides wechselt die Übersetzung und man hat einen
oder mehrere Hebel für die Gangwechsel.

Oder so wie zwischen Linux und Windows funktional kein Unterschied
besteht: beides Betriebssysteme, die auf x86-Hardware laufen.

>>> Das ist meinen Benutzern egal.
>>
>> D.h. Du hast sie dazu schon gefragt?
>
> Ja.

Wirklich explizit danach, ob es ihnen lieber wäre, wenn man das Bild
ohne neuladen und dem damit verbundenen zusätzlichen zusätzlichen
Bedienschritt beim Bildwechsel vergrößern könnte?

Ok, dann hast Du andere Benutzer. Ich habe "PhotoSwipe" auf Websites
extra eingeführt, weil die Benutzer das so haben wollten und explizit
gefragt haben, ob man die Bilder nicht eleganter vergrößeren könnte, als
einfach nur die Bilddatei im Browser direkt zu laden.

Auch bei der Fahrradzukunft wurde das als positive Verbesserung
angesehen, die Bilder in Artikeln so darzustellen beim Anklicken und
nicht einfach nur direkt auf die Bilder zu verlinken.

[Ulli Horlacher]

Arno Welzel <use...@arnowelzel.de> wrote:

> Seufz... es sind zwei zusätzliche Schritt nötig, wenn man aus dem
> "gezoomten" Bild zum nächsten Bild wechseln will - eben erst einmal
> zurück zur Normalansicht und dann zum nächsten Bild wechseln.

Aehh.. ja, du hast recht. Hatte ich uebersehen.