Informationen zum Template ================================ Hallo lieber Expression-Nutzer hier sehen Sie ein neues Template für Expression Web 2. In den folgenden Absätzen können Sie einige Informationen rund um das Template erfahren. Ich wünsche Ihnen viel Spaß beim Lesen. 1. Features des Templates ----------------------- Als erstes wenden wir uns den Features dieses Templates zu. Dadurch machen Sie sich nicht nur mit den Funktionen bekannt sondern erfahren auch wei Sie einzelne Funktionen anpassen können. 1.1 Die Einheit em im Einsatz ----------------------- Das Template benutzt für die Schriftgrößen, die Einheit em. Diese Einheit ist relativ zu den Einstellungen des Benutzers und dadurch sind auch ältere Browser (z. B. Internet Explorer 6) in der Lage, ohne das man die Standard-Einstellungen ändert, die Schriftgrößen ändern zu können. 1.2 Lightbox-Effekt ----------------------- Darüberhinaus ist für die Bilder ein Lightbox-Effekt eingebaut und zwar die FancyBox. Sie müssen die anklickbaren Vorschaubilder lediglich innerhalb eines Blockelements (z. B. div, p oder ul) unterbringen und diesem Blockelement ein Klasen-Attribut mit dem Wert fotogalerie zuweisen. Hier ein Beispiel:

Alternativer Text

…
Wenn Sie die Bilder auf dieser Art innerhalb eines solchen Box-Elements einbauen, dann bekommen alle Bilder den Lightbox-Effekt zugeweisen. Der Inhalt des title-Attributs dient dann als Bildunterschrift. Das Skript erkennt ob mehrere Bilder innerhalb einer Box eingebunden sind und bindet eine einfache Galeriefunktion ein und man hat die Möglichkeit mittels Pfeil-Tasten oder in dem man die Pfeile anklickt, zwischen den einzelen Bildern zu navigieren. 1.3 CSS-Datei für die Druckausgabe ----------------------- Das Template besitzt auch eine CSS-Datei (print.css) für die Druckausgabe: media="screen". Durch das Attribut media und den Wert print, erkennt der Browser das es sich hierbei um CSS-Datei für die Druckausgabe handelt und lädt diese beim Drucken oder bei der Druckvorschau. 1.4. Der Umgang mit Bildern ----------------------- Möchten Sie ein Bild links bzw rechst ausrichten, dann weisen Sie dem Bild class="bild-links" bzw. class="bild-rechts" zu. Wenn Sie mehrere Bilder in einer Galerie zusammenfassen möchten, dann weisen Sie dem umschließenden Block-Element einen zusätzlichen klassenwert zu: class="fotogalerie bild-abstand". Dadurch erhalten die Bilder zusätzlichen Abstand, was die visuellen Erscheinung verbessert. Rechtliche Aspekte Dieses Template wurde in Auftrag von Microsoft Deutschland realisiert. Die grafische Vorlage stammt von Christina Poser (von-poser.com). Die Umsetzung des Templates – (X)HTML und CSS – wurde von Vladimir Simovic (www.perun.net) durchgeführt. Sie können dieses Template auch für Ihre kommerzielle Projekte einsetzen und an Ihre Bedürfnisse anpassen.