Ziele dieses Buches 2 Was können Sie von diesem Buch erwarten? 3 Und nach dem Buch? 5

Transkript

1

2 Inhaltsverzeichnis Einleitung 1 Ziele dieses Buches 2 Was können Sie von diesem Buch erwarten? 3 Und nach dem Buch? 5 Über mich 7 Kapitel 1 Konzeption und Planung der Website Grundüberlegungen Anforderungen an eine Website Umfang einer Website Zielgruppen Prozess Prozessablauf Entscheidungskompetenzen Methoden der Konzeption und Planung Skizzen Moodboards Wireframes Was sind Wireframes? Welche Ziele haben Wireframes? Skizzen Karten/Haftetiketten Digitale Vorlagen Programme & Websites für die Erstellung von Wireframes Mockingbird Balsamiq Pencil Schlussfolgerungen 25 Kapitel 2 Hilfstools bei der Webentwicklung Web Developers Toolbar Firebug für Firefox-Browser Seitenelemente untersuchen CSS-Definitionen in Echtzeit bearbeiten Ladezeiten ermitteln und optimieren 34

3 IV I n h a l t s v e r z e i c h n i s 2.3 Weitere nützliche Helfer CacheStatus Quick Locale Switcher Palette Grabber MeasureIt HTML Validator GridFox Gridder Fireshot Copy Plain Text ColorZilla HTML Help 39 Kapitel 3 Themes Organisation in Contao Theme-Manager Theme-Einstellungen Exportieren und Importieren eines Theme Export eines Theme Import eines Theme Stylesheet für WYSIWYG-Editor TinyMCE Social Networks Twitter und Facebook Bedienung durch Rechtsklick (Parent View) 49 Kapitel 4 Das CSS-Framework von Contao CSS-Dokumente bearbeiten Über den integrierten CSS-Editor im Contao-Backend Externe CSS-Dokumente in Contao integrieren Externe CSS-Dateien in die Seitenvorlage einbinden Kombination der Erweiterung CssEditor und Firebug 57 Kapitel 5 Navigationen in Contao erstellen Das Modul Navigationsmenü Anwendungsbeispiele für Navigationen Beispiel für eine horizontale Navigation (eine Ebene) Beispiel für eine vertikale Navigation (eine Ebene) Beispiel für eine Kombination von horizontaler und vertikaler Navigation 74

4 I n h a l t s v e r z e i c h n i s V Kapitel 6 Menüs mit Spritegrafiken erstellen Vorarbeiten Erstellen der Menügrafiken Ein Bild pro Menüpunkt Übersicht der Seitenstruktur CSS-Definitionen Ein Bild für alle Menüpunkte CSS-Definitionen 87 Kapitel 7 Unterschiedliche Headerbilder pro Seite anzeigen Mit CSS-Definitionen Mit Insert-Tags 94 Kapitel 8 Aufbau einer Website mit Contao Schritt-für-Schritt-Umsetzung der Website Aufbau der Seitenstruktur Seitenlayout anlegen Seitenlayouts der Seitenstruktur zuweisen Erstellen der CSS-Dateien CSS-Dateien ins Seitenlayout einbinden Module erstellen Modul für die Hauptnavigation anlegen Modul für die Unternavigation anlegen Modul für Zufallsbilder erstellen Module in das Seitenlayout einbinden Ein Modul für die Fußzeile erstellen Artikel anlegen Inhaltselemente in die Artikel einfügen Seite Portfolio mit Inhalten füllen Inhaltselemente werden nebeneinander positioniert Bildgalerie für einzelne Portfolioseiten einrichten Verzeichnisse/Verzeichnisstruktur vorbereiten Bilder vorbereiten Grafiken und Texte des MooTools-Skriptes Mediabox anpassen Visuelles Feintuning der Bildergalerie Schlagschatten den Vorschaubildern hinzufügen Meta-Datei für Bildergalerie verwenden Ein Kontaktformular erstellen Formularfunktionen erweitern Reflexionen Besonderheiten der Fotografen-Website Transparente PNG-Grafiken auch im Internet Explorer 6 164

5 VI I n h a l t s v e r z e i c h n i s Dynamische Schriftersetzung durch Image Replacement-Technik erstellen Image Replacement-Technik Cufón in Contao einbinden Stapellauf oder: Das wäre auch noch schön Die Erweiterung Slideshow2 in Contao verwenden Ein Blick auf die CSS-Definitionen 176 Kapitel 9 Arbeiten mit Rastern (Grids) Aufbau und Konzept des Rastersystems Seitenstruktur anlegen Module für die Website erstellen Das Modul Zufallsbild einrichten Modul für die Kopfzeile erstellen Modul für die Fußzeile erstellen Anlegen eines Nachrichtenarchivs Das Modul Nachrichtenliste anlegen Das Modul Nachrichtenleser anlegen Nachrichtentemplates anpassen Aufbau des Seitenlayouts Grid-Stylesheets importieren CSS-Grid anwenden Mehrere Inhaltselemente in einer Spalte anordnen 209 Kapitel 10 Suchmaschinen optimierung Suchmaschinenrelevante Einstellungen Seitentitel und Beschreibung der Seite Schlüsselworte vergeben Auszeichnungen überprüfen URLs umschreiben Eine Sitemap in Contao erzeugen Die Sitemap bei Google anmelden Empfohlene Erweiterungen Die Erweiterung Keywords Die Erweiterung Google Sitemap Webstatistiken Google Analytics in Contao verwenden Piwik in Contao verwenden 223

6 I n h a l t s v e r z e i c h n i s VII Kapitel 11 Veröffentlichung einer Website Checkliste Contao in einem Unterverzeichnis Anpassung in den Einstellungen und der.htaccess-datei Suchmaschinenrelevante Einträge vorgenommen? Seitentitel und Beschreibung der Seite Sprachen-Fallback eingerichtet? Validieren des Quellcodes und der CSS-Dateien Interne und externe Links überprüfen Adressen im Backend kontrollieren Testen der Webseiten mit den gängigsten Browsern Workflow zum Abschluss eines Projektes Code-Snippets Sammlung 233 Kapitel 12 Tipps & Tricks zu Contao Einzelne Sprachlabels anpassen Weiterlesen-Link verändern Sprachabhängige Bezeichnungen definieren Einzelne DCA-Werte anpassen HTML-Tags im Seitentitel erlauben HTML-Tags in Überschriften erlauben Felder der Mitgliederregistrierung anpassen WYSIWYG-Editor auch für Teasertexte Individuelle WYSIWYG-Editoreinstellungen Fußzeile über die gesamte Browserbreite verwenden Medien in Contao verwenden Bildgalerien Audio, Video und Links in der Mediabox 247 Stichwortverzeichnis 252