CSS: Flex-Box

Flex-Boxen sind der aktuelle Stand der Technik bei der Umsetzung responsiver Layouts. Responsive Designs wiederum sind die einzige zeitgemäßen Designs. Grund genug also, sich mit der Technik auseinanderzusetzen, zumal der Einstieg nicht kompliziert ist. Zoe Mickley Gillenwater zeigt im folgenden Video was Flex-Boxen tun und wie sie das Leben der Entwickler vereinfachen. Zumal sich die … Read more

Flexbox Froggy

Flexboxen sind ein CSS-Layout-Konzept, das inzwischen von allen aktuellen Browsern unterstützt wird. Nur wenn noch (sehr) alte Browser wie der InternetExplorer oder älter in einem Projekt berücksichtigt werden müssen, können Flexboxen nicht ohne Fallback-Lösung verwendet werden. Höchste Zeit also, sich mit dem Thema mal auseinander zu setzen. Am besten mit Spaß am Lernen. Den bietet … Read more

DIN-A4 großes Cover mit blau-rotem Farbverlauf

Homepage erstellen mit HTML5

Die eigene Homepage ist immer noch der beste Platz für eine verlässliche Selbstdarstellung. Was für Netzwerke und Medien auch kommen und gehen, haunschild.de gibt es bereits seit knapp 20 Jahren! Nur über die eigene Homepage können Sie komplett selbst bestimmen. Wenn Sie wissen möchten, wie Sie sich Ihr eigenes zu Hause im Internet aufbauen, hilft Ihnen … Read more

DIN-A4-großes Cover mit blau-rotem Farbverlauf

Überarbeitete 2. Auflage: CSS – Cascading Style Sheets Level 3

Ihr erfolgreicher Einstieg in die Formatierungssprache CSS! Frisch überarbeitet: die zweite Auflage meines CSS3-Buches. Alle Texte sind auf den aktuellen Stand der Technik gebracht worden, den Möglichkeiten neuerer Browser-Versionen wird Rechnung getragen. Wenn Sie sich CSS3 selber beibringen möchten oder ein Nachschlage-Werk für Schule, Studium oder Beruf suchen: mit diesem von Dozenten in Universitäten und Volkshochschulen … Read more

CSS: Lernen im Web

Einen interessanten Artikel der Seite Sitepoint möchte ich allen empfehlen, die englisch verstehen. 11 Seiten, auf denen man auf zum Teil sehr unterhaltsame Weise seine CSS-Kenntnisse verbessern kann: 11 CSS learning tools and ressources

Slick – interessanter Slider

Im Moment kann man sich kaum noch in einem Social Media Network bewegen, ohne über den Slider Slick zu stolpern. Scheint im Moment ziemlich angesagt zu sein und die Anleitung ist mit Code als „Copy & Paste“-Vorlagen gespickt. Dem Einsatz in einer eigenen Website steht also nichts im Weg! Slick beeindruckt mit einer langen Feature-Liste, … Read more

w3c Logotype

Umsetzung zugänglicher Webseiten

Man sollte nicht den Eindruck erwecken, es sei wahnsinnig zeitaufwändig, zugängliche Webseiten zu erstellen. Nötig ist eigentlich vor allem ein einmaliger Lernaufwand, damit man weiß, wie es geht. Beispielsweise semantisch korrekte Auszeichnung: die Tags zur Auszeichnung einer Überschrift schreiben sich nicht langsamer als die für das Element strong. Man muss nur wissen, dass strong eben … Read more

Logos der Auszeichnungssprache HTML5 und der Formatierungssprache CSS3

Texte zeigen oder verbergen mit <details> und <summary>

(Stand: Januar 2017) Gerade auf Smartphones ist Platz kostbar. Aber auch auf dem Desktop ist es mitunter sinnvoll, Inhalte nur bei Bedarf ainzublenden. HTML5 bringt mit den Elementen details und summary alles nötige mit, um ganze Bereiche zu verstecken. Mehrfach hintereinander eingesetzt, entsteht das, was Webdesigner ein „Akkordeon“ nennen: eine Liste von Elementen, die jeweils … Read more

RWD und Retina Displays: Bilder mit hoher Qualität auf Kilobyte-Diät

Ich mag PNG. Aber seit ich mich mit responsivem Webdesign auseinandersetze, greife ich doch immer häufiger auf JPEG zurück. Natürlich kann man für alles JavaScript einsetzen. Auch um auf kleinen Bildschirmen kleine Bilder auzuliefern und große Bilder auf großen Bildschirmen. Weil ich möchte, dass möglichst viel ohne JavaScript läuft, habe ich aber immer öfter mit … Read more