HTML

HTML5 (Hypertext Markup Language) ist eine Auszeichnungssprache, mit der die Inhalte eines Dokuments strukturiert und semantisch ausgezeichnet werden. Typische Elemente sind Überschriften, Textabsätze, Links, Listen, Bilder etc. HTML5 ist eine vom W3C noch nicht fertiggestellte Weiterentwicklung von HTML 4.01 und XHTML. Die Sprache wird dennoch bereits produktiv genutzt; in diesem Zusammenhang ist von einem „offenen Standard“ die Rede. Die verschiedenen Elemente eines HTML-Dokuments werden mit CSS gestaltet.

Multimediatreff 28: Webtechnologien – HTML5, CSS3 & Co

multimediatreff-html5-css3

Am 3. Dezember 2011 findet in Köln der 28. Multimediatreff (MMT) statt. Diesmal dreht sich das Event um die neuen Webstandards HTML5 und CSS3. Insgesamt sind acht vielversprechende Vorträge von Kollegen und Experten der Szene angekündigt. Neben dem sehr fairen Ticketpreis von 49,- Euro gibt es kostenlose Verpflegung.
Ich bin übrigens selbst am 3. Dezember vor Ort und werde die Veranstaltung besuchen. Wenn ihr also Lust auf ein Treffen habt - meldet euch!

Beitrag zu Ende lesen

Flexible Videos im Responsive Webdesign

responsive-videos

Wenn Ihr eine Website mit Media Queries für mobile Endgeräte optimiert und eingebettete Videos von YouTube, Vimeo und Co. verwendet, werdet ihr recht schnell merken, dass es hier ein Problem gibt. Das Layout passt sich zwar flexibel der Breite des Displays bzw. des Monitors an, das Video reagiert auf die CSS-Angaben jedoch nicht und behält seine feste Größe. In der mobilen Version seht ihr dann entweder ein abgeschnittenes Video oder einen in die Breite gedrückten Inhaltsbereich.
Ich möchte euch zwei Lösungen zeigen die dieses Problem beheben.

Beitrag zu Ende lesen

HTML5 und CSS3 in der Praxis – welche Features lassen sich heute schon nutzen?

html5

Wenn ihr HTML5 und CSS3 in aktuellen Projekten einsetzen möchtet, stellt sich häufig folgende Frage: In welchem Browser wird Funktion X oder Eigenschaft Y denn nun eigentlich schon unterstützt? Genau das ist ein Kernproblem bei der Nutzung der modernen Techniken und führt zu einiger Verunsicherung. Damit ihr die zukünftigen Standards ohne Kompatibilitätsprobleme verwenden könnt, solltet ihr unbedingt einen Blick auf die Website "Can I Use" werfen. Über eine Suchmaske könnt ihr nach HTML5-, CSS3- und SVG-Befehlen suchen und erhaltet als Ergebnis eine detaillierte Auflistung über die jeweilige Browser-Kompatibilität. Absolute Praxisempfehlung.

Beitrag zu Ende lesen

Facebook-Problem? Like-Button auch im IE7/IE8 anzeigen

ie7-ie8-facebook-like-button

Im Internet Explorer 7 bzw. im Internet Explorer 8 kann es vorkommen, dass der Like-Button von Facebook (»gefällt mir«-Button) trotz korrekter Einbindung nicht angezeigt wird. Im Internet Explorer 9, sowie in allen anderen gängigen Browsern funktioniert hingegen alles wie gewünscht. Woran liegt das? Und warum tritt dieses Problem nicht bei allen Seiten auf?

Beitrag zu Ende lesen

Cutter.js: Textverkürzungen und “Weiterlesen”-Links per JavaScript

cutter-js-logo

Moderne Websites werden häufig mit Teaser-Bereichen bestückt die einen bestimmten Inhalt mit einigen Zeilen einleiten, und anschließend einen "Weiterlesen"-Link anzeigen über den der Besucher den ungekürzten Inhalt angezeigt bekommt. Bei Blogs sind die Kategorie- und Übersichtsseiten größtenteils nach diesem Prinzip aufgebaut. Aber auch "normale" Websites setzen zunehmend auf dieses Prinzip und realisieren beispielsweise die Startseite oder lange Seiteninhalte über Teaser.
Wer WordPress als Rückgrat einer Website einsetzt, wird eine solche Funktion wohl meistens über die functions.php steuern; für kleine Websites, Portfolios oder andere statische Seiten muss jedoch eine andere Lösung her.

Beitrag zu Ende lesen

Google+ Profilbild in die Google-Suchergebnisse integrieren

jonas-hellwig-into-google-search-ranking

Seit Google+ ins Leben gerufen wurde, integriert Google das Projekt nach und nach in alle bestehenden Dienste. Eine der neuen Integrationsmöglichkeiten ist die Verknüpfung eines Blogs (oder einer Website) sowie eines oder mehrerer Google+ Profile mit der Ergebnisliste von Google. Wenn alles richtig eingestellt wurde, erscheint in der Google-Suche das Profilbild des Autors neben dem entsprechenden Treffer in den Suchergebnissen. Das sieht dann so aus.

Beitrag zu Ende lesen

Google +1-Button lädt jetzt auch asynchron (= schneller)

plusone-buttons-google-2

Google hat ein Update des +1-Buttons bereitgestellt. In den erweiterten Optionen kann nun festgelegt werden, dass die Scripte des Buttons asynchron geladen werden. Diese Option führt dazu, dass der Google-Button schneller geladen wird und nicht wie bisher den Seitenaufbau spürbar ausbremst.

Ich habe meinen früheren Artikel zur Integration des Buttons entsprechend angepasst. Solltet ihr das Snippet verwenden, so prüft bitte euren Code.