Martin: Webseitebegutachtung

problematische Seite

Hallo, habt Ihr Ideen was man hier besser machen könnte? Irgendwie gefällt mir nicht dass der content zu sehr in header und footer übergeht. Kleiner machen möchte ich ihn aber nicht da sonst die Bilder in der Gallerie zu klein werden...

  1. problematische Seite

    Lieber Namensvetter,

    Hallo, habt Ihr Ideen was man hier besser machen könnte?

    mein erster Eindruck: Autsch!
    Nimm der Galerie doch bitte das überzählige l weg. Das hat nichts mit Galle zu tun.

    Dann, auf den zweiten Blick: Sieht doch gar nicht übel aus.

    Irgendwie gefällt mir nicht dass der content zu sehr in header und footer übergeht.

    Welcher Content? Ist ja noch keiner da. Wobei ... ah, auf aboutme sehe ich, was du meinst.
    Das ist aber auch sehr viel Text! Als erstes würde ich mal die vielen Zeilenumbrüche (<br>) rausmachen. Dann fließt der Text sauberer und wird nicht an den unmöglichsten Stellen zerrissen. Und dann überlege dir mal, ob man die Menge an Text nicht lieber auf mehrere Seiten aufteilen könnte.

    Kleiner machen möchte ich ihn aber nicht

    Vielleicht nicht direkt kleiner, aber etwas mehr Abstand zum oberen bzw. unteren Rand könnte ich mir gut vorstellen.

    Gallerie

    Gute Besserung!

    Schade, dass du im Quellcode hauptsächlich aussagefreie div-Elemente verwendest, anstatt mit header, footer und main etwas mehr Semantik einzubringen. Und die Einbindung des Stylesheets am Ende des body ist zwar meines Wissens inzwischen erlaubt, aber eigentlich gehört das ins head-Element.

    Den Effekt mit dem Herumschwenken des gesamten Seiteninhalts, um weitere Links anzuzeigen, find ich übrigens cool!

    Live long and pros healthy,
     Martin

    --
    Webstuhl (m): Speziell für die Internet-Nutzung entwickeltes Sitzmöbel.
    1. problematische Seite

      Gallerie? Gallery? Galerie! 😆

      Danke für den Hinweis :)

      1. problematische Seite

        Hi,

        Gallerie? Gallery? Galerie! 😆

        Ich find die Galeere (?) sehr unruhig.

        Am Rand das Gewebe vom Hintergrundbild, und die vielen schmalen Gewebe-Streifen neben dem jeweiligen Hauptbild finde ich für's Auge verwirrend.

        Da kommt das jeweilige Bild nicht gut zur Wirkung.

        Besonders stark finde ich die Verwirrung bei den Bildern, die auch noch aus mehreren schmalen Geweben bestehen - die sind kaum von den schmalen Streifen der anderen Bilder zu unterscheiden.

        cu,
        Andreas a/k/a MudGuard

        1. problematische Seite

          Ja das stimmt, jetzt wo du es sagst fällt es mir auch auf :)

          Das werde ich nochmal ändern, ich versuche mal diese hier einzubauen:

          https://www.w3schools.com/howto/howto_js_slideshow.asp

          1. problematische Seite

            @@Martin

            ich versuche mal diese hier einzubauen:

            https://www.w3schools.com/howto/howto_js_slideshow.asp

            Nein, tu’s nicht! Das Ding gehört auf den Müllhaufen! Per Tastatur unbedienbar.

            Bei Inclusive components wird Ihnen geholfen – und vor allem den Nutzern. A Content Slider

            😷 LLAP

            --
            “When I was 5 years old, my mother always told me that happiness was the key to life. When I went to school, they asked me what I wanted to be when I grew up. I wrote down ‘happy.’ They told me I didn’t understand the assignment, and I told them they didn’t understand life.” —John Lennon
    2. problematische Seite

      Hallo Der,

      Den Effekt mit dem Herumschwenken des gesamten Seiteninhalts, um weitere Links anzuzeigen, find ich übrigens cool!

      Ich auch - aber man sollte ihn auf kleinen Bildschirmen nochmal validieren. Die Buttons sind dort nicht mehr lesbar, weil sie nicht ganz freigelegt werden.

      Rolf

      --
      sumpsi - posui - obstruxi
  2. problematische Seite

    Hallo Martin (oder Ingelis?!),

    die Zeilenumbrüche, die Martin bemängelte, entstehen vor allem, wenn man die Seite nicht auf einem FullHD Bildschirm anzeigt. Aber offenbar sind sie beabsichtigt, der Text ist keine reine Prosa, jeder Zeilenumbruch scheint geplant und beabsichtigt.

    Wenn das tatsächlich als künstlerischer Ausdruck beabsichtigt ist, dann müsstest Du mit Ingelis erarbeiten, wie sich dieser Ausdruck auf schmaleren Bildschirmen ergeben soll.

    Ihr braucht dafür ein Markup, das die Zeilen darstellt (weil die each-line Option für text-indent noch kein Browser kennt und weil text-indent zusammen mit white-space:pre-line gar nicht funktioniert), z.B. so:

    <p class="lyrisch">
    <x-l>ICH bin eine Weberin aus Norddeutschland,</x-l>
    <x-l>zuhause zwischen Ost- und Nordsee.</x-l>
    <x-l>Meine innere Heimat ist das Natuschutzgebiet Lauenburg</x-l>
    <x-l>mit seinen Seen, Wäldern und stillen Mooren.</x-l>
    </p>
    

    Das kann man dann so im CSS stylen:

    .lyrisch x-l {
      display: block;
      padding: 0 0 0 2em;
      text-indent: -2em;
    }
    

    <x-l> ist ein Vorschlag, den Gunnar mal gemacht hat. Es ist ein "custom element" im HTML, Elementnamen mit Minus drin werden niemals "offiziell" definiert werden. Du kannst ein x-l Element darum stylen, wie Du es brauchst, und der Browser wird Dir nie reinfunken.

    Mit display:block sorgst Du für den Zeilenumbruch, mit padding:0 0 0 2em sorgst Du für eine Einrückung jeder Zeile um 2em, und mit text-indent: -2em rückst Du die erste Zeile wieder 2em zurück. Es wäre schöner, wenn text-indent:2em hanging schon funktionierte, aber das ist zu neu. Dem Vernehmen nach funktioniert diese Darstellung sogar im Internet Explorer.

    Der nächste Punkt ist die Frage nach der Spaltenzahl. Ihr nutzt column-count:3, um Text und Bild nebeneinander zu setzen. zeigt den About-Text zweispaltig an. Bei schmaleren Bildschirmen führt das zu unleserlichen Textschläuchen. Hier bietet sich der zusätzliche Gebrauch von column-width an, um eine Mindestbreite vorzugeben (bzw. die Kombi-Eigenschaft columns).

    Das Bild als dritte Spalte zu setzen - kann man machen, aber seine Größe hängt dann sehr von der Fenstergröße ab. Wird die Seite am Handy abgerufen, steht es ganz am Ende, unter dem Text. Hier kann man eigentlich kaum einen Rat geben, da müsstet ihr erstmal ein Konzept entwickeln, wie die Seite bei unterschiedlichen Fenster-/Anzeigegrößen (englisch: Viewports) aussehen soll.

    Ich würde das Bild im Markup vermutlich vor den Text stellen und es mit float:right an die rechte Seite schieben - und damit reinfallen. In einem column-Layout landet das Bild dann in der ersten Spalte.

    Also Flexbox: guck mal hier: https://jsfiddle.net/Rolf_b/0cashbm4/

    Die vertikale Trennung kann man verschieben und damit verschiedene Breiten ausprobieren.

    Mit Hilfe einer @media-Abfrage kannst Du für schmale Viewports die Anordnung von Text und Bild ggf. verändern (z.B. die Flexbox in den Modus flex-direction:column schalten).

    Rolf

    --
    sumpsi - posui - obstruxi
    1. problematische Seite

      Hallo Rolf,

      die Zeilenumbrüche, die Martin bemängelte, entstehen vor allem, wenn man die Seite nicht auf einem FullHD Bildschirm anzeigt.

      das kann gut sein - ich habe hier zuhause zwei Monitore à 1600x1200 Pixel. Ungefähr die gleiche Pixelanzahl wie Full HD, aber nicht 16:9, sondern im praktischeren 4:3-Format.

      Aber offenbar sind sie beabsichtigt, der Text ist keine reine Prosa, jeder Zeilenumbruch scheint geplant und beabsichtigt.

      Das hatte ich auch überlegt. Aber da sind etliche Stellen, wo mir der Zeilenumbruch völlig willkürlich erscheint und Sätze, Halbsätze oder Gedanken einfach zerreißt. Für mich sah es eher so aus, als sei der Text mit diesen br-Elementen auf eine bestimmte Breite "formatiert" worden - was natürlich auf vielen anderen Bildschirm- oder Fenstergrößen nicht mehr passt.

      Der nächste Punkt ist die Frage nach der Spaltenzahl. Ihr nutzt column-count:3, um Text und Bild nebeneinander zu setzen. zeigt den About-Text zweispaltig an.

      Ähm, nö. Bei mir läuft der Text in drei Spalten, von denen die dritte nur noch wenige Zeilen enthält, und dann das Bild drunter. Verkleinere ich das Browserfenter, reduzieren sich die insgesamt drei Spalten irgendwann auf zwei. RWD wie es sein soll - außer dass eine weitere Reduktion auf nur noch eine Spalte nicht stattfindet.

      Das Bild als dritte Spalte zu setzen

      Das sieht bei dir nur so aus, weil bei deiner Bildschirmgröße zwei Spalten für den Text reichen.

      Wird die Seite am Handy abgerufen, steht es ganz am Ende, unter dem Text. Hier kann man eigentlich kaum einen Rat geben, da müsstet ihr erstmal ein Konzept entwickeln, wie die Seite bei unterschiedlichen Fenster-/Anzeigegrößen (englisch: Viewports) aussehen soll.

      Ja, und ob man Mehrspaltigkeit bei schmalen Ansichten überhaupt noch haben möchte. Und auch bei großen Darstellungen ist sie nicht immer gut: Das wiederholte Abwärts- und Aufwärtsscrollen am Spaltenumbruch finde ich lästig - auch wenn das hier nur wenige Zeilen sind.

      Live long and pros healthy,
       Martin

      --
      Webstuhl (m): Speziell für die Internet-Nutzung entwickeltes Sitzmöbel.
    2. problematische Seite

      Hey danke für deine Korrektur, das sieht viel besser aus wenn das Bild rechts alleine steht!

      Die Zeilenumbrüche sind etwas komsich teilweise, aber so habe ich das von einem Flyer von Ihr. Soll wohl so sein...

      Ich überlege aber ob ich nicht doch den Text links in einer Spalte stehen lasse, sieht irgendwie sauberer aus. Dann scrollt man einfach runter. Ich denke das ist die beste Lösung.

      1. problematische Seite

        Die Zeilenumbrüche sind etwas komsich teilweise, aber so habe ich das von einem Flyer von Ihr. Soll wohl so sein...

        Wohl? Da solltest du besser nachfragen, statt nur zu vermuten.

        Das "Lyrische", das hier angesprochen wurde, würde ich frotzelig als Kettensägenlyrikmassaker bezeichnen. Ich habe eher den Verdacht, dass das schon bei der Zettelgestaltung verunglückt ist und du jetzt drauf und dran bist, das Unglück zum Regelfall zu machen.

        Davon unabhängig ist eine Webseite keine elektronische Form eines Blatt Papiers; beide Medien haben ihre eigenen Regeln, Grenzen und Nutzungsformen. Zeilenumbrüche nur wegen der Begründung zu übernehmen, dass sie im anderen Medium vorhanden sind, ist der falsche Weg.

        Weiterhin:

        Nur das untere linke Viertel von Bild 1 füllt den Hintergrund. Soll das so sein? Ich finde wahllos abgeschnittene Fotos irritierend. Du kannst Bilder per CSS automatisch formatfüllend anzeigen lassen.

        Die Startseite wirkt leer und verlassen. Außer den drei Menütexten oben und dem rosa Klecks ist da nicht viel.

        Vielleicht solltest du dich generell vom Schema Kopf, Inhalt, Fußzeile lösen und ein wenig mit der Weberei der Hintergrundgrafik spielen. Man könnte Schildchen das Netz stecken. In der Galerie sind auch schmale Schals zu sehen, die als Deko dienen könnten. Grundsätzlich finde ich, dass bei solchen künstlerischen Sachen weniger mehr ist.

        Das Hamburger-Menü ist zwar lustig umgesetzt, aber sein Inhalt ist weitestgehend überflüssig.
        Die Kontaktmöglichkeit (ich glaube nicht, dass man in Lübeck "contact" sagt …) ist im Impressum gut aufgehoben, weil es genau darum bei einem Impressum geht, und auf das Impressum kannst du auf jeder Seite unten hinweisen, da, wo das rechtlich eh wirkungslose "Copyright" und eine sinnleere Information in Form des Seitennamens stehen.
        Die Startseite wird bei den meisten Seiten (auch) über einen Klick auf ein Logo oben links oder rechts erreicht. Eigentlich würde ich das Hamburger-Menü durch im Menü verwendete Häusschen ersetzen, andererseits ist die Startseite eh leer, also braucht sie auch kein Häusschen, dass eh ins Leere führt.

        Den ellenlangen Haftungsausschluss im Impressum: In die Tonne treten. Du kannst dich nicht einfach mit einem reinkopierten 08/15-Wisch von einer Haftung freisprechen. Baust du Mist, bist du grundsätzlich dafür verantwortlich, und du solltest nicht glauben, dass irgendjemand, dem du auf den Schlips getreten bist, sich von so einem Schrieb abschrecken lässt.
        Wenn du genau hinschaust, wird in dem Text denn auch über weite Strecken lediglich das aufgezählt, was eh Recht und Gesetz ist. Oder banale Selbstverständlichkeit, wie die Sorgfalt, die du dir gegeben hast.

        Nicht pauschal verantwortlich bist du für Inhalte fremder Seiten, sofern du sie dir nicht zu eigen machst und allgemein mit gesundem Menschenverstand agierst. Überhaupt, wie sieht das aus, wenn du auf ein fremdes Angebot hinweist, aber gleich hinterherschiebst, dass du nichts damit zu tun haben willst? Dein Hinweis soll doch eine Empfehlung sein und nicht etwas, von dem du dich ausdrücklich distanzieren musst!

        Deine Zusicherung, dass die fremden Seiten zum "Zeitpunkt der Linksetzung frei von rechtswidrigen Inhalten" waren, finde ich dann wieder gewagt. Welche juristische Ausbildung hast du, dass du dir sowas zutraust?

        Den ganzen Text kannst du in zwei, drei Sätzen zusammenfassen; Sorgfalt, Bitte um formlose Nachricht bei Fragen und Problemen, ein kleiner Hinweis auf das Urheberrecht.

        1. problematische Seite

          Ja das Hamburger Menü kommt weg und Impressum wird zusammengestaucht.

    3. problematische Seite

      @@Rolf B

      <x-l> ist ein Vorschlag, den Gunnar mal gemacht hat. […] Mit display:block sorgst Du für den Zeilenumbruch

      Ich nutze das nicht mehr so. Wenn CSS nicht greift, fehlt die Trennung (nicht nur die visuelle als Zeilenumbruch) völlig. @Felix Riesterer hatte das wiederholt angemecket und ich konnte ihn nicht mal unrechtgeben.

      Ich verwende jetzt

      <p>
        <x-l>Freude, schöner Götterfunken,</x-l><br/>
        <x-l>Tochter aus Elysium,</x-l><br/>
        <x-l>Wir betreten feuertrunken,</x-l><br/>
        <x-l>Himmlische, dein Heiligtum</x-l>
      </p>
      

      (Beispiel)

      Zeilenumbrüche mit dem dafür vorgesehenen HTML-Element br; x-l bleibt inline und ist nur noch für die Einzüge zuständig:

      mit padding:0 0 0 2em sorgst Du für eine Einrückung jeder Zeile um 2em, und mit text-indent: -2em rückst Du die erste Zeile wieder 2em zurück.

      Dein Code ist WET (write everything twice), man möchte das Gegenteil: DRY (don’t repeat yourself), also sowas:

      x-l {
        --hanging-indent: 2em;
        padding-left: var(--hanging-indent);
        text-indent: calc(-1 * var(--hanging-indent));
      }
      

      Es wäre schöner, wenn text-indent:2em hanging schon funktionierte

      Und vor allem auch text-indent: 2em hanging each-line. [MDN] Dann bräuchte man die x-l-Elemente gar nicht mehr.

      aber das ist zu neu.

      Wenn ich mir das so ansehe, würde ich eher sagen: die Browserhersteller haben überhaupt keine Lust, das zu implementieren.

      😷 LLAP

      --
      “When I was 5 years old, my mother always told me that happiness was the key to life. When I went to school, they asked me what I wanted to be when I grew up. I wrote down ‘happy.’ They told me I didn’t understand the assignment, and I told them they didn’t understand life.” —John Lennon
      1. problematische Seite

        Hallo Gunnar,

        wenn CSS nicht greift

        Ja, ok. Kann genauso vorkommen wie fehlendes JS. Aber es macht die Seite nicht unlesbar, es wird nur Fließtext. Da Extra-br ist dafür akzeptabler Zusatzaufwand.

        Wenn ich mir dagegen die Trocknung der Styleregel ansehe, ersetzt du den Zaubertropfen "2em" durch einen ziemlichen Sandhaufen.

        Rolf

        --
        sumpsi - posui - obstruxi
  3. problematische Seite

    An sich schon nett. Mal was anderes, nicht so übertrieben und Effekt-gespickt.

    Der Schwenkeffekt ist tatsächlich cool, funktioniert aber nur mit Javascript, das bei mir zunächst nicht aktiviert ist.
    Dass das Impressum nur mit JS zu erreichen ist könnte Grund für ein Problem werden.
    Außerdem der Home Link führt nur zum Einstiegsbild und dein Impressum enthält auch schon einen Abschnitt mit Kontaktdaten. Also könnte das Schwenkmenü durch einen einzigen weiteren Link in der Kopfzeile ersetzt werden. Ich finds immer seltsam wenn Links auf zwei verschiedene Arten aufgeteilt sind. Ein bisschen was hier, ein bisschen was da... macht einen verzettelten Eindruck.

    "Über mich" auf zwei Seiten? Ungewöhnlich. Würd ich auf eine einzige Seite packen.

    "Angebot" enthält nochmal einen Kontakt und ließe sich auch wieder mit dem Kontakt aus dem anderen Menü zusammenführen.

    Die Galerie, also ich finde ja die ganz altmodischen Galerien echt genial. Man sieht lauter kleine Vorschaubilder durch die man scrollen kann, man sieht alle Bilder auf einmal und hat einen Überblick. Wenn man ein Bild größer sehen will, klickt man drauf und hat es in groß.
    Bei Galerien wie du sie hast muss man einzeln durch alle Bilder klicken ohne zu wissen wie viele noch kommen und was man ungefähr zu sehen kriegt. Und man sieht ein Bild immer in Vollansicht, ohne es auf Originalgröße mit mehr Details vergrößern zu können.
    Ja ich weiß sowas hat inzwischen jeder...

    Irgendwie gefällt mir nicht dass der content zu sehr in header und footer übergeht.

    Header ist ja nur ein Menü. Das könntest du je nach Endgerät in ein Menü auslagern, oder an die Seite schieben wo es bei der Ansicht auf einem breiten Bildschirm hinpasst.
    Der Footer enthält nur das Copyright und bringt somit für die einzelnen Seiten überhaupt keinen Nutzen. Den würde ich ersatzlos streichen.

    1. problematische Seite

      Hallo,

      Der Schwenkeffekt ist tatsächlich cool, funktioniert aber nur mit Javascript, das bei mir zunächst nicht aktiviert ist.

      ist das os? Das habe ich gar nicht genauer untersucht, nur ohne Nachdenken eine CSS-Animation oder Transition vermutet.

      Dass das Impressum nur mit JS zu erreichen ist könnte Grund für ein Problem werden.

      Ja, dann schließe ich mich diesen Bedenken an.

      "Über mich" auf zwei Seiten? Ungewöhnlich. Würd ich auf eine einzige Seite packen.

      Zwei? Ich hab nur eine gesehen. Oder hat Martin da schon was verändert? Denn ich hatte ihm angesichts der großen Textmenge auf der aboutme-Seite empfohlen, das aufzuteilen.
      Mal nachsehen ... ja, hat er. Gestern war das noch alles auf einer Seite, und ich fand das einfach zu viel auf einmal.

      Der Footer enthält nur das Copyright und bringt somit für die einzelnen Seiten überhaupt keinen Nutzen. Den würde ich ersatzlos streichen.

      Ja, zumal das Copyright ein Konzept aus dem US-amerikanischen Recht ist und für Deutschland bzw. Europa völlig bedeutungslos ist. Das Urheberrecht gilt, auch ohne dass man es explizit beansprucht.

      Live long and pros healthy,
       Martin

      --
      Webstuhl (m): Speziell für die Internet-Nutzung entwickeltes Sitzmöbel.
      1. problematische Seite

        "Über mich" auf zwei Seiten? Ungewöhnlich. Würd ich auf eine einzige Seite packen.

        ... und ich fand das einfach zu viel auf einmal.

        Im Ernst?
        Seit der Erfindung des Scrollbalkens schiebt man doch lieber Seiteninhalt nach oben, statt innerhalb eines einzigen Artikels klicken zu müssen. Auf meinem Laptop würde das ganze "über mich" wahrscheinlich auf eine Seite passen ohne zu scrollen.

        Gewisse größere Portale teilen Artikel auf mehrere Seiten auf, was mich ungeheuer nervt. Der einzige Grund der mir dafür einfällt ist, mehrere Seiten pro Artikel = mehrere Werbeanzeigen werden geladen = mehr Einnahmen für den Betreiber.

        Edit: Ich lese gerade einen anderen Beitrag von dir, wo du schreibst

        Das wiederholte Abwärts- und Aufwärtsscrollen am Spaltenumbruch finde ich lästig

        Das ist natürlich dringend zu vermeiden.
        Bei mir ist die Ansicht zweispaltig und die Schrift ist grenzwertig klein.
        Wenn ich die vergrößere, springt die Ansicht auf einspaltig und sieht besser aus als bisher.
        Vielleicht wäre das ja eine Option. Schrift etwas größer, keine zwei Spalten, den Text auf der zweiten Seite als Fließtext unterhalb des Bilds, so dass er die gesamte Breite einnimmt.

        1. problematische Seite

          Moin,

          "Über mich" auf zwei Seiten? Ungewöhnlich. Würd ich auf eine einzige Seite packen.

          ... und ich fand das einfach zu viel auf einmal.

          Im Ernst?
          Seit der Erfindung des Scrollbalkens schiebt man doch lieber Seiteninhalt nach oben, statt innerhalb eines einzigen Artikels klicken zu müssen.

          ich sehe das persönlich auch so - aber ich bin deswegen auch schon des öfteren kritisiert worden. "Zu viel Text auf einmal!" Das gilt wohl für Webseiten ähnlich wie für Präsentationen.

          Auf meinem Laptop würde das ganze "über mich" wahrscheinlich auf eine Seite passen ohne zu scrollen.

          Auf meinem Desktop-Bildschirm passte es nicht. Da fehlten etwa 3..4 Zeilen, so dass ich beim Lesen tatsächlich immer ein Stückchen hoch- und runterscrollen musste. Das ist bei einem Mehrspalten-Layout besonders lästig.

          Gewisse größere Portale teilen Artikel auf mehrere Seiten auf, was mich ungeheuer nervt.

          ACK.

          Der einzige Grund der mir dafür einfällt ist, mehrere Seiten pro Artikel = mehrere Werbeanzeigen werden geladen = mehr Einnahmen für den Betreiber.

          Auf die Idee bin ich noch gar nicht gekommen!

          Das wiederholte Abwärts- und Aufwärtsscrollen am Spaltenumbruch finde ich lästig

          Das ist natürlich dringend zu vermeiden.
          Bei mir ist die Ansicht zweispaltig und die Schrift ist grenzwertig klein.

          Sehr klein kann ich bestätigen, und die verwendete Schriftart macht's auch nicht gerade besser lesbar.

          Live long and pros healthy,
           Martin

          --
          Webstuhl (m): Speziell für die Internet-Nutzung entwickeltes Sitzmöbel.
          1. problematische Seite

            Seit der Erfindung des Scrollbalkens schiebt man doch lieber Seiteninhalt nach oben, statt innerhalb eines einzigen Artikels klicken zu müssen.

            ich sehe das persönlich auch so - aber ich bin deswegen auch schon des öfteren kritisiert worden. "Zu viel Text auf einmal!" Das gilt wohl für Webseiten ähnlich wie für Präsentationen.

            Das kommt auf das Thema, dessen Zielpublikum, sowie die Aufmachung an.

            Webseiten sind, davon abgesehen, nicht das Gleiche wie Präsentationen. Webseiten sind eher das Gleiche wie Papier; man kann es vielerlei verwenden, für eine Bild-Zeitung genauso wie für einen 1000-Seiten-Roman.

            Eine Präsentation darf nicht zu viel Text haben, weil das Wichtige an einer Präsentation eigentlich der Vortrag ist, und nicht die Präsentation zum Vortrag.

            Auf meinem Desktop-Bildschirm passte es nicht. Da fehlten etwa 3..4 Zeilen, so dass ich beim Lesen tatsächlich immer ein Stückchen hoch- und runterscrollen musste. Das ist bei einem Mehrspalten-Layout besonders lästig.

            Das dürfte hier genau das Problem gewesen sein. Niemand mag es, den Anfang des nächsten Textabschnittes suchen zu müssen. Dabei ist es egal, ob der Abschnitt auf derselben Seite steht, aber erst ins Blickfeld geschoben, oder auf der nächsten Seite steht und erst ins Blickfeld geklickt werden muss.

            Auch Textspalten existieren nur, weil niemand nach einer 30 Zentimeter langen Zeile "blind" den Anfang der nächsten findet. Nach fünf Zentimetern ist das hingegen noch kein Problem, der Lesefluss wird folglich nicht unterbrochen.

            Gewisse größere Portale teilen Artikel auf mehrere Seiten auf, was mich ungeheuer nervt. Der einzige Grund der mir dafür einfällt ist, mehrere Seiten pro Artikel = mehrere Werbeanzeigen werden geladen = mehr Einnahmen für den Betreiber.

            Dass das ein Grund sein mag, ist sicher nicht abzustreiten, auch wenn Anzeigen nachgeladen und ersetzt werden könnten. Aber es gibt halt auch Publikum, das von langen Texten tatsächlich überfordert oder abgeschreckt wird.

            Man muss sich also schon überlegen, welches Publikum angesprochen wird und wie man es schafft, das Publikum nicht mit einer Textwüste zu erschlagen.

            Eine schmale Spalte, die wortwörtlich fingerleicht zu verschieben ist und mit dem lesenden Auge stufenlos mitläuft (Tablet: Irgendwo auf dem Bildschirm schieben, Maus: am Rad drehen), scheint mir allemal besser als denselben Text auf mehrere Seiten zu verteilen (man muss erstmal zielen, um die klitzekleine Schaltfläche zu treffen) und grundsätzlich auch besser als den Text in mehreren Spalten auf eine Bildschirmfläche zu stopfen (weil er bei der Hälfte der Besucher eh nie passen wird).

            Sehr klein kann ich bestätigen, und die verwendete Schriftart macht's auch nicht gerade besser lesbar.

            Merke: Finger weg von der Grundschriftgröße (das ist die, die für das Gros der Texte verwendet wird) und alle anderen, so denn irgendmöglich, nur relativ dazu skalieren.

            1. problematische Seite

              Hallo Tante,

              und die verwendete Schriftart macht's auch nicht gerade besser lesbar.

              Merke: Finger weg von der Grundschriftgröße

              Das ist tatsächlich auch so passiert. Die font-size ist medium (berechnet zu 16px), und sollte damit eigentlich akzeptabel sein. Die Font-Familie hat auch keine kleinen Glyphen (Akaya Kanadaka) - schaltet man das ab, kommt "serif" und die Buchstaben werden eher schlechter lesbar.

              Ich bin erstaunt, dass 16px zu Leseproblemen führt. Und ich habe nicht mal keinen Bildschirm mit erhöhtem DPI Wert (damit meine ich den 120er Bereich), das habe ich vorsätzlich vermieden).

              Wenn ich mir die Seite auf dem Handy anschaue, ist die Schrift auch recht klein. Hm.

              Und das Bild fehlt.

              Und der Text hängt rechts raus, nicht per Scrolling erreichbar

              Und der Menübutton überdeckt den "Über Mich" Link.

              Da ist noch Arbeit fällig...

              Rolf

              --
              sumpsi - posui - obstruxi
              1. problematische Seite

                und die verwendete Schriftart macht's auch nicht gerade besser lesbar.

                Merke: Finger weg von der Grundschriftgröße

                Das ist tatsächlich auch so passiert. Die font-size ist medium (berechnet zu 16px), und sollte damit eigentlich akzeptabel sein. Die Font-Familie hat auch keine kleinen Glyphen (Akaya Kanadaka)

                Das scheint in den letzten Stunden geändert worden zu sein. Die vorige Version kam mit einer mich an Comic Sans erinnernden Schriftart und deutlich kleineren Buchstaben daher; ich möchte sagen: etwas krickelig (aber das ist Geschmackssache).

                1. problematische Seite

                  Die Schrift ändere ich nochmal, sowie weitere Anpassungen. Das ganze passt sich nicht gut in die Seite ein.

              2. problematische Seite

                Ja definitiv.

            2. problematische Seite

              Eine schmale Spalte, die wortwörtlich fingerleicht zu verschieben ist und mit dem lesenden Auge stufenlos mitläuft (Tablet: Irgendwo auf dem Bildschirm schieben, Maus: am Rad drehen), scheint mir allemal besser als denselben Text auf mehrere Seiten zu verteilen (man muss erstmal zielen, um die klitzekleine Schaltfläche zu treffen) und grundsätzlich auch besser als den Text in mehreren Spalten auf eine Bildschirmfläche zu stopfen (weil er bei der Hälfte der Besucher eh nie passen wird).

              Ja das klingt vernünftig, mache ich in der nächsten Version

          2. problematische Seite

            Hi,

            Der einzige Grund der mir dafür einfällt ist, mehrere Seiten pro Artikel = mehrere Werbeanzeigen werden geladen = mehr Einnahmen für den Betreiber.

            dazu gibt es dann mehrere Buttons, die so tun, als wäre es der "Weiter-im-Text"-Button, die aber tatsächlich "hier geht's zur Werbeseite ABC" sind ...

            cu,
            Andreas a/k/a MudGuard

  4. problematische Seite

    @@Martin

    Ich werfe auch mal meine 2 Cent in die Runde. Oder 4 oder 8 – verteilt auf mehrere Postings. Mag sein, dass ich einiges wiederholen werde, was schon von anderen gesagt wurde.

    Die verwendete Schriftart Akaya Kanadaka ist gut als display font. Sie ist schlecht lesbar – also ungeeignet – bei body text. Oliver Schöndorfer erlärt in Pimp My Type: Different Kinds of Text den Unterschied.

    Regel Nr. 1 (in der Folge Display Text): Don’t use display typefaces for body text!


    Text mehrspaltig zu setzen ist auf Webseiten problematisch. Vom Seitenende zum Seitenanfang zurückscrollen zu müssen, um in der nächsten Spalte weiterlesen zu können, ist nicht nutzerfreundlich. Die Begrenzung der Höhe auf irgendein ausgedachtes Maß macht die Sache nicht besser.

    Wenn, dann müsste man den Text so hoch machen, dass er den Viewport ausfüllt (abzüglich fixer Header und Footer) und, wenn die Spalten mehr als eine Bildschirmbreite beanspruchen, horizontal scrollen lassen – was auch problematisch ist.

    TL;DR: Was in Printmedien gut funktioniert, funktioniert auf Webseiten schlecht bis gar nicht.

    😷 LLAP

    --
    “When I was 5 years old, my mother always told me that happiness was the key to life. When I went to school, they asked me what I wanted to be when I grew up. I wrote down ‘happy.’ They told me I didn’t understand the assignment, and I told them they didn’t understand life.” —John Lennon
  5. problematische Seite

    @@Martin

    Dem Bild auf der Über-mich-Seite fehlt Schärfe und Farbkontrast. Das Anschneiden rechts beim Ellenbogen ist noch verschmerzbar, das Anschneiden des Ärmels links nicht.

    Und was ist das für ein Puschel vor ihrem Auge? Hängt das Ding an ihrem Kopf? Nee, hängt im Hintergrund. Hintergrund darf sich nicht störend bemerkbar machen.

    Dass ein Foto einfach mal da ist, ist kein Grund, es zu publizieren. Wenn kein geeignetes Foto da ist, muss eben eins gemacht werden – am besten von jemandem, der sich mit Fotografieren auskennt.

    😷 LLAP

    --
    “When I was 5 years old, my mother always told me that happiness was the key to life. When I went to school, they asked me what I wanted to be when I grew up. I wrote down ‘happy.’ They told me I didn’t understand the assignment, and I told them they didn’t understand life.” —John Lennon
    1. problematische Seite

      Hallo,

      Dem Bild auf der Über-mich-Seite fehlt Schärfe und Farbkontrast.

      das könnte beides gewollt sein; ich glaube es aber nicht.

      Das Anschneiden rechts beim Ellenbogen ist noch verschmerzbar, das Anschneiden des Ärmels links nicht.

      Finde ich nicht so schlimm. Wichtig finde ich bei Fotos von Personen, dass das Gesicht und der Oberkörper nicht abgeschnitten sind. Aber du hast recht: Das Seitenverhältnis des Bildes lässt ganz stark vermuten, dass es rechts und links zugeschnitten ist, und dann wäre sowas vermeidbar.

      Aber es gibt auch viele Menschen, die für solche Details einfach keinen Blick haben. Wenn mein Vater zum Beispiel ein historisches Gebäude oder sonst irgendeine Stadtansicht fotografiert, merkt er beim Fotografieren oft gar nicht, dass im Vordergrund z.B. ein Lampenmast oder ein Verkehrsschild das Bild stört. Und wenn er's dann später beim Anschauen des Bildes merkt, zuckt er mit den Schultern: "Och, macht doch nichts."

      Und was ist das für ein Puschel vor ihrem Auge? Hängt das Ding an ihrem Kopf? Nee, hängt im Hintergrund. Hintergrund darf sich nicht störend bemerkbar machen.

      Ah, gut. Da habe ich gar nicht so genau hingeschaut. Ich hab's beim flüchtigen Blick für eine Haarsträhne gehalten.

      Dass ein Foto einfach mal da ist, ist kein Grund, es zu publizieren. Wenn kein geeignetes Foto da ist, muss eben eins gemacht werden – am besten von jemandem, der sich mit Fotografieren auskennt.

      Oder man nimmt eins, das fast gut ist, und retuschiert ein bisschen. Aber bitte so, dass die Nachbearbeitung nicht als solche auffällt.

      Live long and pros healthy,
       Martin

      --
      Als Kind habe ich gelernt, dass die Vorsilbe un die Aussage eines deutschen Wortes ins Gegenteil verkehrt.
      Stimmt aber nicht: Unkosten sind auch Kosten!
      1. problematische Seite

        Hallo Martin,

        Das Seitenverhältnis des Bildes lässt ganz stark vermuten, dass es rechts und links zugeschnitten ist, und dann wäre sowas vermeidbar.

        da vermutest du richtig, siehe letztes Galeriebild.

        Gruß
        Jürgen

      2. problematische Seite

        @@Der Martin

        Oder man nimmt eins, das fast gut ist, und retuschiert ein bisschen. Aber bitte so, dass die Nachbearbeitung nicht als solche auffällt.

        Yep. 😆

        😷 LLAP

        --
        “When I was 5 years old, my mother always told me that happiness was the key to life. When I went to school, they asked me what I wanted to be when I grew up. I wrote down ‘happy.’ They told me I didn’t understand the assignment, and I told them they didn’t understand life.” —John Lennon
    2. problematische Seite

      Ich hab die Bilder mal etwas aufgehübscht, der Puschel war mir garnicht aufgefallen. Jetzt ist er weg 😉

  6. problematische Seite

    Hallo Martin,

    eine schnelle Suche nach „"Ingelis Gaertner" Lebensfäden“ ergibt keine Treffer. Das kam mir etwas seltsam vor. Normalerweise berichten Lokalzeitungen gerne von ortsansässigen Künstler*innen. Und siehe da: Eine Suche nach „"Ingelies Gaertner" Lebensfäden“ (man beachte das zusätzliche „e“) liefert einige Ergebnisse.

    Entweder schreiben alle anderen Publikationen den Namen der Dame falsch, oder du hast einen Tippfehler auf deiner Seite. Außerdem wird der Nachmame auf deiner Seite mal mit „ae“ (Über mich) und mal mit „ä“ (Angebot, Impressum) geschrieben.

    Das sollte man vermutlich noch vereinheitlichen …

    Gruß

    1. problematische Seite

      Oha, danke für den Tipp, gut dass der Name nicht in die Domain gekommen ist 🙈😄 wird gleich geändert

      1. problematische Seite

        Servus!

        Oha, danke für den Tipp, gut dass der Name nicht in die Domain gekommen ist 🙈😄 wird gleich geändert

        und bitte auch „Natuschutzgebiet Lauenburg“ in „Über mich“

        Herzliche Grüße

        Matthias Scharwies

        --
        Einfach mal was von der ToDo-Liste auf die Was-Solls-Liste setzen.“