Webdesign komplett aus einer Hand

Beratung, Webdesign, Programmierung, Redaktionssysteme, redaktionelle Unterstützung, Fachartikel u. v. m

Meine neuesten Arbeiten

Arbeit 1

Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu liber.

Arbeit 2

Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu liber.

Arbeit 3

Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper.

Informationen zum Template

…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.

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 wie Sie einzelne Funktionen anpassen können.

Die Einheit em im Einsatz

Das Template benutzt sowohl für die Schriftgrößen, als auch für die Breite und Höhe die Einheit em. Diese Einheit ist relativ zu den Einstellungen des Benutzers und sobald man die Schriftgröße ändert, passt sich auch z. B. die breite der Website an.

Somit gelangen auch ältere Browser (z. B. Internet Explorer 6), die keinen vollwertigen Zoom sondern nur Schriftvergrößerung beherrschen, in den Genuss eines Zoom-Layouts.

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.

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.

Rechtliche Aspekte

Dieses Template wurde in Auftrag von Microsoft Deutschland realisiert. Sowohl die Erstellung des Designs als auch die Umsetzung des Templates wurden von Vladimir Simovic durchgeführt.

Sie können dieses Template auch für Ihre kommerzielle Projekte einsetzen und an Ihre Bedürfnisse anpassen.

Im folgenden sehen Sie ein wie ein paar gängige Elemente gestylt sind. Zuerst sehen Sie ein Zitat (

), dann folgen drei Überschriften (

,

und
) und am Ende sehen Sie eine Aufzählungsliste (
    ), eine nummerierte Liste (
      ) und einen Absatz (

      ).

      Ich bin ein Zitat: "Li Europan lingues es membres del sam familie. Lor separat existentie es un myth. Por scientie, musica, sport etc, litot Europa usa li sam vocabular."

      Eine Überschrift 3. Ordnung

      Die Überschrift dritter Ordnung dient hier als die oberste Überschrift einzelner Unterseiten, da die Überschriften erster und zweiter Ordnung für Hauptüberschrift und den Sloafn der Website "reserviert" sind.

      Eine Überschrift 4. Ordnung

      Eine Überschrift 5. Ordnung
      • Butter
      • Brot
      • Milch
      1. Gold
      2. Silber
      3. Bronze

      Ein Absatz: Li Europan lingues es membres del sam familie. Lor separat existentie es un myth. Por scientie, musica, sport etc, litot Europa usa li sam vocabular. Li Europan lingues es membres del sam familie. Lor separat existentie es un myth. Por scientie, musica, sport etc, litot Europa usa li sam vocabular.

      Der Umgang mit Bildern

      Alle Bilder in diesem Template bekommen einen weißen Hintergrund und einen hellgrauen Rahmen zugewiesen. Möchten Sie das die Bilder keinen solchen Effekt bekommen, dan weisen Sie dem Bild einen zusätzliche Klasse zu:

      …class="kein-bild-effekt" />

      Möchten Sie ein Bild links bzw rechst ausrichten, dann weisen Sie dem Bild class="bild-links" bzw. class="bild-rechts" zu.