Sprung (zurück) zu: Gestaltung (Übersicht)

Neuigkeiten der Gestaltung im World Wide Web 2024

– Fundstücke im WWW – Gedanken über Geschäfte und Ethik im Web.

Wie gestaltet es sich denn so, dieses globale Netz, das wir bald mehr und lieber als unser täglich Brot verzehren?

semantic web

Sammeln wir einmal mehr auch 2024, was sich als »dieses und jenes« aus dem Netz klauben lässt: Einige Beiträge aus unser aller »World Wide Web« liste ich hier gerne auf – da ich diese Beiträge für lesenswert halte …

Übersicht

Sympathische, gut gemachte Websites im Netz

Na ja, was soll das denn schon wieder sein: „sympathische Websites … gut gemacht“?

Vielleicht diese Richtung:

In der hauseigenen Thematik fundiert erscheinend … kein Tracking … keine PopUps, keine überdeckenden Banner … keine dumm kopierten oder generierten Datenschutzerklärungen … kein Style-Gedöns links, rechts, oben, unten auf den Seiten … am Ende LESBAR (vom Schriftbild bis Inhalt)?

exovia

Webdesigner aus Hamburg, Jennifer Weyers und Friedrich Siever. Aufrufen der Website: Keine bekloppten Aktivitäten-Verfolgungen der Nutzer, kein Ausspionieren.

exovia – „keine Sripte zur Aktivitätenverfolgung“

Irgendwie eine Seuche ist freilich der Anbieter Matomo, der sich auch (im Quelltext) bei exovia findet.

In Anbetracht dessen, was diese Website bietet, sind die Style-Angaben überschaubar, rund 3000 CSS-Anweisungen zuzüglich einiger (leider heute üblicher) Scripte.
Einige CSS-Scripte-Spielereien müssen wohl heute als „Standard“ auftauchen – auch auf dieser Website (wie auch bei den dortigen Referenzen). Aber alles erscheint unaufdringlich, clever gemacht, bald unauffällig.

Die Texte im ebenda Web Journal sind vom Schriftbild nicht nur lesbar, vielmehr informativ, also lesenswert.

Ob die beiden auch einen guten Job für Ihre Kunden machen? Da kann ich als Rosenbauer nur raten: Denke ja …

Und die Preise? Da frage ich den Falschen: Vermutlich könnte ich nicht so viele Rosen anbauen, welche ich verkauft bekommen müsste, um meine Website, schnöde, wie sie jetzt sei, für ein Site-Relaunch oder allein für ein Redesign in die Hände einer Agentur geben zu können – ob in die Hände dieser oder eine anderen Agentur.

Wundere mich sowieso, dass der Markt rundum Webdesign funktioniert, erscheint es mir manchmal doch so, dass die Anzahl der Schreiber von Websites zahlenmäßig größer sein könnte als die (potenzielle) Kundschaft all dieser Agenturen …

Vielleicht bedienen sie sich ja auch untereinander und gegenseitig, sozusagen ein sich selbst tragender Zirkel-Markt …

Cookies, Tracking, Analyse

Zu den oben genannten Richtlinien für eine „sympathische“ Website:

Knappe, nachvollziehbar kritische (Leit-)Gedanken über die zunehmende Tendenz, Besucher einer Website durchleuchten zu wollen … samt Anregungen für ein allgemein nachhaltiges, ethisch gesundes und die Umwelt schonendes Webdesign …

Theoretisch ist ja auch so was rundum Ethik und Umwelt denkbar, aussprechbar … auch im Webdesign … und es erscheint möglich, derlei umzusetzen … aber bedacht und gemacht wird es wohl eher selten?

Nach Durchsicht von gefühlt hundert Agentur-Seiten sind – im ersten Schritt – diese beiden hier oben übrig geblieben.
Bin bestimmt zu streng in meinen Maßstäben einer „guten Website“.

Anderseits, derlei wie die folgenden Websites braucht doch wirklich kein Mensch:

Auszug aus dem Kuriositäten-Kabinett der Branche professionelles Webdesign.

Derlei habe ich nicht gezielt gesucht, darüber bin ich allein – wieder einmal – im Vorbeigehen gefallen.

Einleitung

Agentur-Deutsch

Nö! Meine Seiten bearbeitet Ihr nicht … auch nicht an meiner Seite … Ihr Webdesign Agentur.

Dies gilt auch für die folgenden Anbieter.

Blocksatz … versus Flattersatz

text-algin: justify – da ist noch Platz …

Wie das so ist, Blocksatz ist irgendwie verpönt, deswegen gibt es hier bei mir jetzt alle Zeilen zentriert (was auch blöd ist) …

