Rolf Rost: Navigation durch Fotos

Hallo Forumsgemeinde,

kurzum, ich bitte um Kritik!

Alt ist http://rolfrost.de/cgi-bin/spring.cgi
Mit _Klick-here_ Syndrom, hier ist die Navigation verbesserungswürdig, danke an Andreas für seine Hinweise.

Verbessert ist http://rolfrost.de/cgi-bin/show.cgi
Thumbs_vor | Thumbs_nach stehen nun, soweit vorhanden, links | rechts neben dem gezeigten Foto, hier sollte also die Nav. selbsterklärend sein - Frage ist das so?

Oder: was gibts noch so zu verbessern?
Wer Lust und Laune hat, klicke sich mal durch...

Danke und Gruss, Rolf

  1. Hallo,

    ich würde zumindest "überlegen", ob die Bildunterschriften nicht auch dann da stehen sollten wo sie dem Namen nach hingehören. Nämlich (bündig) *unter* dem Bild. Das könnte man ja über einen margin von 100+x px leicht erreichen.

    Da dann das "Zurück-zum-Bildindex" "flattersatzartig" daher kommen würde, würde ich dieses "Element" (sowieso) unter der grauen Linie setzen. Denn sonst verstehe ich eh den Sinn dieser Linie nicht. Als Seiten-beender-Linie ist sie ja nicht wirklich nötig. Aber zusammen mit der oberen Linie als Trennung vom "Inhalt" und "Navigationselementenbereich" ergibt sie ja dann einen zusammenhängenden Sinn.

    Chräcker

    1. Hallo Chräcker,

      ich würde zumindest "überlegen", ob die Bildunterschriften nicht auch dann da stehen sollten wo sie dem Namen nach hingehören. Nämlich (bündig) *unter* dem Bild. Das könnte man ja über einen margin von 100+x px leicht erreichen.

      Guter Hinweis, das kann ich sogar variabel einbauen, weil ich die Thumbnail_width ebenfalls variabel habe...

      Da dann das "Zurück-zum-Bildindex" "flattersatzartig" daher kommen würde, würde ich dieses "Element" (sowieso) unter der grauen Linie setzen. Denn sonst verstehe ich eh den Sinn dieser Linie nicht. Als Seiten-beender-Linie ist sie ja nicht wirklich nötig. Aber zusammen mit der oberen Linie als Trennung vom "Inhalt" und "Navigationselementenbereich" ergibt sie ja dann einen zusammenhängenden Sinn.

      Hmm, unter den 'Schlusstrich' kommt nocheimal das Hauptmenu mit den Links über die Hauptordner - wie auf die anderen Seiten auch...

      Danke und Gruss, Rolf

  2. habe d'ehre

    kurzum, ich bitte um Kritik!

    Alt ist http://rolfrost.de/cgi-bin/spring.cgi
    Mit _Klick-here_ Syndrom, hier ist die Navigation verbesserungswürdig, danke an Andreas für seine Hinweise.

    Ich habe mal just for fun mein Browserfenster auf 800x600 eingestellt.
    Bei dieser Aufloesung ist die Bildschirmaufteilung suboptimal, da ich relativ viele Navigationspunkte aber nur einen minimalen Bildauschnitt sehe.

    Ich wuerde die obere Navigation rausschmeissen und nur einen Link zur Startseite anbieten. Ueberlegenswert waere auch die Positionierung der Blaetter-Thumbails neben dem Grossformat.

    man liest sich
    Wilhelm

  3. Holladiewaldfee,

    Oder: was gibts noch so zu verbessern?

    Solche Bildergalerien schreien geradezu nach einer Verwendung von <link rel="next" .../> und <link rel="previous" .../> ;-)

    Ciao,

    Harry

    --
      Bald kommt die Waldfee ... (Projektphase: Planung)
      Bis dahin:
      http://harry.ilo.de/projekte/berge/
    1. Holladiewaldfee,

      Hola ;-)

      Oder: was gibts noch so zu verbessern?

      Solche Bildergalerien schreien geradezu nach einer Verwendung von <link rel="next" .../> und <link rel="previous" .../> ;-)

      Ouh, so einfach ist das nicht. Weil: last und next könnten ja auch ins Leere greifen.

      Ich hab das so: Alles was die Navigation braucht, steht in einem hash:

      hash mit beschreibungen schreiben

      im anonymen array stehen:

      ['bildbeschreibung', thumbnailwidth, thumbnailheight, bildwidth, bildheight]

      my %desc = (
       1, ['Bl&uuml;tenzauber',100,75,400,300],
       2, ['Bl&uuml;tenzauber',75,100,300,400],
      usw.

      Und das Script prüft ob es einen last oder next auch gibt...

      Gruss, Rolf

      1. Holladiewaldfee,

        Sorry Harry,

        Solche Bildergalerien schreien geradezu nach einer Verwendung von <link rel="next" .../> und <link rel="previous" .../> ;-)

        hab das vorhin falsch verstanden, jetzt hab ichs
        http://de.selfhtml.org/html/kopfdaten/beziehungen.htm

        Interessante Sache!

        coming soon... ;-)

        Gruss, Rolf

        1. Holladiewaldfee,

          Interessante Sache!

          Jep, ich verwende das bei den Galerien auf meiner Berg-Seite auch. Ist irre praktisch, vor allem, weil die Navigation immer da ist, wenn ich sie haben will und gar nicht wegscrollen kann, außerdem ist sie immer an der selben Stelle usw.

          Schade nur daß das
          a) fast keiner verwendet und
          b) die Navigationsleiste per Voreinstellung ausgeblendet ist (?!!)
          (zumindest im Mozilla)

          Ciao,

          Harry

          --
            Bald kommt die Waldfee ... (Projektphase: Planung)
            Bis dahin:
            http://harry.ilo.de/projekte/berge/
          1. Hi Harry,

            [<link rel>]
            Schade nur daß das
            a) fast keiner verwendet und
            b) die Navigationsleiste per Voreinstellung ausgeblendet ist (?!!)
            (zumindest im Mozilla)

            tja, falscher Browser würde ich meinen (</archiv/2004/1/t70182/#m403955>) ;-) Diese Navigationsmöglichkeit sollte auf keiner Site fehlen. Immerhin sind diese Verweise sogar in Lynx sichtbar ...

            Grüße,
             Roland

  4. Hi,

    hier sollte also die Nav. selbsterklärend sein - Frage ist das so?

    nicht ganz. Ich würde zumindest noch Pfeile drüber oder druntersetzen. Rein optisch gefallen mir die Thumbs so dicht an das Bild geklatcht auch überhaupt nicht und der Textlink zur Übersicht paßt nun erst recht nicht dazu. Vielleicht setzt Du die Thumbs besser unter das Bild und dazwischen dann den Link zur Übersicht - wobei dieser sich dann konsequenter Weise als Thumb auch besser machen würde.

    freundliche Grüße
    Ingo

    1. Hi Ingo,

      hier sollte also die Nav. selbsterklärend sein - Frage ist das so?
      nicht ganz. Ich würde zumindest noch Pfeile drüber oder druntersetzen. Rein optisch gefallen mir die Thumbs so dicht an das Bild geklatcht auch überhaupt nicht und der Textlink zur Übersicht paßt nun erst recht nicht dazu. Vielleicht setzt Du die Thumbs besser unter das Bild und dazwischen dann den Link zur Übersicht - wobei dieser sich dann konsequenter Weise als Thumb auch besser machen würde.

      Also so richtig gefällts mir auch nicht. Deswegen danke für Deinen Hinweis. Ich hab den Textlink zum Index mal in Klammern hinter die Beschreibung gesetzt, da ist sozusagen text am text und nicht im Abseits...

      Die Pfeile baue ich noch ein, Farbe blau und genauso hoch wie die Thumbs (Links sind ja auch blau *g).

      Gruss, Rolf

      1. Hi,

        Die Pfeile baue ich noch ein, Farbe blau und genauso hoch wie die Thumbs (Links sind ja auch blau *g).

        vielleicht auch _über_ die Thumbs positionieren?
        Und den Link zur Übersicht spare ich mir meist, indem ich einfach das Bild verlinke wie z.B. auf http://www.1ngo.de/foto/dionysos.html.

        freundliche Grüße
        Ingo

  5. Hi,

    Verbessert ist http://rolfrost.de/cgi-bin/show.cgi
    Oder: was gibts noch so zu verbessern?

    Ich hab sowas auch mal gemacht. Dabei habe ich:

    • über das Weiter- und Zurückbild "Weiter" und "Zurück" geschriegen
    • die Bildchen mit Text so eingerahmt, dass sie wie Buttons wirken
    • am Ende der Reihe das erste Bild als unter "weiter" verlinkt und anders herum
    • als Thumbnails für das Weiter- und Zurückbild das herunterskalierte Originalbild verwendet - funktioniert dann wie ein Preloader und das Bild erscheint sofort, wenn man auf "weiter"/ "zurück" klickt.

    Grüße,

    Ronny

  6. hi,

    danke an Alle hier im Thread Beteiligte für die Kritik!

    Da lad ich euch doch gleich mal ins schöne Schwabenland ein:
    http://rolfrost.de/cgi-bin/lienz.cgi

    Gruss, Rolf

    1. Hi,

      danke an Alle hier im Thread Beteiligte für die Kritik!
      Da lad ich euch doch gleich mal ins schöne Schwabenland ein:
      http://rolfrost.de/cgi-bin/lienz.cgi

      Mich stört, daß das Bildindex so am Beschreibungstext klebt.
      Beispiel:
      Wilder Garten in der Rheinebene (Bildindex)

      Da würde ich in Klammern eher den Ortsnamen, bei dem das Bild entstanden ist, erwarten.
      Ich würd den Link eher unter dem rechten Thumb (rechtsbündig) platzieren.

      cu,
      Andreas

      --
      MudGuard? Siehe http://www.Mud-Guard.de/
      Fachfragen per E-Mail halte ich für unverschämt und werde entsprechende E-Mails nicht beantworten. Für Fachfragen ist das Forum da.
      1. Hi Andreas,

        danke an Alle hier im Thread Beteiligte für die Kritik!
        Da lad ich euch doch gleich mal ins schöne Schwabenland ein:
        http://rolfrost.de/cgi-bin/lienz.cgi

        Mich stört, daß das Bildindex so am Beschreibungstext klebt.
        Beispiel:
        Wilder Garten in der Rheinebene (Bildindex)

        Ooops, hast Du das vielleicht noch im Cache?

        Es sieht nun so aus:
        Bildindex :: Wilder Garten in der Rheinebene

        Gruss, Rolf

        Klick ;-)
        http://rolfrost.de/cgi-bin/spring.cgi?dis=12

        1. Hi,

          Ooops, hast Du das vielleicht noch im Cache?

          Jetzt ist es anders.

          Die blauen < > solltest Du nicht durch den Browser von 42 auf 25 Pixel stauchen, das sieht furchtbar pixelig aus.

          Bildindex :: Wilder Garten in der Rheinebene

          Besser - aber ich würd das Bildindex trotzdem unter dem linken Thumb anordnen (und die bereits vorgeschlagene Kreisverlinkung vom ersten zum letzten Bild)

          cu,
          Andreas

          --
          MudGuard? Siehe http://www.Mud-Guard.de/
          Fachfragen per E-Mail halte ich für unverschämt und werde entsprechende E-Mails nicht beantworten. Für Fachfragen ist das Forum da.
          1. Hi Andreas,

            Die blauen < > solltest Du nicht durch den Browser von 42 auf 25 Pixel stauchen, das sieht furchtbar pixelig aus.

            Danke, richtig, arrgh, hatte ich ganz vergessen wie breit ich die Dinger gemalt habe... nunhab ichs gerichtet ;-)

            Bildindex :: Wilder Garten in der Rheinebene

            Hmm, finde ich aber gut, weil es ein bischen Logik ergibt, wegen dem Doppelpunkt, nun einer hättes auch getan, aber 2 sehen besser aus, so wie bei PERL ne Klassenableitung...

            Also letztendlich isses nun einigermaßen das was mir so vorschwebte, und zum Anderen denke ich, dass es beim Besucher auch ankommt.

            Gruss, Rolf - Mit einem Herz für Schwaben.

            --
            Ein Bild ist dabei, das nicht 'Lienzingen' heißt, Geheimtipp ;-)
            http://www.rolfrost.de/cgi-bin/lienz.cgi
  7. Hallo Rolf,

    Oder: was gibts noch so zu verbessern?

    Ich würde den Alt-Text auch noch als title einfügen.

    Auf Wiederlesen
    Detlef

    --
    - Wissen ist gut
    - Können ist besser
    - aber das Beste und Interessanteste ist der Weg dahin!
    1. Hi Detlef,

      Oder: was gibts noch so zu verbessern?

      Ich würde den Alt-Text auch noch als title einfügen.

      Hmm, ich dachte immer das alt Attribut reicht bei images, warum dann noch einen title? Wer könnte das gebrauchen?

      Gruss, Rolf

      1. Hallo Rolf,

        ... Wer könnte das gebrauchen?

        Ich als Seitenbesucher zum Beispiel.
        Wenn mein Mauszeiger über "Bildindex" steht, kommt so ein kleines gelbes Feld,
        in dem steht "Thumbnails".
        Nun fände ich es gut und logisch, wenn so ein kleines gelbes Feld "Nächstes
        Bild: Blütenzauber" anzeigen würde, wenn mein Mauszeiger auf das rechte kleine
        Bild auf http://rolfrost.de/cgi-bin/show.cgi?dis=1 zeigt.

        Auf Wiederlesen
        Detlef

        --
        - Wissen ist gut
        - Können ist besser
        - aber das Beste und Interessanteste ist der Weg dahin!
        1. Hallo Detlef,

          Nun fände ich es gut und logisch, wenn so ein kleines gelbes Feld "Nächstes
          Bild: Blütenzauber" anzeigen würde, wenn mein Mauszeiger auf das rechte kleine
          Bild auf http://rolfrost.de/cgi-bin/show.cgi?dis=1 zeigt.

          Na das ist ja'n Ding. Wieder was dazugelernt: Netscape 7.1 zeigt auch bei mir den Wert von alt nicht an, aber den title !!

          Schlussfolgern wir also, dass es durchaus Sinn macht, sowohl ein alt als auch ein title zu notieren.

          Vielen Dank und Gruss, Rolf

          1. Hallo Rolf,

            Na das ist ja'n Ding. Wieder was dazugelernt: Netscape 7.1 zeigt auch bei mir den Wert von alt nicht an, aber den title !!

            Womit sich Metscape 7.1 absolut korrekt verhält. Für den Tooltip ist title bestimmt.
            Alt (Alternativtext) soll den Bildinhalt kurz erklären, wenn das Bild nicht
            angezeigt wird (z.B Textbrowser, Screenreader).
            Der IE übertreibt da etwas.

            Schlussfolgern wir also, dass es durchaus Sinn macht, sowohl ein alt als auch ein title zu notieren.

            Alt muss sein, ist gefordert. Wenn es sich um reine Deko-Grafiken handelt,
            dann alt="", damit nicht unnötigrweise die URL angezeigt oder vorgelesen
            wird.
            Title dagegen ist optional, damit kannst du einen Tooltip anzeigen oder mit
            title="" verhindern, dass der IE den Alttext als Tooltip verwendet.

            Auf Wiederlesen
            Detlef

            --
            - Wissen ist gut
            - Können ist besser
            - aber das Beste und Interessanteste ist der Weg dahin!
            1. Danke Detlef,

              Na das ist ja'n Ding. Wieder was dazugelernt: Netscape 7.1 zeigt auch bei mir den Wert von alt nicht an, aber den title !!

              Womit sich Metscape 7.1 absolut korrekt verhält. Für den Tooltip ist title bestimmt.

              Genau das ist mir heute, ähhm gestern, erst so richtig klar geworden ;-)

              Viele Grüße, Rolf

              Hier hamer nun alles:
              http://rolfrost.de/cgi-bin/show.cgi

          2. Hi,

            Schlussfolgern wir also, dass es durchaus Sinn macht, sowohl ein alt als auch ein title zu notieren.

            nein. Es ist meist nicht sinnvoll, alt und title zu setzen. In Deinem Fall würde ich

            <img src="/astro/next.gif" width=42 height=75 alt="vor" title=""><img src="/files/lienz/t14.jpg" alt="" title="N&auml;chstes Bild: Lienzingen" width=100 height=75>

            besser finden. Die erste Grafik sagt eindeutig, daß es hier "vorwärts" geht, ein title ist somit überflüssig, wohl aber die Informa<tion im alt-Attribut, wenn das Bild nicht angezeigt wird. Anders bei dem zweiten Bild; "nächstes Bild" ist mMn keine sinnvolle Beschreibung dieses Bildes, sondern eine Funktion, die unabhängig vom Bild angezeigt werden soll.

            Alternativ könnte ich mir auch vorstellen, beide alt-Attribute leer zu lassen und title nur im A-Tag zu setzen. Wäre vielleicht sogar besser, da die Bilder eigentlich keinen Informationsgehalt haben und im selben Link stecken.

            freundliche Grüße
            Ingo

            1. Hi Ingo,

              Schlussfolgern wir also, dass es durchaus Sinn macht, sowohl ein alt als auch ein title zu notieren.
              nein. Es ist meist nicht sinnvoll, alt und title zu setzen. In Deinem Fall würde ich

              <img src="/astro/next.gif" width=42 height=75 alt="vor" title=""><img src="/files/lienz/t14.jpg" alt="" title="N&auml;chstes Bild: Lienzingen" width=100 height=75>

              besser finden. Die erste Grafik sagt eindeutig, daß es

              Nun, wir haben hier 2 Grafiken nebeneinander.

              Wie ich habe:

              <a href="/cgi-bin/mallorca.cgi?dis=25"><img src="/files/mallorca/t25.jpg" alt="Vorheriges Bild: Port de Sóller" title="Vorheriges Bild: Port de Sóller" width=100 height=75><img src="/astro/previous.gif" width=42 height=75 alt="Zur&uuml;ck" title="Zur&uuml;ck"></a>

              finde ich auch nicht so gut.

              Also ich fänds besser, dass so zu machen:

              <a href="/cgi-bin/mallorca.cgi?dis=25"><img src="/files/mallorca/t25.jpg" alt="Port de Sóller" title="Port de Sóller" width=100 height=75><img src="/astro/previous.gif" width=42 height=75 alt="Zur&uuml;ck" title="Zur&uuml;ck"></a>

              Ergibt im Thumbnail alt = title und 'tooltip' nur mit der Bildbeschreibung. Und auf dem Pfeil steht lediglich "Vor" (oder Zurück ...)

              Aber ich denke, dass bewegt mich heute nimmer ;-)

              Vielen Dank und Gruss, Rolf