2. Aufbau und Funktionen im Expression Web 4
Um sich besser in Expression Web zurecht zu finden, gibt es hier ein paar Infos zum Aufbau und einigen Funktionen.
Bei Expression Web handelt es sich um einen WYSIWYG Editor, der
auch eine Code Ansicht besitzt, so dass man auch wie mit einem
normalen HTML Editor arbeiten kann. Dafür gibt es Links unten die
Möglichkeit zwischen dem WYSIWYG Editor (Entwurf) und
dem HTML Editor (Code) und einem Doppelfenster mit
beiden (Teilen) per Mausklick umzuschalten.
Prüfung der Kompatibilität und Darstellung von Webseiten
Da die Kompatibilität des HTML und CSS Code
wichtig ist, liefert Expression Web einen 100 % kompatiblen Code aus.
Sollte es Fehler geben, werden diese auch angezeigt. Die geschieht
unten rechts mit verschiedenen Angaben.
Die ersten 2 Symbole zeigen an, ob alles kompatibel ist, in diesem
Fall ist alles in Ordnung. Dann wird der Webstandard angezeigt, der
angewendet wird. Der nächste Punkt ist die Größe der Webseite, die ist
wichtig wegen der Ladegeschwindigkeit einer Webseite. Mit dem weit
verbreiteten DSL ist sie nicht mehr so wichtig wie frühe, aber auch
heute gilt es noch darauf zu achten, dass die Webseiten nicht zu groß
werden (Stichwort Mobile Geräte). Danach kommen verschiedene Hilfen
und CSS Einstellungen. Zuletzt die aktuelle Auflösung, wie wir die
Webseite gerade dargestellt bekommen. Verkleinern wir das Fenster,
wird auch das Seitenformat in Pixel kleiner, so dass wir sehen können
wie es im Monitor bei kleineren Auflösungen aussieht. Auch durch
direktes klicken auf das Seitenformat, können wir bereits vorgegebene
Größen auswählen zum testen, oder eigene Seitenformate festlegen.
Eine andere Möglichkeit zur Vorschau gibt es unter Datei -->
Browservorschau, die auch über das Symbol
in der Symbolleiste aufgerufen werden kann. Hier können wir die
Webseite in verschiedenen Browsern testen, ob die Darstellung der
Webseite überall gleich aussieht. Besonders früher gab es da große
Probleme, da der Webstandard nicht richtig umgesetzt wurde. So
kapierte der Firefox so einige Dinge nicht und die Website Entwickler
passten den Code dem Firefox an, damit Besucher des häufig genutzten
Browsers die Seite richtig darstellen kann. Diese nicht nach dem
Webstandard kompatiblen Änderungen führten aber dazu, dass andere
Browser die sich strickt an den Webstandard halten, Probleme mit der
Darstellung bekommen. Dies war ein Problem meines Lieblingsbrowsers
Opera, den ich seit 2002 nutzte. Da schimpfte man dann auf den
falschen, wenn eine Webseite Probleme machte. Nicht Opera war dann
schuld, da ja immer zu 100 % nach dem Webstandard arbeitete, sondern
die Website Bastler, die gegen den Webstandard arbeiteten um im
verpfuschten Firefox die Webseiten richtig angezeigt zu bekommen. Seit
Opera auf den Chromium Kern umgestiegen ist, wie es der Google Chrome
nutzt, ist es vorbei mit dem Ärger, aber auch Opera ist nicht mehr
überragend im Vergleich zu den anderen Browsern.
Auch der Internet Explorer ist so ein Kandidat für eigenwillige
Darstellung von Webseiten.
Es ist immer wichtig, dass man als Website Ersteller die Kompatibilität beachtet und die Darstellung der Webseiten in verschiedenen Browsern überprüft.
Nützliche und wichtige Tastenkombinationen
Um leichter und schneller mit Expression Web arbeiten zu können, sollte bzw. muss man auf Tastenkombinationen zurück greifen.
Aktualisieren: Dafür gibt es die Taste F5. In der Ordnerliste von Expression Web werden die neu angelegten Ordner nicht angezeigt. Um die neuen Dateien sehen zu können, ist es nötig zu aktualisieren, d.h. den Inhalt neu zu laden um Veränderungen anzeigen zu können.
Hyperlink: Mit Strg + K kann einem markiertem schnell Text ein Hyperlink hinzugefügt werden
Miniaturansicht: Mit der Tastenkombination Strg + T kann aus einem großen eingefügten Bild eine Miniaturansicht erstellt werden
Neue Zeile: Eine ganz wichtige Tastenkombination ist
die Umschalttaste, bzw. Shift-Taste
+ Enter, bzw. Eingabetaste
.
In Expression Web, sowie auch Dreamweaver ist es so eingestellt, dass
mit der Enter-Taste immer ein neuer Absatz beginnt. Das heißt, dass
immer eine Zeile frei bleibt. Wenn eine neue Zeile beginnen soll, dann
soll es automatisch passieren, weil man am rechten Rand anstößt. Der
Grund ist einfach der, dass je nach Breite des Fensters in der eine
Webseite angeschaut wird, der Text an einer anderen Stelle in die
nächste Linie verschoben wird. Nutzt man eine neue Zeile, kann sich
der Text ungünstig verhalten und z.B. mitten im Satz in der neuen
Zeile weiter gehen. Mit Shift + Enter kommt man in eine neue Zeile
ohne extra Absatz. Das kann z.B. gut sein um bestimmte Sätze zu
betonen, oder das Erscheinungsbild zu verbessern. Man sollte aber
darauf achten, dass keine ungünstigen Effekte entstehen.
Rechtschreibprüfung: Mit der Taste F7 lässt sich die Rechtschreibprüfung starten. Nötig ist das, wenn man in den Einstellungen die Rechtschreibprüfung bei der Eingabe des Textes abgestellt hat, aus welchen Gründen auch immer.
Rückgängig machen: Mit Strg + Z kann die letzte Aktion rückgängig gemacht werden. Mit Strg + Y wieder wiederrufen. Mit mehreren malen Strg + Z kommt man immer weiter zurück und immer weiter zurück liegende Änderungen rückgängig machen
Suchen: Mit Strg + F kann die aktuelle Webseite oder alle Seiten durchsucht werden. Suche im Text und Code möglich
Umschalten Webseiten: Um schnell zwischen
geöffneten Webseiten umzuschalten, genügt es wenn man mit Strg +
Tab (Tabulator Taste)
umschaltet.
Vorschau Webseite: Mit F12 (oder Strg + Shift + B) kann man die Webseite im Standardbrowser, den man eingestellt hat, ansehen
Webseite öffnen + schließen: Mit Strg + O kann schnell eine Webseite geöffnet werden. Mit Strg + F4 oder Strg + W wird die Webseite geschlossen.
Webseite speichern: Dafür gibt es Strg + S. Es sollte darauf geachtet werden, das man ständig seine Webseiten abspeichert, damit keine Daten verloren gehen, z.B. bei Stromausfall, oder weil er PC, bzw. das Programm Expression Web abstürzt.
Weiter mit: 3. Anleitung zur
Verwendung einer dynamischen Webvorlage