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.

W3Clove

w3c-love-icon

Die Markup-Validierung gehört zu den absoluten Standard-Aufgaben bei der formellen Überprüfung einer Website. Sei es nun bei der Fertigstellung eines neuen Webprodukts, bei einer Aktualisierungen oder einfach aus Interesse - validiert wird ständig. Lästig ist allerdings, dass in den gängigen W3C-Validatoren jede URL einzeln überprüft werden muss. Bei umfangreichen oder gar dynamischen Projekten wie Blogs kann der Vorgang daher sehr zeitaufwändig werden. W3Clove überprüft alle Unterseiten einer Website mit nur einem Klick.

Beitrag zu Ende lesen

HTML-Elemente per JavaScript (jQuery) ersetzen

jquery-logo-icon

Mit diesem Beitrag möchte ich ein Code-Snippet archivieren das es euch ermöglicht, Website-Inhalte per jQuery durch andere Inhalte zu ersetzen. Hierbei nutze ich drei verschiedene jQuery-Funktionen, die sich je nach Anforderung mehr oder weniger gut anbieten. Habt bitte immer im Hinterkopf, dass Google es grundsätzlich nicht gerne sieht, wenn ihr dem User andere Inhalte anbietet als dem Googlebot; Stichwort Cloaking. Ihr solltet beim Content-Replacement also immer genau prüfen, was der User und was Google sieht.

Beitrag zu Ende lesen

Theme Options Page für WordPress erstellen

wordpress-theme-options-page

Komplexe und hochwertige WordPress-Themes verfügen in der Regel über eine so genannte "Theme Options Page" - eine zusätzliche Seite im Dashboard anhand der ein Benutzer das Theme über die normalen Möglichkeiten hinaus anpassen kann. Das TwentyEleven-Theme von WordPress wird beispielsweise mit einer solchen Options-Page ausgeliefert. Hier könnt ihr u.a. auswählen ob das Theme schwarz oder weiß sein soll, in welcher Farbe Verlinkungen auf der Website dargestellt werden und ob ihr eine Sidebar anzeigen möchtet.
In diesem Beitrag möchte ich euch zeigen wie ihr selbst eine Theme-Options-Page erstellt. Anhand eines leicht verständlichen Beispiels werdet ihr das Prinzip sicher schnell auf eure eigenen Projekte übertragen können.

Beitrag zu Ende lesen

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