Anleitungen und Videos zu HTML5, CSS, Webdesign & Co.
Webdesign
Wie baut man Webseiten? Welche Software brauche ich? Was ist wichtig beim Webdesign? Wie nutzt man HTML und CSS? Und wie funktioniert Responsive Webdesign? Anleitungen rund um das wunderbare Thema Webdesign.
HTML-Grundlagen
- Was ist HTML, CSS und Javascript?
- Grundgerüst einer HTML-Webseite
- Der Link: Texte und Bilder verlinken
- Bilder einfügen mit img
- Überschriften mit <h1>, <h2>, <h3>,…
- <ul> und <ol>: Inhalte sortieren mit Listen
- Fettschrift mit <strong> und Kursivschrift mit <em>
- HTML: Relative und Absolute Links
- Moderne Webseiten: Zusammenspiel von HTML, CSS & Javascript
- HTML: Semantik-Elemente
- Impressum erstellen für Deine Website
- HTML & CSS Style Guide für übersichtlichen Code
- So schaust Du Dir den Quellcode einer Webseite an
- Einfaches Raster mit dem CSS Grid
- HTML & CSS Kommentare
CSS-Grundlagen
Bilder, Formate, Bildbearbeitung
- Bilder – Dateiformate für das Webdesign
- Das JPG-Bildformat
- Das PNG-Bildformat
- Das GIF-Bildformat
- Das SVG-Bildformat
- Base64-Bilder: Konvertieren und Einbauen
- Tonwertkorrekur: Einfach, aber wirkungsvoll
- Bilder zurechtschneiden
- Drittel-Regel: Hilfe für die Bildgestaltung
- Bilder einfügen mit img
- Schnelle Bilder: Bilder optimal komprimieren
- Farben finden, erstellen, nutzen
- Fotos: Kostenloses Bildmaterial
- 5 Tipps für die Videobearbeitung
- Kostenlose SVG-Grafiken für Social Media, Flaggen und mehr
- Muster, Hintergrundmuster, Pattern, Kacheln
Software für Webdesigner
Webdesign Specials
- Die Magie der .htaccess-Datei
- So planst Du Dein Website-Projekt
- Eine Website mit Jekyll erstellen – MegaTutorial Leitfaden
- So produzierst Du Deinen eigenen Podcast
- So fügst Du Favicon, Apple Icon und andere Icons Deiner Webseite hinzu
- Placekitten bietet Katzenbilder als Platzhalter für Webdesigns
- Perfekte 404-Fehlerseiten erstellen
- Hilfreiche Links für Webdesigner
- Durchstarten mit Gulp.js – Websites optimieren, Arbeitsabläufe automatisieren
- OPML – Was ist das?
- Google Fonts
- Icon Fonts
Anhang/Sonstiges Webdesign
Hugo – Static Website Generator
HTML – Code-Bausteine
Für die Entwicklung von HTML-WebseitenWebsites benötige ich die folgenden Code-Schnipsel immer wieder. Auflistung aller Code-Schnipsel