Die CSS-Anweisung text-align: justify; streckt die obigen Zeilen im Bild zwar bis ans Ende des Blocks (und siehe da, es erscheint ein Blocksatz): allerdings erscheinen halt auch Löcher und Lücken zwischen manchen derart mechanisch verschobenen Wörtern: zu viel Platz in den Zeilen … auch irgendwie nach oben, in die „Profi-Liga“?
Vielleicht hyphens: auto; hinzufügen? Der Inspektor von Firefox macht’s möglich: Foto zwei zeigt dann wenigstens keine Platzspiele in den Zeilen.

vielleicht mit hyphens: auto?

Weniger ist mehr? Nicht wenige Webdesigner unterschreiben und rufen dies: „Weniger ist mehr“. Stimmt! Dann macht mal.

Beide CSS-Anweisungen gestrichen, ergebe sich ein gewohntes, geschmeidiger lesbares Bild eines Flattersatzes:

Flattersatz ist auch im Web der beste Satz …

Aber so ist es natürlich nicht „professionell“, so ganz ohne justify und hyphens, vielmehr bloß „gewöhnlich” …

Banner-Gedöns … und Träumereien

Webdesigner-Träume einer seitenübergreifenden Aktivitätenverfolgung bis Fingerprint

Verfolgungsstrategien gegen Menschen eingesetzt, die Gott gefällig das Netz nutzen und zufälligerweise über solche Seiten fallen.

Da solche „Erhebungen“ ungehörig waren, sind und bleiben werden, exemplarisch diesen einen Profi-Webdesigner-Quark mal einzeln entblättert; fürs virtuelle Scrollen ist auch etwas dabei.

Zitieren wir vorab diese Agentur:

Worauf achten bei einer Webdesign-Agentur?

Nun ja, zum Beispiel darauf, ob die Website der Webdesign-Agentur aus Gedöns besteht:

Cookies- und sonstige Banner Cookies Aktivitäten-Verfolgung Fingerprint

Ich klick Euch einfach weg … und vermisse nix.

Schriften im (professionellem) Web(Design)

Schriftgröße (font) 9.11218pxfürs Menü.

Sieht nicht nur laienhaft aus, ist es auch, denn es lässt sich kaum lesen (schwarzer Balken ist das Menü):

Menü-Schrift zu klein

Via Firefox auf rund 14px gebracht, was immer noch eine kleine Schrift ist:

Menü-Schrift vergrößert

9px für Schrift ist nicht cool, sonder blöd.

Waffengeschäfte? Porno-Seiten? Freibier?

Da müssen wir mal mindestens 16 Jahre sein – oder Papa und Mama fragen:

Auszug Banner Datenschutz

In Variation:

wie zuvor

Was für ein Unsinn zutage tritt, wenn gewisse Begehrlichkeiten auf Bequemlichkeit treffen – und Datenschutz-Generatoren diesen kopierten Kram als eine weitere der zahlreichen Unzumutbarkeiten den Nutzern des Netzes vor den Kopf knallen.

Nebenbei, die 0 bis 15-jährigen Bengel und Luder werden ganz gewiss die Eltern fragen, bevor sie dieses Banner-Gedöns an-, weg-klicken …

Derlei Blödsinn im „Kontext“ …:

Banner-Gedöns rund um Datenschutz

… und Variation:

wie zuvor

So ist das mit dem Gedöns.

Da wird am Ende des Designer-Tages eRecht24 mit seinen unverbindlichen Auswürfen maschinell generierter Datenschutzerklärungen und Impressen sogar zum Aushängeschild „professionellem“ Webdesigns:

eRecht24-Banner-Gedöns

Solche Seiten, von denen die obigen Beispiele stammen, schaue ich mir selten noch weiter an – da steht i.d.R. auch in der Tiefe der Seiten nichts Erquickendes …

Dieser exemplarisch gesammelte Stuss begleitet aber das Surfen. Und ich gewöhne mich einfach nicht daran …

Logo Rose

Solides und unsolides Webdesign

Könnte auch im Artikel zuvor eingegliedert werden. Aber den Schwerpunkt und das Augenmerk auf „solide“ (anstelle auf „sympathisch“) zu legen, ist schon ein eigener Artikel wert.

Im Kern braucht eine Agentur einem selbst nicht sympathisch zu sein. Aber am Ende sollte eine solide, durchdachte und aufrichtige Arbeit das Ergebnis sein.

Eigentlich auf der Suche nach CSS-Spielereien, stolperte ich über folgende Website:

Formativ.net, Internetagentur. Sitz in Frankfurt und Karlsruhe.

Formativ.net, Startseite. Oktober 2024.

Klar, auch hier – im ersten Augenschein – erfreulich keine „Aktivitäten-Verfolgung“ erkennbar – interpretieren Sie dies stets als Ausdruck eines erfolgreichen, selbstbewussten Unternehmens …
Ein dickes ABER ist hierbei leider anzufügen – dazu aber später mehr …

