GSAP jetzt völlig kostenlos: So beendest du Scroll-Pinning per Bedingung
Hey Leute, habt ihr’s schon mitbekommen? Die legendäre Animation Library GSAP (GreenSock Animation Platform) ist jetzt komplett kostenlos geworden – kein Abo, einfach frei nutzen! 🎉 Grund genug, direkt ein paar coole Tricks auszuprobieren. In diesem Beitrag zeige ich dir, wie du ein gepinntes Section-Element beim Scrollen programmgesteuert lösen kannst – ganz ohne aufwändige Höhen- […]
Sprachausgabe im Web mit der Web Speech API
Wenn du wie ich begeisterter Entwickler bist und gerne neue Web-Technologien ausprobierst, dann ist die Web Speech API eine jener Schnittstellen, die auf den ersten Blick einfach wirken, aber eine beeindruckende Tiefe bieten. Als ich das erste Mal die speechSynthesis-API in meinem Browser ausprobierte, war ich fasziniert, wie einfach es ist, einen Text mit der […]
Was ist eigentlich Two-Way Data Binding und wie kann ich es einfach umsetzen?
Stell dir vor, du hast eine Webseite mit ein paar Eingabefeldern – sagen wir, eines für den Namen und eines für das Alter. Wenn der Benutzer dort etwas eingibt, wäre es doch genial, wenn die Änderungen direkt in deinem Datenmodell gespeichert werden und umgekehrt! Willkommen in der Welt des Two-Way Data Bindings. Doch bevor wir […]
Facetrap.net
Ich möchte kurz mein neues Side-Projekt vorstellen: Mit www.facetrap.net kann man sein Smartphone (oder anderes Gerät) mit Chrome und einer Webcam als einfache Photofalle aufstellen, die Gesichter erkennt. So öffnet man die Seite (oder installiert die Web-App), stellt sein Handy irgendwo hin und wenn sich Personen nähern werden Beweisphotos geschossen. Wenn man dann wieder zum […]
Untertitel für Videos in sozialen Netzwerken erstellen
In der Welt der digitalen Medien spielen Untertitel eine entscheidende Rolle für die Barrierefreiheit. Sie ermöglichen es Menschen mit Hörbehinderungen, Videos und Multimedia-Inhalte zu konsumieren und unterstützen zudem das Verständnis in lauten Umgebungen oder bei Sprachbarrieren – oder wenn man einfach nicht dauernd den Ton anschalten will. Hier kommen die § Zeichen Das ist nicht […]
Web Scraping mit FreshRSS
FreshRSS ist ursprünglich ein RSS Aggregator zum selber hosten. Das Tool ist ziemlich cool – das schon mal vorweg. Aber es hat auch eine noch coolere Funktion: Man kann sich einen RSS-Feed irgendeiner Webseite erstellen, die gar keinen RSS Feed hat oder aber auch von Inhalten einer Webseite, die gar nicht per RSS angeboten werden. […]
Bookmarklets auf mobilen Browsern
Was ist ein Bookmarklet?Ein Bookmarklet ist ein kleines JavaScript-Programm, das im Browser als Lesezeichen gespeichert wird. Ein Klick darauf führt eine bestimmte Aktion auf der aktuellen Webseite aus. Zum Beispiel hat Hacker News ein Bookmarklet um die aktive Seite einfach zu übermitteln. Auf einem Desktop-Browser funktioniert die Installation und das Verwenden sehr einfach, doch wie […]
Holy grail Layout mit CSS Grid
Das Holy Grail Layout ist ein klassisches Webdesign-Layout, das aus fünf Hauptbereichen besteht: einem Header, einem Footer, einer Hauptinhaltsfläche und zwei Seitenleisten. Der Hauptinhalt ist in der Mitte, flankiert von den Seitenleisten, während Header und Footer sich über die gesamte Breite des Layouts erstrecken. Mit modernem CSS, insbesondere mit Flexbox und CSS Grid, ist es […]
Prüfen von toten Links mit einem eigenen Crawler in PHP
Suchmaschinenoptimierung (SEO) ist für viele Unternehmen und Webseitenbetreiber ein wichtiger Bestandteil des Online-Marketings. Ein wichtiger Faktor für eine gute Platzierung in den Suchergebnissen ist die Qualität der Links auf der eigenen Webseite. Dazu gehört auch die Prüfung auf tote Links, da diese negativ für das Ranking und die Nutzererfahrung wirken können. Die Klasse WebCrawler bietet […]
Kanboard.org
Heute stelle ich ein Tool zum agilen Projektmanagement vor: kanboard.org. Dabei handelt es sich um ein Kanboard Planungswerkzeug ähnlich Trello. Das tolle daran: Einziger Wehmutstropen: Auf GitHub wird das Projekt als “featue complete” bezeichnet und einige Plugins werden nicht aktiv weiterentwickelt. Wenn man aber In GitHub die Änderungszeiten und Releases ansieht wird hier noch ordentlich […]