think.Contao! – das Buch.

Mit Contao Webseiten erfolgreich gestalten:Konzeption, Umsetzung, Beispielprojekte

Der Verlag Addison-Wesley schreibt zu diesem Buch:

„In diesem Buch führt Sie Diplom-Designer und Contao-Profi Thomas Weitzel durch alle Schritte des Entwurfs und Designs einer Contao-basierten Website. Sie lernen zunächst Techniken und Tools für Planung und Entwicklung kennen, arbeiten sich in Contaos CSS-Framework ein und erfahren dann anhand zweier Praxisprojekte detailliert, wie Sie eine Website von A bis Z mit Contao gestalten. Checklisten und Tipps & Tricks leisten wertvolle Hilfe bei der erfolgreichen Veröffentlichung der Website.“

Sondereinband: 272 Seiten
Verlag: Addison-Wesley, München
Auflage: 1
Sprache: Deutsch
ISBN-10: 3827328926
ISBN-13: 978-3827328922

Inhaltsverzeichnis.pdf (1,8 MB)

Leseprobe.pdf (2,2 MB)

Inhalte

Konzeption und Planung der Website

Grundüberlegungen
Definition Zielgruppe
Skizzen
Mockups / Screendesign

Was sind Wireframes?
Welches Ziel haben Wireframes?
Übersicht der Techniken
Skizze
Karten
digitale Vorlagen
Praktische Anwendung
Beispiele
Schlussfolgerungen
Webseiten Links

Hilfstools bei der Webentwicklung

Web Developers Toolbar
Firebug für Firefox Browser
CacheStatus
Quick Locale Switcher
Palette Grabber
MeasureIt
HTML Validator
GridFox
960 Gridder
Fireshot
Copy Plain Text
ColorZilla
HTML Help

Themes - Organisation in Contao

der Theme-Manager (Funktion, Organisation, Im- und Export eines Theme)

Das CSS-Framework von Contao

Bearbeiten von CSS-Dokumenten
Über den integrierten CSS-Editor im Contao-Backend
Externe CSS-Dokumente in Contao integrieren
Externe CSS-Dateien in die Seitenvorlage einbinden
Kombination aus der Erweiterung CSSEditor und Firebug

Navigationen in Contao erstellen

Das Modul Navigationsmenü
Anwendungsbeispiele für Navigationen
Beispiel für eine horizontale Navigation (1 Ebene)
Beispiel für eine vertikale Navigation (1 Ebene)
Beispiel für eine Kombination von horizontaler und vertikaler Navigation

Menü mit Grafiken (Spritegrafiken)

Definition einer Spritegrafik je Menüpunkt
Definition einer Spritegrafik für ein komplettes Menü
Beispiel für eine Navigation mit einer Spritegrafik

Unterschiedliche Bilder je Seitenstruktur anzeigen

Definition einer body-class
Beispiel für die Anzeige von Headerbildern
Beschreibung
Codebeispiele

Aufbau einer Website mit Contao

Aufbau der Seitenstruktur
Seitenlayout anlegen
Zuweisung des Seitenlayouts der Seitenstruktur
Erstellen der CSS-Dateien
Einbinden der CSS-Dateien ins Seitenlayout
Erstellen von Modulen
Modul für die Hauptnavigation anlegen
Modul für die Unternavigation anlegen
Modul für Zufallsbilder erstellen
Einbinden von Modulen in das Seitenlayout
Erstellen eines Moduls für die Fußzeile
Anlegen von Artikeln
Einfügen von Inhaltselementen in die Artikel
Seite Portfolio mit Inhalten füllen
Inhaltselemente werden nebeneinander positioniert
Bildgalerie für einzelne Portfolioseiten einrichten
Vorbereitungen Verzeichnisse / Verzeichnisstruktur
Vorbereitung der Bilder
Anpassungen der Grafiken und Texte des MooTools-Skriptes Mediabox
Visuelles Feintuning der Bildergalerie
Schlagschatten den Vorschaubildern hinzufügen
Meta-Datei für Bildergalerie verwenden
Ein Kontaktformular erstellen
Erweitern der Formularfunktionen
Reflexionen
Besonderheiten der Fotografen-Website
Transparente PNG-Grafiken auch im Internet Explorer 6
Dynamische Schriftersetzung durch Image Replacement-Technik erstellen
Einbinden der Image Replacement-Technik Cufón in Contao
Stapellauf oder: Das wäre auch noch schön…
Die Erweiterung Slideshow2 in Contao verwenden
Ein Blick auf die CSS-Definitionen

Arbeiten mit Rastern (Grids)

Aufbau und Konzept des Rastersystems
Seitenstruktur anlegen
Module für die Website erstellen
Einrichten des Moduls Zufallsbild
Modul für die Kopfzeile erstellen
Modul für die Fußzeile erstellen
Anlegen eines Nachrichtenarchivs
Anlegen des Moduls Nachrichtenliste
Anlegen des Moduls Nachrichtenleser
Anpassungen der Nachrichtentemplates
Aufbau des Seitenlayouts
Grid-Stylesheets importieren
CSS-Grid anwenden
Mehrere Inhaltselemente in einer Spalte anordnen

Suchmaschinenoptimierung

Suchmaschinenrelevante Einstellungen
Seitentitel und Beschreibung der Seite
Schlüsselworte vergeben
Auszeichnungen überprüfen
URLs umschreiben
Erzeugen einer Sitemap in Contao
Anmelden der Sitemap bei Google
Empfehlungen von Erweiterungen
Die Erweiterung Keywords
Die Erweiterung Google Sitemap
Webstatistiken
Verwendung von Google Analytics in Contao
Verwenden von Piwik in Contao

Veröffentlichen 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
E-Mail-Adressen im Backend kontrollieren
Testen der Webseiten mit den gängigsten Browsern
Workflow zum Abschluss eines Projekts
Code-Snippets Sammlung

Tricks & Tipps zu Contao

Einzelne Sprachlabels anpassen
Weiterlesen-Link verändern
Sprachabhängige Bezeichnungen definieren
Einzelne DCA-Werte anpassen
HTML-Tags in 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

Anpassungen & Konfiguration der Mediabox

Bildergalerien in der Mediabox
Audio in der Mediabox
Video in der Mediabox
Flash in der Mediabox
Konfigurationsbeispiele

CD-ROM-Inhalte

Folgende Inhalte sind auf der CD-ROM enthalten:

Ordner "Linksammlung"
Ordner "Template-Anpassungen"
Ordner "Website-Templates" (3 Website-Templates)
alle 3 Website-Designs als Themes verfügbar
PDF "Contao-Grid-Raster"
Photoshop-Ebenendatei "Schlagschatten.psd"