CSS

Gulp vs. Grunt – so unterscheiden sich die Task-Runner

Ein wesentlicher Aspekt der Webentwicklung ist das Schreiben von neuem Code. Insbesondere als Frontend-Developer hat man diesbezüglich eine Menge zu tun – denn die Internetpräsenz soll sich in erster Linie durch Individualität auszeichnen und das Projekt optimal repräsentieren. Der Entwicklungsprozess hält aber nicht nur kreative Aufgaben bereit, sondern auch immer wiederkehrende Schritte. Diese lassen sich Task-Runnern wie Gulp oder Grunt automatisieren. [...] Weiter 

Was ist ein Static-Site-Generator?

Wer heutzutage eine Website erstellen möchte, kann dazu auf verschiedenste Hilfsmittel zurückgreifen. Besonders beliebt sind Baukästen und Content-Management-Systeme, die es ermöglichen, alle wichtigen Funktionen zu implementieren, ohne dass der Nutzer dafür über großartige HTML-Kenntnisse verfügen muss. Häufig sind diese Anwendungen allerdings viel zu umfangreich und ressourcenlastig, weshalb sogenannte Static-Site-Generatoren bei der Entwicklung kleinerer Seiten eine immer größere Rolle spielen. [...] Weiter 

Parallax Websites: Scrolling-Effekte mit Tiefenwirkung

Die Netzgemeinde liebt Abwechslung – nicht nur in Bezug auf Inhalte, sondern auch hinsichtlich der Gestaltung von Internetseiten. Webdesigner und Softwareentwickler sind daher stets bemüht, mit kreativen Ideen hervorzustechen und Webseitenbesucher mit neuen Nutzer-Erfahrungen zu überraschen. Einer dieser innovativen Gestaltungsansätze ist das sogenannte Parallax-Scrolling, das sich wahrnehmungspsychologische Effekte zunutze macht, um räumliche Tiefe zu vermitteln. Wie das in der Praxis aussieht und welche Web-Techniken dahinter stecken, erfahren Sie in unserem Artikel zum Thema Parallax-Scrolling-Websites. [...] Weiter 

YAML: Das schlanke CSS-Framework für Experten

Wenn Sie eine neue Webanwendung entwickeln wollen, stehen Sie vor der Wahl, den Code komplett neu zu schreiben oder alternativ auf Frameworks zurückzugreifen. Diese Code-Sammlungen enthalten ein anwendungsbereites Gerüst, das Sie in der Folge an die eigenen Vorstellungen anpassen können. Das CSS-Framework YAML stellt Ihnen beispielsweise eine responsive Rahmenstruktur zur Verfügung, die bereits für verschiedene Browser und Geräte optimiert ist. [...] Weiter 

CSS-Lernen leicht gemacht

Ohne CSS wären Webseiten nur eine Ansammlung von Textelementen, die durch Überschriften und Absätze grob in Abschnitte unterteilt sind. Erst die Möglichkeit, HTML durch Cascading Style Sheets zu formatieren, macht das World Wide Web zu dem, was es heute ist: ein bunter Mix individuell gestalteter Online-Auftritte, von der ambitionierten Hobby-Homepage bis hin zur preisgekrönten Design-Website. Unser CSS-Tutorial führt Sie anhand detaillierter Beispiele in die Geheimnisse der Stylesheet-Sprache ein. Legen Sie mit uns den Grundstein für Ihr individuelles Webdesign. [...] Weiter 

HTML lernen: Das große Einsteiger-Tutorial

In Zeiten von Content-Management-Systemen und Homepage-Baukästen entsteht schnell der Eindruck, dass es reine Zeitverschwendung sei, HTML zu lernen. Doch spätestens, wenn eine Seite aus unerkenntlichen Gründen nicht mehr funktioniert oder wenn dynamische Elemente eingebaut werden sollen, kommen Sie ohne Kenntnisse in der Websprache nicht mehr weiter. In unserem ausführlichen HTML-Tutorial stellen wir Ihnen aus diesem Grund die elementaren Eigenschaften der Auszeichnungssprache inklusive zahlreicher Codebeispiele vor. [...] Weiter 

Website optimieren: Tipps und Tricks für mehr Speed

Unter den verschiedenen Aspekten bei der Erstellung und Pflege einer Website kommt einer häufig zu kurz: die Funktionalität der Webpräsenz. Trotz Responsive Webdesign ist die Ladezeit diverser Webangebote viel zu hoch, und das obwohl diese ein entscheidendes Kriterium für das Verhalten der Besucher darstellt. Unser Ratgeber zeigt Ihnen, was Sie tun können, um die Performance Ihrer Website zu optimieren. [...] Weiter 

Responsive Webdesign und Schrift - Teil 3: CSS-Befehle

Im Responsive Webdesign ist die Typografie ein häufig vernachlässigtes Feld, obwohl die Gestaltung einer anpassungsfähigen Schrift kein Expertengeheimnis ist. Wie lässt sich diese realisieren? Und welche Webfonts taugen für ein responsives Schriftbild? Wir geben Ihnen einen Einblick in die technische Umsetzung reaktionsfähiger Webtypografie und wie Sie diese über CSS in Ihren Webauftritt einbetten. [...] Weiter 

Eine Bildergalerie für Ihre Homepage erstellen

Das Internet lebt von multimedialen Inhalten. Egal, ob Bilder, GIFs oder Videos – ohne visuelle Reize wären viele Websites nur eine graue Textwüste und Onlineshops reine Aufzählungen von Produktinformationen. Ein Klassiker, um seinen Website-Besuchern Grafiken und Bilder übersichtlich zu präsentieren, ist die Bildergalerie. Über HTML ist eine einfache Galerie mithilfe von Lightbox problemlos implementiert. Arbeiten Sie mit einem Content-Management-System, stehen Ihnen hingegen zahlreiche Plug-ins und Extensions zur überzeugenden Bildpräsentation zu Verfügung. [...] Weiter 

CSS-Tricks, die Sie unbedingt kennen sollten

Die Stylesheet-Sprache CSS ist eines der wichtigsten Werkzeuge der modernen Webentwicklung. Sie macht es möglich, Inhalt und Layout einer Website voneinander zu trennen, und wird beständig vom World Wide Web Consortium (W3C) weiterentwickelt. CSS-Snippets vereinfachen die Gestaltung von Webseiten erheblich und können sogar Funktionen von Photoshop und JavaScript übernehmen. Wir verraten einige nützliche CSS-Tricks. [...] Weiter