Die Startseite strahlt vermeintlich einen etwas in die Jahre gekommenen Charme aus, man könnte auch spötteln, den Charme eines Vorgabe-Themes. Mit 3000 CSS-Anweisungen aber vergleichsweise heutzutage „sparsam“ unterwegs. Rundum lesbare Schrift, „klassische“ Menüführung auf dem Desktop und – nun ja – ein hübsches Foto im Kopfbereich von zwei Agenturmitarbeitern (der Geschäftsführung).
Das Einspielen der Schrift im Fuß des Fotos beim Öffnen der Seite hätte auch weg gekonnt … warum nicht gleich die Zeilen zeigen …

Gut gemacht ist das Erscheinungsbild bei den Handyformaten. Allerdings könnte das „Hamburger-Symbol“ fürs Menü und das „X“ fürs Schließen des Menüs vielleicht etwas mehr nach links platziert werden, aus dem Scroll-Anzeige-Bereich heraus? So bedient es sich unnötig etwas schlecht:

Handyformat, Bedienbarkeit Menü eingeschränkt

X-Symbol fürs Schließen des Menüs gänzlich überdeckt:

wie zuvor

Dies ist hier besser gelöst:

Handyformat, Bedienbarkeit Menü
wie zuvor

Ist das Menü geöffnet, führt (bei beiden) leider kein Weg nach unten in die Seite … hierfür muss das Menü entweder bedient oder geschlossen werden (wie leider so oft derart gehandhabt). Versteht sich mir nicht, dieses „entweder oder“ Bedienkonzept …

Soweit solide …

Solide Ende

Dreht man das Handy vom Längs- ins Querformat, so erscheint unvermittelt ein grauer, leerer Balken oder Raum zwischen Kopfbereich (Logo mit Hamburger-Menü) und Bildbereich. Was dieser Balken wohl soll?

Längsformat:

Handy Längsformat

Querformat:

Handy Querformat

Dieser graue Leerraum ist nicht so glücklich und bestimmt nicht gewollt.

Nimmt man die CSS-Anweisung absolute für diesen grauen, leeren DIV-Container heraus, springt der Text Ihre Internetagentur in Frankfurt und Karlsruhe im Querformat des Handys von unten in diesen grauen Bereich – was ja wieder passen könnte:

Ohne absolute

Dreht man aber das Handy dann wieder ins Längsformat, erscheint dieser obiger Text über den Köpfen der beiden Mitarbeiter hinweg geschrieben, was wohl ebenfalls nicht gewollt sein dürfte.

Mit dem original absolute aber erscheint der Text sowieso über den Köpfen hinweg im Querformat – egal also wie, beide Varianten sind mindestens unglücklich.[*]

[*] [Hätte man das mit dem Effekt der sich einblendenden Laufschrift gelassen, wären wohl diese Probleme nicht.]

Ich habe diese Agentur angeschrieben. Mal sehen, was sie antworten.

Derlei aber ist mir eigentlich wurscht. Bei einer (zu bezahlenden) Agentur ist derlei für die eigene Website gewiss nicht zu tolerieren, jedoch nicht wirklich entscheidend.

Was nervt

Was mir das anfänglich solide Bild dieser Website gänzlich zerschneidet ist dieser „versteckte“ Tracking-Quark.

Dieses Matomo-Script steht im Quelltext gleich ganz oben.

Auf dieser Website wie leider Gottes auch bei exovia [Sprung nach oben, Absatz].

Also ehrlich, braucht Ihr so etwas?

Bei Formativ.net findet sich unten im Quelltext ein weiteres Script eines externen Anbieters, von WPRocket – ein Anbieter, der schwerfällige bis überladene „WordPress-Sites“ wieder flott zu machen verspricht.
Darauf gehe ich nur soweit ein: Last WordPress und Co. doch einfach sein, wenn Ihr einen externen Anbieter braucht, der die eigene Website (oder die Seiten Euer Kunden) wieder ins „Google-Speed-Ranking“ befördern muss…

In Summe

… ist mir diese Agentur nicht „solide“ genug! Da täusche das seriös wirkende – vielleicht auch etwas langweilige – Theme-Format besser nicht …

Logo Rose

Grundsolides Webdesign

Es muss nicht WordPress (und Co.) sein – warum nicht das – auch für kommerzielle Websites – kostenfrei einsetzbare Content-Management-System (CMS) REDAXO? Schlanker ist es …

Wer eine Website ähnlich dieser Rosen-Website hier will, braucht überhaupt kein CMS; Internetpräsenz für Handwerker, Rechtsanwälte, Ärzte … Blumenladen, Strumpfwaren-Anbieter bis Dorf-Höker …. Rosengärten bis Parks: ein CMS ist hier meist schon überfrachtend.

