Herzlich willkommen in meiner Welt! In diesem Blog findest du interessante Anleitungen zu neuesten Web-Frontend-Technologien, aber auch einiges zu meinen weiteren Leidenschaften Hypnose-Therapien und Bücher schreiben.
Kurz etwas über mich: Ich heisse Stephan, lebe in einer langjährigen Beziehung mit Anja und arbeite als Web-Entwickler. Falls du Rückfragen hast, antworte ich dir gerne.
Zur Anzeige eines Icons soll nur genau den für dieses Icon erforderliche SVG-Code geladen werden. Oft werden jedoch dieselben Icons mehrfach benötigt, was unnötige Redundanzen der vom Server gelieferten Daten erfordern und damit die Performance beeinträchtigen würde. Daher ist es besser, die Icons beim ersten Laden im Session Storage abzulegen und ab dem zweiten Bedarf von dort zu holen.
Wir gehen daher davon aus, dass initial nur ein leeres <span class="icon-xyz"> gerendert wird, um darin das SVG-Icon per Javascript aus dem lokalen Session Storage zu laden. Und nur falls es dort nicht vorhanden ist, wird eine Server-Abfrage gemacht, also genau einmal pro Session.
Native Check- und Radioboxen werden in jedem Browser anders dargestellt. Für ein einheitliches Design muss man also selbst Hand anlegen. In diesem Beispiel werden die Check-Haken und Radio-Punkte mittels einer SVG-Grafik eingebunden. Der Rest ist per CSS einfach darstellbar.
Wer eine eigene Cloud betreiben möchte, wird sich vielleicht für die Synology-Variante entscheiden. Synology unterstützt Windows, macOS und Ubuntu als mögliche Client-Betriebssysteme und bietet den dazu erforderlichen Synology Drive Client auf ihrer Homepage an. Leider gibt es dort kein Client-Paket für openSUSE Tumbleweed. Folglich musste ich das Paket selber bauen, womit nun auch openSUSE als Client korrekt funktionniert. Hier kannst du das rpm-Paket herunterladen.
Farben lösen Emotionen aus. Um so wichtiger ist es, stets den korrekten Farbton zu treffen. Dazu stehen uns Web-Entwicklern verschiedene Farbräume zur Verfügung. Der Klassiker ist RGB. Leider wird dieser gerne unterschiedlich interpretiert, was dazu führt, dass dieselbe Farbe abhängig von verwendeter Soft- und Hardware anders dargestellt wird. Mit Standard-RGB (sRGB) sollte alles besser werden. Doch im Nachgang dieser Überarbeitung wurden noch einige weitere Farbräume zur Verfügung gestellt, von denen insbesondere OKLAB in der Web-Entwicklung wesentlich mehr Potential hat.
Vergleichen wir also den Platzhirsch RGB mit dem Herausforderer OKLAB. Welchen Mehrwert bietet OKLAB und wie wird es eingebunden?
Als Web-Entwickler wissen wir alle, dass es eine gute Idee ist, Code so oft wie möglich wiederzuverwenden. Bei benutzerdefinierten Markup-Strukturen war dies traditionell nicht so einfach. Spätestens seit Januar 2020 bieten uns Web-Komponenten die lang ersehnten Möglichkeiten, solche Probleme zu lösen. Sie bestehen aus mehreren Haupttechnologien, die zusammen verwendet werden können, um vielseitige benutzerdefinierte Elemente mit gekapselter Funktionalität zu erstellen, die überall wiederverwendet werden können, ohne dass du Code-Kollisionen befürchten musst. Gehen wir dies also Schritt für Schritt an.
Mit der Popover API lassen sich alle Sorten von Overlays nativ einbinden, also praktisch ohne Javascript. Unter dem Begriff Overlays (deutch: Überlagerungen) werden alle Arten von Dialoge, Dropdowns, Toasts, Slide-Ins, Fly-Ins, usw. zusammengefasst. Popovers sind nicht-modal. Sie können aber pseudo-modal sein, indem sie als <dialog>-Element eingebunden werden.
Wir fokusieren uns jedoch in diesem Beitrag auf den non-modalen Toast. Toasts sind Benachrichtigungen, die üblicherweise unten links oder rechts eingeblendet werden.
"RSS-Atom-Feeds, wie retro!", werden nun manche aufschreien. Doch die Feeds feiern gerade eine neue Rainessance. Für jüngere Leser könnten diese Feeds sogar Neuland bedeuten.
Ein RSS-Feed ist ein Dateiformat für Web-Feeds, das Änderungen auf Websites wie News-Seiten, Blogs, Audio-/Video-Logs und mehr anzeigt. Das Akronym RSS steht für Really Simple Syndication.
Nähern wir uns der Sache also von Grund auf an. Was sind Feeds und wie werden sie Server- und Client-seitig eingerichtet?
Viele neue Verbesserungen im nativen CSS, wie beispielsweise Variablen und Verschachtelungen, machen den Einsatz von Präprozessoren wie SCSS (nahezu) überflüssig.
Es ist also höchste Zeit für eine Auslegeordung. Benennen wir die bisherigen Hürden und zeigen Lösungswege für eine Migration von SCSS auf CSS auf.
Wenn man die inzwischen überall bekannten Cookie-Warnungen abgenickt hat, möchte man in der Regel nicht mehr damit belästigt werden. Auch dann nicht, wenn man die Seite Tage später erneut besucht. Die herkömmliche Lösung hierfür ist - wer hätte es gedacht - ein Cookie! Doch ist das wirklich der richtige Ansatz?
Wir befassen uns in diesem Beitrag mit den Vor- und Nachteilen von Cookies gegenüber dem Local Storage und zeigen, wie du den Local Storage als Cookie-Alternative verwenden kannst.
Google Analytics 4 Measurement Protocol (GA4MP) ist ein standardisierter Satz von Regeln zum Sammeln und Senden von Ereignissen direkt an den Google Analytics-Server. GA4MP ermöglicht es dir, Daten von internetfähigen Geräten zu senden, die deine Website oder App ergänzen.
Hier findest du eine Anleitung, wie du mittels GA4MP verfolgen kannst, ob deine E-Mails geöffnet werden.
Direkt im HTML eingebundene E-Mail-Links und Kontaktformulare werden von Bots abgegriffen und für Spam und Phishing missbraucht. Du willst das verhinden. Dennoch willst du beides den seriösen Website-Besuchern anbieten.
Hier findest du eine Anleitung, wie du E-Mail-Adressen und Formulare in deine Website einbinden und dennoch vor Bots schützen kannst.
Web-Push-Benachrichtigungen sind kurze Nachrichten, die Websites an deine Geräte senden können, selbst wenn du die Website gerade nicht aktiv besuchst. Sie ähneln den Benachrichtigungen von Apps und werden vergleichbar auf deinem Desktop oder Mobilgerät angezeigt.
Hier findest du eine Anleitung, wie du Web-Push-Benachrichtigungen in deine Website einbinden und versenden kannst.
Service Worker sind ein Web-Standard, der es Entwicklern ermöglicht, einen Hintergrund-Dienst für ihre Websites zu erstellen. Service Worker können zum Beispiel verwendet werden, um Offline-Funktionalität für Websites bereitzustellen, den Cache von Ressourcen zu verwalten oder Push-Benachrichtigungen zu senden.
Hier findest du eine Anleitung, wie du einen Service Worker in deine Website einbinden kannst.
Bücher sind seit Jahrhunderten ein wichtiger Bestandteil der menschlichen Kultur. Sie sind ein Medium, mit dem wir uns über die Welt informieren, neue Erfahrungen machen und unsere Fantasie ausleben können. Bücher können uns in ferne Länder entführen, uns mit anderen Kulturen vertraut machen und uns neue Perspektiven eröffnen. Sie können uns aber auch zum Lachen bringen, zum Weinen bringen oder einfach nur zum Träumen verführen.
Wenn du Lust hast, Bücher zu lesen, die ich gerade am Schreiben bin, dann bist du hier genau richtig.
Geo-Location per IP ist ein Verfahren, mit dem der Standort eines Geräts mithilfe seiner IP-Adresse ermittelt werden kann. Eine IP-Adresse ist eine eindeutige Nummer, die einem Gerät im Internet zugewiesen wird. Sie wird verwendet, um Daten zwischen Geräten zu übertragen.
Geo-Location per IP basiert auf der Annahme, dass die IP-Adresse eines Geräts mit seinem Standort in Verbindung gebracht werden kann. Dies ist möglich, da IP-Adressen von Internet Service Providern (ISPs) zugewiesen werden. ISPs haben in der Regel eine bestimmte Region oder Stadt, in der sie tätig sind.
Die subliminale Therapie (auch Yager Code genannt) ist eine psychotherapeutische Methode, die sich der unbewussten Wahrnehmung bedient, um Verhaltensänderungen zu erzielen. Sie wurde in den 1970er Jahren von dem amerikanischen Psychiater Dr. Edwin Yager entwickelt und wird seitdem in der Behandlung einer Vielzahl von psychischen und körperlichen Problemen eingesetzt.
Hier findest du eine Schritt-für-Schritt-Anleitung in der Subliminal Therapie. Dieser Leitfaden richtet sich an Hypnosetherapeuten, die idealerweise eine OMNI- und ST-Ausbidlung genossen haben.
Man soll sich entspannen, um neue Kräfte zu sammeln. Doch da sitzt man nun zu Hause rum und fragt sich, wie das denn geht, ohne sich dabei zu langweilen.
Da gibt es die Aktiven. Sie behaupten, man müsse etwas unternehmen. Etwas ganz vom Alltag abweichendes. Nur so würde man Erholung finden. Doch was machen jene, die keine Zeit, kein Geld oder schlicht nicht die Gesundheit haben, um die Welt zu erobern?
Farben lösen Emotionen aus. Je nach Farbe ganz unterschiedliche. Man sieht rot, wenn man wütend ist. Und auch umgekehrt macht uns zu viel rot aggressiv.
Über das Wechselspiel zwischen den Farben und unseren Emotionen gibt es zahlreiche wissenschaftliche Studien. Besonders herausragend sind die Erkenntnisse von Robert Plutchik, der in den 1960er bis 1990er Jahren eine auf Farben basierende Emotionstheorie entwarf, die bis heute Gültigkeit hat. Auf seinen Erkenntnissen baut die moderne Psychoanalytik auf. Sogar in Hypnosetherapien wird damit gearbeitet. Es ist wichtig, einer Emotion eine Farbe zu geben. Farben dienen als Anker zu einem Gefühl. Ein Gefühl, das eine komplexe Sequenz auslöst, die von einer Emotion begleitet ist.
Doch was bedeutet das für uns?
Das Clairon (franz. claim = hell) entwickelte sich aus den ägyptischen und römischen Fanfaren, welche zumeist in Kriegen und bei gottesdienstlichen Kulten Verwendung fanden. Während der Grenzbesetzung im 2. Weltkrieg und anlässlich der "Land 1939" lebte das Claironspiel in der Schweiz neu auf. 1947 gründete die Jungwacht St. Anton in Basel die erste Clairongarde, wobei das Repertoire vor allem in Anlehnung an die franz. Armee aus Militärmärschen bestand. Später entwickelte sich ein eigener Stil mit eigenen Melodien.