Ich nutze RSS-Feeds sehr intensiv. Im Feed-Reader Feedly. Ich habe überwiegend Nachrichtenseiten abonniert und kann mir so schnell einen Überblick über die aktuellen Nachrichten des Tages verschaffen.
Auch Blogs, z. B. WordPress, bieten zumeist einen RSS-Feed an. Da ich kein CMS nutze, sondern alle Seiten manuell code, erstelle ich auch den RSS-Feed bzw. die zugrunde liegende XML-Datei manuell.
In der heutigen digitalen Welt ist Online Marketing zu einem unverzichtbaren Instrument für Unternehmen jeder Größe geworden. Es bietet eine Vielzahl von Möglichkeiten, um Produkte und Dienstleistungen einer breiten Zielgruppe zugänglich zu machen. Dabei geht es nicht nur um das Schalten von Anzeigen im Internet, sondern um eine ganzheitliche Strategie, die verschiedene Kanäle und Techniken vereint.
In der heutigen Webentwicklung ist Dateigröße ein entscheidender Faktor für Ladezeit, Nutzerfreundlichkeit und Suchmaschinenranking. Für Videos bedeutet das: Wer eine moderne, schnelle Website betreiben will, sollte sich mit dem Format .webm beschäftigen. Dieses von Google entwickelte Format überzeugt durch geringe Dateigrößen bei hoher Qualität – und wird von allen gängigen Browsern unterstützt.
Anfrage: Eine Website zusätzlich mit Leichter Sprache ausstatten.
Meine erste Reaktion: Viel zu teuer. Einschlägige Übersetzungsbüros verlangen pro Seite (ca. 1.800 Zeichen) 150,– € aufwärts.
Doch dann tat ich, was ich seit Langem immer dann tue, wenn ich zu bequem bin, selbst zu coden …
Kürzlich habe ich geschrieben, dass ich keine eigenen Artikel zum Thema Webdesign mehr veröffentlichen werde. Der Grund :ChatGPT
Robert Lender hat den Artikel kommentiert, und seine Anregung greife ich gerne auf.
Seit Monaten habe ich hier keinen neuen Artikel mehr eingestellt. Und dabei bleibt es vermutlich auch, zumindest bis auf weiteres.
Der Grund: ChatGPT.
Ja, Sie haben richtig gelesen …
Um mehrere Bilder auf einer Webseite zu präsentieren, greift man gerne zu Lightbox, oder einer der zahlreichen Alternativen.
Wenn aber nur ein einzelnes Bild in Großansicht gezeigt werden soll, lässt sich dies auch mit wenigen Zeilen JavaScript und CSS realisieren.
Vor längerer Zeit habe ich gezeigt, wie man mehrere Audio-Player auf einer Seite so einbindet, dass mit dem Anhalten des einen Players alle anderen gestoppt bzw. pausiert werden.
Das funktioniert natürlich auch mit Videos.
Es muss nicht immer gleich ein mächtiges Analysetool wie Google Analytics oder Matomo sein. Manchmal will man einfach nur wissen, wie oft eine bestimmte Seite besucht wird.
Frames gehören ja zum Glück in die Mottenkiste des Webdesigns. Aber für iFrames (Inline Frames) gibt es nach wie vor – mehr oder weniger sinnvolle – Anwendungsfälle.
Der Marktanteil des Internet Explorers an der Internetnutzung in Deutschland ist bis 2023 auf 0,35% gesunken. Dies rechtfertigt meines Erachtens die Entscheidung, den IE nicht mehr explizit zu berücksichtigen.
Die WCAG / BITV fordern für barrierefreie Webseiten:"Wenn die Tonspur eines aufgezeichneten Videos Informationen enthält, müssen Untertitel als Alternative bereitgestellt werden." Die technische Umsetzung dieser Forderung ist recht einfach. Einfach das video-Tag um das track-Element erweitern, um die Datei untertitel.vtt einzubinden …
Moderne Browser verhindern Video- und Audio-Autoplay, das "automatische Losdudeln von Musik" beim Aufruf einer Webseite. Zu Recht, wie ich meine. … eine interessante Möglichkeit: Ein Video automatisch pausieren, wenn es aus dem Viewport gescrollt wird.
Ein Symbol soll so in eine Webseite eingebunden werden, dass es wie Schrift mittels CSS gestyled werden kann.
Nachdem Künstliche Intelligenz (KI) "brauchbare Texte auf Knopfdruck" erstellt, bietet DeepL Write von den Entwicklern des "Übersetzungswunders" DeepL Translate nun auch die automatische Optimierung von Texten an.
Webseiten sind heute ein wichtiger Teil unseres täglichen Lebens und werden von vielen Menschen genutzt, um Informationen zu finden, zu kommunizieren und online zu shoppen. Es ist daher wichtig, dass Webseiten für alle Nutzer zugänglich und leicht zu verwenden sind, unabhängig von ihren Fähigkeiten oder Einschränkungen. (Artikel automatisch erstellt von ChatGPT.)
Alle reden über ChatGPT und GPT3, aber es gibt auch eine kostenlose Open-Source-Version von GPT-3 namens OPT-175B
Tooltip – so nennt man das kleine Fenster, das aufpoppt, wenn ein HTML-Element ein title-Attribut hat.
Ob der Text des title-Attribut aber wirklich in einem Tooltip angezeigt wird, hängt vom Browser ab, u.U. auch von speziellen Einstellungen des Browsers. Ganz sicher nicht angezeigt wird der Tooltip auf Touchscreens, weil es dort kein Hovern des Mauszeigers gibt. Ob die Information den User erreicht, ist also mehr als fraglich.
Responsive Web Design (RWD) ist heute unverzichtbar, nachdem mehr als 50 % aller Webseitenbesuche mit dem Smartphone erfolgen. Aber es ist nicht damit getan, das Design an den kleinen Monitor anzupassen. Wichtiger ist es, die zu übertragende Datenmenge zu optimieren, um akzeptable Ladezeiten im Mobilfunknetz zu gewährleisten, und das möglicherweise begrenzte Datenvolumen der Besucher zu schonen.
Ich will ein Icon auf dem Home-Bildschirm meines iPhones einfügen, das nach einem Tipp direkt ein Bild zeigt. In meinem Fall zeigt das Bild einen QR-Code. Ich will also den QR-Code ohne lange Umwege mit einem Tipp auf den Bildschirm holen.
Mein jüngstes Projekt – ein sog. One Pager – habe ich (auch) dazu benutzt, alle verfügbaren Techniken zur On-Page-Optimierung einzusetzen. Zweck der Übung: Optimierung der User Experience (UX), und möglichst gute Sichtbarkeit in Suchmaschinen (v.a. natürlich Google).Achtung! Viel Fachchinesisch! TL;DR
Die Aufgabe: Ein (oder mehrere) Bild(er) regelmäßig aktualisieren, ohne die ganze Seite zu reloaden.
… damit Sie von diesem Banner in Zukunft nicht mehr genervt werden, müssen Sie auf den Button "Hinweis schließen" klicken. Wir setzen dann ein Cookie, das bewirkt, dass Sie in Zukunft diesen Banner nicht mehr sehen, der Sie darauf hinweist, dass wir keine Cookies setzen – außer dem Cookie, das benötigt wird, damit Sie diesen Hinweis nicht mehr sehen, der Sie darauf hinweist, dass wir keine Cookies setzen, die …
Staubsauger mit Kabel […] sind wahre Energiefresser. Werden sie einmal pro Woche auf höchster Stufe betrieben, verbrauchen sie über zehn Jahre etwa doppelt so viel Strom wie Akkusauger. Selbst wenn diese Geräte irgendwann einen Ersatzakku benötigen, liegen sie in der Ökobilanz noch immer vorn.
Die Seite Narrative Device hyped gerade auf Twitter & Co. Ein Student aus Sydney hat eine kleine KI entwickelt um automatisch Texte zu erstellen. Ein nettes Spielzeug.
Ein Bild sagt mehr als 1000 Worte. Das ist wohl der Grund, warum praktisch alle Artikel im Web mit einem (Teaser-)Bild daherkommen. Auch ich versuche meine Artikel mit einem Bild zu illustrieren – wenn es ein irgendwie zum Thema passendes Bild gibt. Dieses Bild biete ich dann auch als Teaserbild für den RSS-Feed an.
Nein, IONOS, das geht gar nicht! Eine korrekt per Online-Formular erfolgte Kündigung einfach einseitig in eine "Kündigungvormerkung" umdeuten? Seit 2016 ist dieses Ansinnen sogar gesetzlich unzulässig.
RSS-Feeds sind ein tolles Werkzeug. Ich habe Feeds der wichtigsten Zeitungen abonniert, um mir schnell eine Übersicht aktueller Artikel aufzulisten. So kann ich anhand der Überschrift bzw. des Teasers entscheiden, ob ich den kompletten Artikel lesen will. Und häufig genügt ja auch der Teaser bereits, um schnell informiert zu sein. Doch leider kann man sogar mit RSS-Feeds so etwas wie Spam produzieren …
Ich werde […] unter dem Schlagwort "Fotoblog" in der Kategorie "Dies und Das" hin und wieder eine Auswahl meiner Lieblingsfotos posten.
Nach der endgültigen Abschaltung meines früheren WordPress-Blogs sind nur noch eine Handvoll der über 1000 Artikel aus meinem Blog verfügbar.
Broken links, also Links, die ins Leere führen, sind eine Plage im Web, und ein Zeichen für eine schlecht gepflegte Website.
Der geniale Fotodienst https://unsplash.com stellt eine riesige Auswahl an Fotos zur absolut freien und kostenlosen Nutzung bereit. Sogar Embedding mit einer einzigen Zeile HTML ist möglich, ohne jegliche Programmierung.
Eine ganze Webseite ausdrucken – kein Problem. Aber wenn nur ein einzelnes Bild gedruckt werden soll, dann kommen weniger versierte Besucher u.U. an ihre Grenzen. Mit ein wenig JavaScript kann man dem Besucher die Arbeit erleichtern.
Es muss nicht immer gleich ein mächtiges Analysetool wie Google Analytics oder Matomo sein. Manchmal will man einfach nur wissen, wie oft ein bestimmter Link angeklickt wird. Ich hab' das mal mit wenigen Zeilen PHP und AJAX realisiert.
Die Bundesregierung hat ihren Entwurf zum Leistungsschutzrecht beschlossen. Danach gilt u.a.: Nutzer können […]Bildausschnitte hochladen, die 125 Kilobyte nicht überschreiten, wenn diese Menge nicht gleich die Hälfte eines Werkes umfasst. …
Flash of Unstyled Content (FOUC), oder Cumulative Layout Shift (CLS). Beides bezeichnet das – unerwünschte – Verhalten, dass sich laufend noch Elemente auf der Seite verschieben, während diese geladen wird oder sogar danach noch. Ursachen …
Keine Ahnung, ob jemand so etwas braucht. Irgendwie fühlt sich das so richtig "old school" an; und letztlich habe ich das einfach nur als Fingerübung codiert. Aber ich finde, ein Kalender passt einfach zum Jahresanfang. …
Die Aufgabenstellung: Den Unterschied zwischen zwei Bildern zeigen. Am einfachsten wäre es natürlich, die zwei Bilder nebeneinander zu platzieren, in der Hoffnung, dass klar wird, was sich genau geändert hat. Aber es geht eleganter …
Mit ein wenig CSS eine Tabelle responsiv machen. Im Beispiel wird eine dreispaltige Tabelle auf Bildschirmen mit weniger als 600px Breite linearisiert, d.h. jede Zelle wird in einer eigenen Zeile mit vorangestelltem Spaltentitel angezeigt. Die Lösung ist barrierefrei.
Eine Bildergalerie braucht man immer wieder. Ich habe mich daher nach Alternativen umgeschaut und 3 davon angetestet.
Für Entwickler, die responsive Webseiten auf dem iPhone debuggen wollen, also nicht nur das Layout prüfen, sondern auch Funktionen wie JavaScript testen, stellt Apple ein geniales Werkzeug zur Verfügung.
Zitat Apple: "Mit Handoff kannst du auf einem Gerät mit der Arbeit beginnen, dann zu einem anderen Gerät in der Nähe wechseln und dort weitermachen, wo du aufgehört hast." Aber warum ist dieses Apple-Feature für mich wichtig, und was, wenn es nicht (mehr) funktioniert?
Animated GIFs kann man ohne weiteres durch HTML5-Videos ersetzen, und dennoch das Look & Feel eines animated GIFs erzeugen. Das Erstaunliche daran: Die Dateigröße schrumpft durch die Umwandlung in HTML5-Videos typischerweise um einen Faktor 6 bis 10. Und das Beste: Ein wenig JavaScript schafft die Möglichkeit, das Gezappel mit einem Klick zu beenden (und auf Wunsch auch wieder zu starten).
Wenn es um Barrierefreiheit im Web geht, dann ist der erste Gedanke immer: Webseiten sollen auch für blinde Menschen zugänglich sein. Und gleich darauf der Einwurf: Denkt nicht nur an blinde Menschen, sondern auch an die zahlreichen Besucher, die Webseiten nur mittels Tastatur bedienen, weil sie keine Maus haben / benutzen (können).
Nun ist es wohl amtlich: Wer das Analysetool Google Analytics auf seiner Website einsetzen will, muss vorab die Zustimmung des Besuchers einholen. Welche Möglichkeiten hat der Betreiber einer kleinen Website / eines Blogs jetzt?
Seit langem haben praktisch alle Browser PDF-Reader integriert. Damit ist das Lesen von PDFs direkt im Browser möglich, ohne das Dokument erst herunterzuladen und in einem eigenen Programm zu öffnen …
Wer hier veröffentlichte Code-Snippets verwenden will, kann das jeweilige Snippet mit Maus oder Tastatur markieren, und dann mittels Strg + C in die Zwischenablage kopieren. Doch es geht eleganter: Ein Button, der alles mit einem Klick und mittels JavaScript erledigt.
Webfonts sind eine feine Sache. (Fast) jeder Wunsch nach einer individuellen Schriftart für die Website lässt sich damit erfüllen. Der Wermutstropfen dabei: Die Font-Dateien sind leider recht groß; 100 kB oder mehr können es schon mal sein. Wenn ich nun aber eine bestimmte Schrift nur für den Seitentitel brauche, also nur wenige Buchstaben?
URL-Vertipper auf dem iPhone zu korrigieren kostet Nerven. Einmal angetippt, markiert Safari die gesamte Adresse. Daneben getippt, verschwindet die Adresse aus der Adressleiste. So ist es praktisch unmöglich, die Adresse zu editieren. Keine Ahnung, was Apple sich dabei gedacht hat. Ein Trick hilft.
Auch in Zeiten von Corona die Kommunikation in einer Gruppe aufrecht erhalten: Dafür gibt es ja WhatsApp, FaceBook und Konsorten. Wer Wert legt auf Likes und ähnliches, und wem es egal ist, was mit seinen privaten Daten geschieht, ist dort gut aufgehoben.
Wer eine eigene Homepage hat, kann aber auch ganz einfach einen Chat selbst installieren, und selbst bestimmen, wer auf die Daten Zugriff hat.
Wie kommt das Lupensymbol als Wasserzeichen ins Vorschaubild? CSS macht's möglich.
Weil das Tracking und das Sammeln von persönlichen Daten häufig mittels Cookies erfolgt, dürften wohl immer mehr Menschen Cookies in Ihrem Browser blockieren. Möglicherweise werden dadurch auch unwissentlich nützliche oder gar notwendige Funktionen auf einer Website blockiert. Ich halte es daher für erforderlich, den Besucher ausdrücklich darauf hinzuweisen, wenn er Cookies blockiert hat.
Ich mag gern wissen, ob ein Link zu einer anderen Stelle innerhalb meines Webauftritts verweist, oder zu einer fremden Site. Deshalb kennzeichne ich Links zu fremden Seiten mit einem Icon.
Dark Mode – nur eine Modeerscheinung? So etwas hatten wir doch in den 1990ern unter DOS auch schon. Und auf dem Desktop gab es auf meiner Site den Dark Mode auch "schon immer", er hieß nur anders: "Invers".
Wie dem auch sei: Jetzt gibt es den Dark Mode auch auf dem Smartphone. Ich musste das einfach als Fingerübung umsetzen.
Apples Time Machine: Genial – mit kleinen Schwächen. Automatische inkrementale Backups im Hintergrund und über WLAN. WLAN ist insbesondere deshalb pfiffig, weil andernfalls eine Automatik auf dem Macbook wenig Sinn machen würde. Wer betreibt schon ein Macbook mit permanent angeschlossenem LAN-Kabel?
Mit dem Aufkommen der kleinen Digitalkameras, und erst recht mit den Smartphone-Kameras, sind die Objektivbrennweiten extrem kurz geworden. Nach den Gesetzen der Optik folgt daraus ein sehr großer Tiefenschärfebereich. Gut für den Gelegenheitsknipser, der sich nicht mehr um das Fokussieren, das Scharfstellen, kümmern muss.
Leider fehlt diesen Fotos damit jegliche Spannung, die sich durch das Spiel mit dem Fokus auf den wesentlichen Bildanteilen, und Unschärfe für den Hintergrund, ergibt.
Apples Live Photos, mit dem iPhone erstellt, sind eine feine Sache. Das Problem dabei (wie häufig bei Apple-Features): Nutzung ausserhalb des Apple-Universums ist kaum bzw. nur eingeschränkt möglich.
Google musste hier einschreiten, und eine Exportmöglichkeit schaffen.
Die iOS-Tastatur ist von Haus aus kontext-sensitiv, d.h. sie passt sich an die zu erwartenden Eingaben an. Buchstaben oder Ziffern, sowie fallweise auch Sonderzeichen wie z.B. das @-Zeichen werden je nach Kontext automatisch angezeigt. Auch die Enter-Taste ist "intelligent". In einer Textarea zeigt sie das Pfeilsymbol, das die Zeilenschaltung symbolisiert, und wenn der Fokus in einem Suchfeld steht den Text "Suchen".
Wer seine Webpräsenz für eine internationale Zielgruppe erstellt, wird seine Seiten möglicherweise in mehreren Sprachen anbieten. Üblicherweise gibt es für diesen Zweck gleich am Seitenanfang entsprechende Links zu den angebotenen Sprachen, häufig in Form von Flaggen-Icons. Wünschenswert wäre es nun, dass der Besucher beim erstmaligen Besuch der Site gleich die Sprache seiner Wahl vorfindet. Möglich wird dies, indem man per PHP die im Browser des Besuchers eingestellte bevorzugte Sprache auswählt.
Ich verstehe, dass Strato, um Geld zu verdienen, Hunderte von Kundenwebsites auf einen Server packt, und mit allerlei schwarzer Magie jedem einzelnen Kunden irgendwie ein wenig Rechenzeit zuweist. Für die Homepage des Kaninchenzüchtervereins Hinterkleinkleckersdorf (nichts gegen Kaninchenzüchtervereine) mag das ja ausreichend sein. Aber ich werde in Zukunft jedem potenziellen Kunden beim Umzug zu einem "richtigen" Webhoster behilflich sein.
Seit 2010 gibt es WebP, ein Grafikformat für verlustbehaftet oder verlustfrei komprimierte statische oder animierte Bilder. WebP liefert bessere Komprimierung, also kleinere Dateien, bei gleichzeitig besserer Qualität, im Vergleich zu JPEG.
E-Mail Spam tritt in unterschiedlichsten Formen auf. Wenn allerdings massenhaft E-Mails der folgenden Art in deinem Postfach landen, dann ist möglicherweise Schlimmeres passiert …
Google reCAPTCHA v3 verspricht, Menschen von Bots zu unterscheiden, ohne die Menschen mit unleserlichem Text oder unkenntlichen Bildern von Verkehrsampeln, Geschäften, Hydranten u.ä. zu belästigen. Sollte das wirklich klappen, wäre es ein großer Schritt Richtung bessere Usability, und endlich eine barrierefreie CAPTCHA-Lösung.
Die Spatzen pfeifen es von den Dächern: Mensch surft heute mobil, mit Smartphone oder Tablet.
Weniger als ein Drittel der Zugriffe erfolgt noch "klassisch" vom Desktop-PC, die Mehrzahl mit dem Smartphone (von unterwegs?).
Ein schlagendes Argument für die Notwendigkeit von Responsive Web Design (RWD).
Wie viele User verträgt der Chat eigentlich? Diese Frage wird immer wieder gestellt. Und meine Antwort zumeist: Es kommt darauf an. Die maximale Anzahl von Usern im Chat ist von so vielen Faktoren abhängig, dass eine allgemeine Aussage nicht seriös wäre. Es ist aber durchaus möglich, den Chat mit 100+ Usern zu betreiben.
Um Sourcecode auf Webseiten lesbar zu machen (natürlich responsive, also auf jeder Monitorgröße), ist CSS erforderlich. Ich verwende diese CSS-Anweisungen …
Time Machine ist eine sehr komfortable Möglichkeit, regelmäßig automatisch Backups des Macs zu erstellen. Nervig ist einzig, dass das Intervall der automatischen Sicherungen unveränderlich auf eine Stunde eingestellt ist. Abhilfe …
Bilder erst dann vom Server laden, wenn sie durch Scrollen in den Viewport gelangen. Vor allem auf Smartphones kann diese Technik massiv zum Datensparen beitragen.
Es gibt zahllose Möglichkeiten, Webseitenbesucher zu vergraulen. Heute habe ich zwei neue kennengelernt.
Was bei "Umzügen" von einzelnen Seiten innerhalb eines Webauftritts zu beachten ist, wird in diesem Artikel kurz zusammengefasst.
Eine Technik, animated GIFs durch HTML5-Videos zu ersetzen, und dennoch das Look & Feel eines animated GIFs zu erzeugen. Das Erstaunliche daran: Die Dateigröße schrumpft durch den Einsatz von HTML5-Videos typischerweise um den Faktor 10.
Hab' ich es zu weit getrieben? Nicht nur der Hamburger-Button ist animiert, sondern auch das Headerbild und das Auf- und Zuklappen der Navigation. Aber darum soll es heute nicht gehen …
"Wählen Sie alle Bilder aus, die ein Geschäft von vorne zeigen", oder so ähnlich. Wer kennt das nicht, und ist davon genervt?
Ein Browser-Addon schafft Abhilfe.
Ohne den Hamburger-Button kommt heute keine Responsive Website mehr aus.
Wie man einen hübsch animierten Hamburger-Button ganz ohne Grafiken erzeugt, und wie man damit ein Navigationsmenü auf- und zuklappt.