Wie dem auch sei: Die Pflege der Website durch den Kunden muss erstes Ziel des Kunden aber auch einer Agentur sein.

Und hier ist eine Website ohne CMS möglicherweise sogar pflegeleichter als eine Website mit solchen Systemen.

Ist die eigene Pflege der Website nicht möglich oder nicht gewünscht, reduzieren sich – ist die Website nicht überfrachtet – wenigstens die Agentur-Kosten.

Netzbau.net

Ein weiterer Anbieter für das Schreiben einer Website sei abschließend noch aufgeführt:

Netzbau.net – eine Seite von Jürgen Eggers.

Desktop:

Netzbau, Desktop

Handyformat:

Netzbau, Handyformat

Mit 206 CSS-Anweisungen ist diese Website sehr sparsam unterwegs, was durchaus sympathisch (und wartungsarm) sei – und man sieht es dieser Website nicht an, diese Style-Sparsamkeit; auch nicht wahrnehmbar in deren Bedienung.

Aktivitäten-Verfolgungen finden sich weder im Browser noch im Quelltext.

Diese Website ist grundsolide. Hinsichtlich Html, CSS und wohl auch im PHP. Ebenso die Referenzen, soweit ich sie durchgeschaut habe.

„Anders, schöner, bunter“ geht auch unter einem solchen grundsolidem Ansatz – denken Sie sich halt zweckmäßig erscheinende Effekte und zwei-, dreihundert Style-Anweisungen hinzu …

Logo Rose

Bombastisches Layout

Cascading-Style-Sheets (CSS)-Anweisungen machen das Layout einer Website. Schön!

Als Amateur und Stümper des Webdesigns staune ich bis heute über dieses Handwerk: „eine Website schreiben“.

Will man keine Webdesign-Agentur beauftragen – oder es fehlen schlicht die finanziellen Mittel – schreibt man die eigenen Seiten halt selbst.
Allerdings ist es eine steile Lernkurve bis zur eigenen Website im Netz …

Die Inhalte fürs Web tauglich zu verfassen, es ist vergleichsweise leicht zu erlernen, die Sprache hierfür ist die wunderbare Hypertext Markup Language (html). Html ordnet die Inhalte, schafft Semantik … und ist immer schon für eine taugliche Darstellung der Inhalte auf allen Monitorgrößen geeignet gewesen. Letzteres heute unter Responsive Webdesign zelebriert wird – als ob es eine Innovation wäre.

Diese Html also reicht, um alle Inhalte auf Desktop und Handy zu bringen. Und die CSS können diese Inhalte stützen, die Semantik etwas fördern … dem Auge schmeicheln … also durchaus den Inhalten dienlich sein und dem Nutzer nicht nur eine nützliche, sondern eine „ansehnliche“ Website präsentieren.

Mitunter aber erscheint das Verhältnis von Inhalt einer „Internetpräsenz“ zu deren Layout (Design, Style) als „bekloppt“ – wie ich mich selbst zitieren darf.

Dachte ich bei Durchsicht diverser Websites, dass 15 Tausend Style-Anweisungen viel, ja geradezu maßlos seien – zumal für rund drei DIN-A4-Seiten Text – und 20 Tausend Style-Anweisungen ein Spitzenreiter der Layout-Übertreibung sei, toppt sich dies doch immer noch:

Webdesign in Bonn, Ausschnitt der Website

Webdesign ohne Gedöns – via 38.152 Regeln.

Ausschnitt Inspektor Firefox, Styleanweisungen

Über 38 Tausend Style-Anweisungen für eine Website. Kaum zu glauben! Zinnober einer Webdesign-Agentur, die meine Website schreiben will?

Falls CSS den Inhalten dienlich sein sollen, fragt man sich, wie schlecht die Inhalte sein dürften, die derart umfänglich Stütze benötigen …

Ich will jetzt nicht protzen: Meine Website braucht rund 75 CSS-Anweisungen. Diese Style-Anweisungen sollen nur dem Lesen (im World Wide Web) dienen – und beim Nutzer meiner Seiten nicht „Augenkrebs“ erzeugen.

Der restliche Rattenschwanz des Webdesigns interessiert mich (für meine Website) nicht (mehr) – auch nicht die unterschiedlichsten Geschmäcker in dieser Welt.

Tausende von Style-Anweisungen zeitigen aufgeblähtes Design, irgendwie arrogant wirkend, selbstgefällig bis selbstverliebt … irgendwie sogar dümmlich: Die Zeit, die notwendig ist, diese Tausenden Anweisungen zu schreiben und später auch noch zu pflegen, kann wahrlich besser anderweitig genutzt werden … für einen Strandspaziergang oder so …

Bombastisches Webdesign erscheint als einziger Trend, der über die Jahre nicht zu sterben, vielmehr „zu wachsen“ scheint …