2

Inhaltsverzeichnis

InhaltsverzeichnisMAGIX Web Designer 7 Premium erwerben und freischalten Kundendienst Was ist neu in MAGIX Web Designer 7 Premium? Web-Authoring/Web-Publishing Allgemeine Verbesserungen an Werkzeugen und in der Bedienung Weitere kleinere Verbesserungen Einfhrung Was macht Web Designer Premium so anders? Eine Webseite in sechs Schritten erstellen Weitere Informationsquellen Dokument-Eigenschaften Tooltips ber MAGIX Web Designer 7 Premium Erste Schritte Programmoberflche Objekte auf der Seite Objektbasiertes Webdesign Auswahl-Werkzeug Website Toolbar Eine Website erzeugen Vorschau Ihrer Website Vorlagen, Cliparts und Widgets verwenden Website-Farben Fotos Text Seitengre Ihre Arbeit speichern. Eine Website erzeugen Dehnbare Objekte Gruppen Wiederholte Objekte Links, Schaltflchen & Navigationsleisten Zeichenwerkzeuge Kontextmens Ebenen, Mouseover (Rollover) & Popups Buttons, Banner und andere Webgrafiken erzeugen Website verffentlichen 11 12 15 15 16 17 19 19 20 20 20 21 21 22 22 25 26 27 28 28 29 30 33 42 48 53 53 54 55 57 57 61 68 69 75 77

InhaltsverzeichnisArbeiten mit Dokumenten Start von MAGIX Web Designer 7 Premium Neues Dokument beginnen ffnen eines vorhandenen Dokuments Das MAGIX Web Designer 7 Premium-Programmfenster Mehrere Fenster ffnen Zoomwert ndern Verschieben von Dokumenten innerhalb des Fensters Seitengre ndern Mehrere Seiten im Dokument Dokumente speichern Hilfsverzeichnisse Dokument schlieen Automatische Sicherheitskopien Bildschirmraster Lineale Darstellungsqualitt Galerien Rckgngig und Wiederherstellen Arbeiten mit Objekten Das Auswahl-Werkzeug Objekte bewegen Objekte aus dem Dokument entfernen Duplizieren und Klonen Objekte nach hinten oder vorne bringen Objekte drehen Skalieren von Objekten (Grennderung) Objekte spiegeln Dehnen und Stauchen von Objekten Objekte neigen Das Verzerren-Werkzeug Automatisches Ausrichten (Snapping) Randunschrfe Hilfsobjekte und Hilfslinien bersicht der Tastaturkrzel auf dem Ziffernblock Gruppieren und Gruppen auflsen Weiche Gruppen Ausrichtung Kopieren von Styles - Attribute einfgen Objekte benennen Wiederholte Objekte Formeditor-Werkzeug Linien oder Formen zeichnen 80 80 80 81 82 86 86 88 89 89 91 92 93 93 96 97 98 100 110 111 111 114 118 118 119 120 121 123 123 124 125 129 132 133 135 135 136 137 141 142 143 148 149

3

4

InhaltsverzeichnisDas Freihand- & Pinselwerkzeug Linien/Formen mit dem Freihand & Pinsel-Werkzeug bearbeiten Das Linien- und Pfeil-Werkzeug Formeditor-Werkzeug Linien verlngern Linie abschlieen Ankerpunkt neu hinzufgen Mehrere Ankerpunkte auswhlen Ankerpunkte lschen Ankerpunkte bewegen Linien gltten Begrenzung der Linie Kurven ndern Umwandlung einer geraden Linie in eine Kurve (und umgekehrt) Linien verbinden Formen unterteilen Linienstrke ndern Linien-Galerie Arbeiten mit Formen Schlieen einer Form Formen zusammenfgen Formen kombinieren Linienstrke ndern Linien mit variabler Breite Rechtecke und Quadrate erstellen Kreise und Ellipsen erstellen Erstellen normaler Polygone (QuickShape-Werkzeug) Sterne erstellen (Polygone mit eingebeulten Seiten) Sterne bearbeiten Formen bearbeitbar machen Arbeiten mit Farben Farbleiste Anwendung von Fll- und Linienfarben per Drag & Drop Objektfarbe bearbeiten Der Farbeditor Lokale Farben und Grundfarben Grundfarbenschemata Eigene Farbschemata erstellen Neue benannte Farben erstellen Benannte Farben bearbeiten Normale Farben, Abtnungen, Schattierungen und verknpfte Farben Abtnung, Schattierung oder verknpfte Farbe herstellen Arbeiten mit Text 149 151 154 156 158 158 158 159 160 160 161 162 162 164 164 165 165 166 170 170 171 172 174 175 175 176 177 179 180 181 182 182 184 185 186 188 189 189 190 191 193 194 196

InhaltsverzeichnisEinfhrung Terminologie Das Textwerkzeug Schriftarten-Men Einfacher Text Textspalten Textbereiche Text entlang einer Kurve Text bearbeiten Rechtschreibprfung Suchen & Ersetzen Text unter Nutzung von weichen Gruppen synchronisieren Tabulatoren, Rnder und Zeileneinzge Text abweisende Objekte Verankerte Grafiken Textstile anwenden Text-Links Text innerhalb von Gruppen fr Websites Textstil kopieren Kopieren und Einfgen von formatiertem Text (RTF) Verwendete Schriftarten anzeigen Schriftarten einbetten Text-Kompatibilitt in Browsern Fll-Werkzeug Linearen Farbverlauf erstellen Fllungstypen Infoleiste Fllwerkzeug Einfarbige Fllungen Lineare Verlaufs-Fllungen Kreisfrmige Fllungen Elliptische Fllungen Kegelfrmige Fllungen Diamant-Fllungen Dreifarb-Fllungen Vierfarb-Fllungen Bitmap-Fllungen Fraktalfllungen Mehrfache Farbverlufe Die Fll-Galerie Schatten Schatten-Werkzeug Schatten erstellen Farbgebung oder Flleffekt von Schatten ndern Schatten entfernen 196 197 197 199 201 201 202 205 206 207 208 209 210 213 215 219 223 223 224 224 225 225 225 226 226 228 229 230 231 232 232 232 233 233 233 234 237 238 238 241 241 241 243 244

5

6

InhaltsverzeichnisSchatten auf mehrere Objekte legen Objekte markieren mithilfe des Schatten-Werkzeugs Schatten auf andere Objekte kopieren Transparenz Anwendung einer gleichmigen Transparenz Anwendung einer Verlaufstransparenz Mehrstufiger Transparenz-Verlauf Transparenztypen Optimieren Profil Bitmaps Anfasser/Auflsung Anwendung einer Transparenz auf mehrere Objekte Kanten Kanten-Werkzeug Kante erstellen Kante bei mehreren Objekten erstellen Kanten modifizieren Kanten entfernen Masken Maske erzeugen Mit Masken-Formen arbeiten Bearbeitungen, die die Maske verwenden Formen auf die Masken-Ebene kopieren Web-Einstellungen-Dialog Links Website Seite Bild Mouseover Platzhalter Reiter Verffentlichen Arbeiten mit Fotos Einfhrung Foto-Objekte Fotogruppen Fotos importieren Foto-Auflsung Kopien ohne zustzlichen Speicherbedarf Bitmap-Galerie Eingebettete JPEG-Dateien 244 245 245 246 247 247 247 248 251 252 253 253 253 255 255 255 256 256 259 260 261 261 262 264 265 266 272 274 277 282 283 286 292 292 292 293 294 297 297 298 301

InhaltsverzeichnisVerlustfrei oder Verlustbehaftet Fotos zusammenfgen und mischen Anzeigequalitt fr Fotos Fotos speichern und exportieren Fotobearbeitungs-Attribute Umrisse eines Fotos bearbeiten Fotos beschneiden Fotos mit der Maske beschneiden Objekte aus Fotos ausschneiden Bildschirmaufnahme-Funktion Fotos einfrben Externe Foto-Editoren einbinden Position, Gre und Drehung eines Fotos in seinem Rahmen anpassen Horizont begradigen Ein skaliertes Foto in seiner vollen Gre anzeigen Ein Foto auf seine volle Gre bringen Fotos und Bitmaps optimieren Foto-Dokumente Foto-Dateien bearbeiten Foto-Werkzeug Einstieg Verwenden des Foto-Werkzeugs Gemeinsame Foto-Funktionen Optimierungs-Werkzeug Beschneidungs-Werkzeug Bemerkungen zum Foto-Werkzeug Rote-Augen-entfernen-Werkzeug Inhaltsabhngige Foto-Skalierung Panorama-Funktion 3D-Extrusions-Werkzeug Form extrudieren Infoleiste Extrusions-Werkzeug Texturen und Fotos Text extrudieren 3D-Extrusionsattribute kopieren Schatten hinzufgen Navigationsleisten NavBar-Vorlagen verwenden Dialog Eigenschaften der Navigationsleiste Site-Navigationsleiste Schaltflchen und Mens Navigationsleiste auf allen Seiten aktualisieren Bearbeiten auf der Seite 302 302 303 304 305 306 307 307 308 309 310 311 312 314 314 315 315 318 319 321 321 322 322 323 326 329 330 332 336 339 340 340 343 344 344 345 346 346 347 348 350 353 353

7

8

Inhaltsverzeichnisnderung der Schriftart fr die Schaltflchen NavBars importieren und einfgen Eigene Navigationsleisten erstellen Schaltflchenrnder Fr Fortgeschrittene - NavBar-Schaltflchendesign bearbeiten NavBars mit unterschiedlichen ersten oder letzten Schaltflchen Website-Prsentationen. Die Prsentations-Werkzeugleiste Eine Prsentation erstellen Prsentationsschritte bearbeiten Neue Seiten zur Prsentation hinzufgen Seiten aus der Prsentation lschen Auf nchster/vorherigen Prsentationsschritt verlinken Links zu Prsentationsschritten bergangseffekte zuordnen Prsentationsschritten bergangseffekte zuordnen Prsentationsseiten bergangseffekte zuordnen Erweiterte Prsentations-Informationen Ferngesteuerte Online-Prsentationen halten Website Widgets Widgets und Platzhalter Widgets aus der Designs-Galerie Filme und Animationen hinzufgen Widgets von anderen Widget-Seiten Widgets skalieren HTML-Platzhalter manuell hinzufgen Seiten- & Ebenen-Galerie Seiten- & Ebenen-Galerie Seiten Ebenen Ebenen-Aktionen Besondere Ebenen Ebenen verbergen Solo-Modus Ebenen sperren Alle anzeigen & Alle entsperren Objekte zwischen Ebenen bewegen Flash-Animationen Einfhrung Grundstzliches zu Flash Ihre erste Animation Exportieren einer Flash-Datei Animationen als AVI exportieren 353 354 354 355 356 357 359 360 360 362 366 366 367 367 367 368 368 371 373 373 374 377 379 379 381 383 383 388 388 391 394 394 394 395 395 396 397 397 399 400 402 403

InhaltsverzeichnisFrame-Galerie 404 Fotos 406 Framerate und Tweenschritte bei Animationen 407 Ausschnitte animieren 408 Animationsgeschwindigkeit 409 Flssigkeit der Animation 410 Drehung 411 Gruppen 412 Welche Features aus MAGIX Web Designer 7 Premium werden von Flash untersttzt? 413 Farbumwandlung - Farbvernderungen animieren 415 Transparenz 415 URLs in Flash 416 Erweiterte Flashbefehle 416 Flash-Animation - Zusammenfassung 418 Animierte GIFs erstellen 419 Eigenschaften animierter GIFs 419 Drucken Druckrnder zeigen Drucker auswhlen und einstellen Drucken-Dialog Druckoptionen: Ausgabe Druckoptionen: Layout Importieren und Exportieren Allgemeine Anmerkungen zum Exportieren und Importieren Untersttzte Dateiformate fr Import und Export Dateien importieren Dateien exportieren bersicht JPEG, PNG und GIF Export-Dialog Design-Galerie Web Designer Premium anpassen ndern des leeren Vorlagendokuments Eigene Symbole in Browser-Reitern: Favicons Optionen im Men Extras Allgemein Raster und Lineal Maus Seitengre Sicherheitskopien Symbolleisten Mens und Tastaturkrzel Einfhrung 421 421 421 422 424 426 428 428 428 430 432 435 441 443 443 443 444 445 447 448 450 450 451 454 454

9

10

InhaltsverzeichnisMen Datei Men Bearbeiten Men Anordnen Men Extras Men Fenster Men Hilfe Tastaturkrzel Juristisches Copyright MAGIX Web Designer 7 Premium End User License Agreement (EULA) Danksagungen Index 454 458 461 463 465 467 469 473 473 474 477 479

Inhaltsverzeichnis

11

MAGIX Web Designer 7 Premium erwerben und freischaltenWenn Sie die heruntergeladene Trialversion von MAGIX Web Designer 7 Premium starten, erscheint ein Startbildschirm mit drei Auswahlmglichkeiten. Whlen Sie die gewnschte Option und Ihnen werden weitere Anweisungen angezeigt. Ich habe eine Seriennummer und mchte das Programm freischalten: Whlen Sie diese Option, wenn Sie Web Designer Premium bereits erworben haben. Geben Sie den Aktivierungscode ein, der sich in der E-Mail mit der Kaufbesttigung befindet. Um Ihre Version von MAGIX Web Designer 7 Premium zu registrieren, geben Sie Ihre E-Mail Adresse ein. (Sollten Sie die Registrierung bereits durchgefhrt haben, wird dieser Schritt ignoriert.) Klicken Sie anschlieend auf ONLINE REGISTRIEREN und AKTIVIEREN. Ich habe noch keine Seriennummer und mchte das Programm kaufen. Whlen Sie diese Option, wenn Sie Web Designer Premium erwerben mchten. Ihnen wird dann ein Aktivierungscode gegeben. Whlen Sie diese Option aus und klicken Sie anschlieend auf PROGRAMM ONLINE KAUFEN . Ich mchte die Trialversion weiter verwenden: Whlen Sie diese Option, wenn Sie weiterhin die kostenlose Trialversion verwenden mchten - direkt unter dieser Option sehen Sie, wie lang Ihre Testphase noch luft. Whlen Sie diese Option aus und klicken Sie anschlieend auf TESTPHASE FORTSETZEN. Wichtiger Hinweis: Bitte merken Sie sich E-Mail-Adresse und Passwort, mit denen Sie MAGIX Web Designer 7 Premium erwerben, da Sie diese zuknftig bentigen knnten. Z. B. wenn Sie Ihren Aktivierungscode wieder bentigen oder ein Produkt-Upgrade erwerben mchten. Andere Kaufmglichkeiten Sollten Sie keine Trialversion besitzen, so knnen Sie MAGIX Web Designer 7 Premium auch direkt ber unsere Website www.magix.de bestellen. Ihnen wird dann ein Aktivierungscode bermittelt, mit dem Sie die Trialversion spter freischalten knnen.

12

Kundendienst

KundendienstLieber MAGIX Kunde, es ist unser Ziel, Ihnen jederzeit komfortable, schnelle und lsungsorientierte Hilfestellung zu leisten. Dafr stellen wir Ihnen ein umfassendes Angebot zur Verfgung: Unbegrenzter Web-Support: Als registrierter Kunde von MAGIX erhalten Sie unbegrenzten Web-Support ber das komfortabel gestaltetes MAGIX Service-Portal support.magix.net. Hier haben Sie Zugang zu einem intelligenten Hilfeassistenten, hochqualitativen FAQs, Patches und Erfahrungsberichten, die fortlaufend aktualisiert werden. Einzige Voraussetzung zur Nutzung ist die Registrierung Ihres Produktes auf www.magix.de. Online-Community als Soforthilfe und Austauschplattform: Die Online-Community www.magix.info steht Ihnen als MAGIX Kunde kostenlos unbegrenzt zur Verfgung. Die Community umfasst ber 100.000 Mitglieder und beinhaltet die Mglichkeit, Fragen zu MAGIX Produkten an die Community zu stellen oder aber ber die Suchfunktion nach spezifischen Themen oder Antworten zu suchen. Der Wissens-Pool enthlt neben Fragen & Antworten ein Lexikon, Videoanleitungen (Tutorials) und ein Diskussionsforum. Die vielen Experten, die tagtglich auf www.magix.info zu finden sind, garantieren schnelle Antwortzeiten von teilweise nur wenigen Minuten. E-Mail-Support fr MAGIX Produkte: Fr jedes neue MAGIX Produkt erhalten Sie ab Kaufdatum automatisch 8 (acht) Wochen kostenlosen Kundendienst per E-Mail. MAGIX gewhrleistet hier eine schnelle Bearbeitung mit umgehender Antwort. Premium E-Mail-Support: Wenn nach Ablauf der 8 Wochen des kostenlosen E-Mail-Supports ein Problem entsteht, knnen Sie ein Ticket fr den Premium E-Mail-Support im MAGIX Shop zum Preis von 12,99 EUR erwerben. Dieses Ticket bezieht sich auf einen bestimmten Problemfall, bis dieses Problem gelst ist, und ist nicht auf eine E-Mail beschrnkt. Die Meldung von nachweislichen Programmfehlern ist von dieser Regelung ausgenommen. Bitte beachten Sie: Um den Premium E-Mail-Support und den kostenlosen Produkt-E-Mail-Support via Internet in Anspruch nehmen zu knnen, mssen Sie Ihr MAGIX Programm mit der Seriennummer registrieren. Die Seriennummer finden Sie auf der CD-Hlle der Installations-CD bzw. auf der Innenseite der DVD-Box.

Kundendienst Zustzlicher Telefonkundendienst: ber die zahlreichen kostenlosen Kundendienstleistungen hinaus steht Ihnen kostenpflichtig der Kundendienst auch per Telefon zur Verfgung. Sie erreichen den MAGIX Kundendienst telefonisch unter: DEUTSCHLAND Tel.: 0900-17 71 115 (1,24 EURO/Min. aus dem Festnetz von T-Home (*), werktags 9:00 18:00 Uhr) MAGIX Support Postfach 200914 01194 Dresden

13

Post:

STERREICH Tel.: 0900-45 45 71 (1,56 EURO/Min. (*), werktags 9:00 18:00 Uhr)

SCHWEIZ Tel.: 0900-45 45 71 (1,50 CHF/Min.(*), werktags 9:00 18:00 Uhr)

(*) Die Gesprchspreise knnen je nach Anbieter variieren und sind aus dem Mobilfunk oft erheblich hher. Bitte halten Sie folgende Informationen bereit: Welches MAGIX Programm verwenden Sie (Version)? Welches Betriebssystem verwenden Sie? Wie heit Ihre Grafikkarte und in welcher Bildschirmauflsung wird sie betrieben? Wie heit Ihre Soundkarte? Oder benutzen Sie das eingebaute Soundsystem Ihres Computers? Bei Videoprogrammen: Wie heit Ihre Videokarte bzw. FireWire-Karte? Wie gro ist Ihr Arbeitsspeicher (RAM)? Welche DirectX-Version ist installiert?

14

KundendienstMAGIX Vertrieb Unser MAGIX Vertrieb ist werktags fr Sie erreichbar und ist Ihnen bei folgenden Anfragen und Problemen behilflich: Bestellungen Produktberatung (vor dem Kauf) Upgrade-Anfragen Retourenabwicklung Tel: 0180-48 99 999 (0,20 EURO/Anruf aus dem dt. Festnetz, Mobilfunkhchstpreis: 0,42 EURO/Anruf) Montag Donnerstag: 9:00 Uhr 12:30 Uhr und 13:15 Uhr 18:00 Uhr Freitag: 9:00 Uhr 12:30 Uhr und 13:15 Uhr 17:30 Uhr infoservice@magix.net MAGIX AG Borsigstr. 24 32312 Lbbecke

E-Mail: Post:

Was ist neu in MAGIX Web Designer 7 Premium?

15

Was ist neu in MAGIX Web Designer 7 Premium?Web-Authoring/Web-Publishing Neue Widgets Machen Sie Ihre Website zu einem Hinkucker und dynamisch mit unseren neuen cleveren, Widgets! Fgen Sie ihren Seiten professionelle Foto- und Textanimationen hinzu, es sind keine Programmierkenntnisse erforderlich. Mit der Zeit werden weitere Widget zu Galerie hinzukommen, die automatisch heruntergeladen werden. Prsentations-Websites Erstellen Sie browserbasierte Prsentationen im Diashow-Stil, die Ihre Website-Besucher mit den Pfeiltasten steuern knnen. Fr jeden Schritt oder jede Seite sind animierte bergangseffekte mglich. Mit einer Online-Prsentation knnen Sie auch einfach Meetings im Netz abhalten und die Prsentation Schritt fr Schritt im durchgehen. Neue animierte bergangseffekte fr Ebenen und Seiten-Links In MAGIX Web Designer 7 Premium knnen Sie nun sehr einfach den Links auf Ebenen und Seiten eine Reihe von bergangseffekten zuordnen. Diese bergnge funktionieren beim Link auf jede andere Seite oder auch beim Aufruf von Popup-Ebenen. Intelligente wiederholte Kopf- , Fuzeilen oder Wasserzeichen MAGIX Web Designer 7 Premium aktualisiert jetzt alle Vorkommen wiederholter Objekte automatisch, wenn Sie eines davon bearbeiten, so dass Sie diese nicht mehr manuell aktualisieren mssen, wenn Sie etwas verndert haben. Wird eine Instanz eines wiederholten Objekts bearbeitet, bertragen sich die Aktualisierungen sofort auf alle anderen Instanzen dieses Objektes auf den anderen Seiten des Dokuments. Auerdem ist MAGIX Web Designer 7 Premium dabei schlau in Bezug auf die Positionierung, Objekte in der oberen Hlfte der Seite werden auf anderen Seiten relativ zur Oberkante, Objekte in der Nhe des unteren Randes relativ zur Unterkante positioniert, unabhngig von der tatschlichen Seitengre. Mehr Individualitt im Browsertab Ihrer Website mit Favicons. MAGIX Web Designer 7 Premium untersttzt jetzt die Zuordnung von Favicons, dies sind kleine Grafiken, wie zum Beispiel Logos, die in den Tabs und Lesezeichen des Browsers angezeigt werden. Sitemap-UntersttzungSie knnen automatisch eine Sitemap generieren lassen, die sich an Suchmaschinen bertragen lsst und die diese beim durchsuchen und indizieren Ihrer Website untersttzt. Navigationsschaltflchen in der eingebauten Vorschau. Mit den Navigationsschaltflchen oben im Vorschaufenster knnen Sie sich auf der Seite vor und zurck bewegen, genau wie bei einem richtigen Browser, und Startseiten (Home)-Schaltflche bringt Sie wieder zurck auf die Seite, von der Sie die Vorschau begonnen hatten. Schnelle Vorschau Ihrer Seiten in den gebruchlichsten Browsern Wenn Sie Firefox, Chrome, Opera, Internet Explorer oder Safari installiert haben, knnen Sie sich mit einem Klick die Seitenvorschau in einem dieser Browsern anzeigen lassen. Webseitenvorschau in Web Designer Premium Vorschaufenster im Vollbildmodus mit der neuen Schaltflche Vollbildvorschau Wenn Sie das Vorschaufenster schlieen und spter wieder ffnen, behlt Web Designer Premium den letzten verwendeten Anzeigemodus bei, also normal, maximiert oder Vollbild.

16

Was ist neu in MAGIX Web Designer 7 Premium? FTP-Speicherplatz aus MAGIX Web Designer 7 Premium heraus anzeigen Navigieren Sie durch Ihren FTP-Speicherplatz und lschen Sie Dateien oder Ordner mit dem eingebauten Webspace-Explorer von MAGIX Web Designer 7 Premium. Eine Reihe neuer Vorlagen gibt Ihnen noch mehr Auswahl an Designs zur Erstellung von Websites mit MAGIX Web Designer 7 Premium.

Allgemeine Verbesserungen an Werkzeugen und in der Bedienung MAGIX Web Designer 7 Premium enthlt zustzliche Zeichenwerkzeuge zum Gestalten eigener Grafiken, wie Quickshape oder Freihandzeichnen, Schatten, Kante und Verzerren sowie zustzliche Fotowerkzeuge wie Rote-Augen-Korrektur und Maske Neues, Magisches Objekt-Rasten fr das Ausrichten von ObjektenMAGIX Web Designer 7 Premium bietet nun ein magisches Objektraster, das deutlich smtliche mgliche Rastpunkte anzeigt in Bezug auf die Seite, Objekte und Objekte in Gruppen. Wenn Sie eine Form verschieben, zeigt MAGIX Web Designer 7 Premium blaue Linien fr alle Rastlinien relativ zu benachbarten Objekten sowie deren horizontale oder vertikale Mittellinien, sowie rote Punkte fr genaues Einrasten an Punkten auf diesen Linien. Erhhter Bedienkomfort Die Galerien in MAGIX Web Designer 7 Premium bieten schnelleren Zugang zu den bentigten Informationen: Der neue, voreingestellte Seiten-Modus der Seiten- & Ebenen-Galerie zeigt eine schmale Liste von Seiten-Vorschaubildern an zur einfachen Seitennavigation. Damit die Darstellung nicht berladen wirkt, zeigt MAGIX Web Designer 7 Premium anfangs alle Seiten einzeln an. Klicken Sie rechts auf die Seite und whlen Sie Mehrseitige Anzeige oder whlen Sie eine andere Seite in der Seiten& Ebenen-Galerie aus. Durch den hierarchischen Aufbau der Design-Galerie wird die Suche nach Vorlagen erheblich erleichtert und beschleunigt. Besseres Einbetten von Grafiken in Flietext. Das Verankern von Objekten im Text ist jetzt eine Ein-Klick-Aktion und im Text verankerte Objekte knnen jetzt auerdem Text abweisen, so dass sich Umflieen-Effekte sehr einfach bewerkstelligen lassen. Der Abstand fr das Umflieen kann nun separat fr Hhe und Breite eingestellt werden. Die Bewegung verankerter Objekte kann auf vertikale Bewegung beschrnkt werden, sehr ntzlich fr Grafiken neben dem Text, die sich nur hoch oder runter bewegen sollen. Zustzliche Einfge-Funktionen bringen mehr Flexibilitt beim Einfgen: Einfgen der Position, Gre, Einfgen mit Ersetzen der Auswahl, in aktueller Ebene einfgen und an Position in aktueller Ebene einfgen. Ein neues Linien- und Pfeil-Werkzeug. Damit knnen Sie sehr einfach einzelne, unverbundene Linien zeichnen und jeder Linie Pfeilspitzen und -enden hinzufgen knnen. Reiter fr DokumentenfensterReiter am oberen Rand des MAGIX Web Designer 7 Premium-Fensters zeigen eindeutig an, welches Dokument gerade angezeigt wird, welche Dokumententyp und ob es ungespeicherte nderungen gibt. Sehen Sie auf einen Blick, welche Dokumente geladen sind und erreichen Sie diese durch Klick auf den entsprechenden Reiter. Ein neues Galeriesystem erlaubt Ausklapp-Galerien fr schnelles Anzeigen und flexibles Docking. Die neue Galerieleiste gibt sofortigen Zugriff auf alle Galerien, die nun ausklappen, wenn Sie mit der Maus ber die Galerieleiste fahren. Es ist leicht mglich, Galerien im Programmfenster zu verschieben, sie knnen wo immer Sie wollen

Was ist neu in MAGIX Web Designer 7 Premium?festgepinnt oder angedockt werden, sowohl einzeln als auch in Gruppen oder Stapeln bereinander. Schnelles Ausrichten ausgewhlter Objekte ist mglich durch die neuen Rechtsklickmen-Optionen Ausrichten. Mehrere ausgewhlte Objekte knnen damit direkt horizontal oder vertikal ausgerichtet werden, ohne erst den Ausrichten-Dialog ffnen zu mssen. Komplettes Live-Zeichnen von Formen. Werden neue Formen wie Rechtecke, Ellipsen oder QuickShapes erstellt, sehen Sie nun die komplett gefllte Form, sobald Sie diese zeichnen (nicht nur einen Umriss). So sehen Sie direkt die richtige Fll- und Linienfarbe. Das ganze funktioniert auch bei dicken Linien. Einfachere Handhabung von Grafikstilen (Attributregeln) Es gibt eine grundlegende nderung, wie Attribute (Erscheinungsbild oder Stil eines Objektes) auf neue Objekte angewendet werden. Neue Objekte knnen jetzt den Stil des zuletzt ausgewhlten Objekts und nicht des zuletzt gezeichneten Objekts annehmen. Klingt nach einer kleinen nderung, allerdings ist das intuitiver und besser so knnen Sie z. B. den Stil eines Objekts schnell kopieren, indem Sie es erst auswhlen und dann ein neues Objekt zeichnen. Animationen als AVI-Dateien exportieren. MAGIX Web Designer 7 Premium gestattet den Export von Animationen als AVI-Datei. HTML 5 video. Zum Website hinzugefgte MP4-Dateien spielen nun ohne installiertes Flash, wenn der Browser HTML5 untersttzt. Damit funktionieren die Filme auf IHren Seiten auch auf iOS Gerten wie iPhones und iPads.

17

Weitere kleinere Verbesserungen Grere Kontrolle ber das Clipping von Objekten. Mit einer neuen Option auf dem Reiter Website des Webeinstellungs-Dialogs lsst sich festlegen, ob Objekte an den Kanten der Webseiten abgeschnitten werden oder nicht. Wenn Auf Seitenrand beschneiden nicht aktiv ist, werden Objekte, die ber den Seitenrand hinaus ragen, komplett dargestellt, anstatt am Seitenrand abgeschnitten zu werden. Auerdem startet dann die Bewegung von animierten bergngen am Rand des Browserfensters anstatt am Seitenrand. Verbesserte Kontextmens fr direkten Zugriff auf ntzliche FunktionenEin Rechtsklick auf Objekte, die Seite oder den Arbeitsbereich bietet sofortigen Zugang zu relevanten Aktionen. Deutlicheres Textrendering auf den Infoleisten fr bessere Darstellungsqualitt und Deutlichkeit auf alle Werkzeugleisten, dazu muss ClearType in der Systemsteuerung aktiviert sein. Ihre Website zur MAGIX Nutzergalerie hinzufgen. Beim Verffentlichen Ihrer Website knnen Sie entscheiden, ob Sie ein Vorschaubild Ihrer Site in die von MAGIX angebotene Nutzer-Websites-Galerie aufnehmen lassen wollen. Der Fotos optimieren-Dialog enthlt nun eine Option, die aktuelle Auflsung des Fotos beizubehalten. Videokonvertierungen. Beim Import von folgenden nicht untersttzten Videoformaten wird auf eine MAGIX-Seite weitergeleitet, die Mglichkeiten zur Konvertierung anbietet: AVI, DV-AVI, MPEG-1, MPEG-2, MPEG-4, MXV, MJPEG, QuickTime, WMV(HD) Um zu verhindern, dass Objekte auf der aktuellen Ebene Text auf anderen Ebenen abweisen gibt es im Dialog Ebeneneigenschaften die neue Option Nur innerhalb der Ebene Text abweisen. Dadurch wird gleichzeitig auch verhindert, dass Objekte aus hher liegenden Ebenen Text in der aktuellen Ebene abweisen. Diese Einstellung ist

18

Was ist neu in MAGIX Web Designer 7 Premium?ntzlich fr Popup-Ebenen in Website-Dokumenten und dort daher standardmig aktiviert. Header-Code fr Website oder Seiten. Sie knnen HTML-Code jetzt auch in den HEAD-Abschnitt Ihrer Webseiten einfgen, fr eine grere Flexibilitt bei der Website-Gestaltung. Sie knnen einfach eigene Codeabschnitte (oder solche eines Widget-Anbieters) in einzelne Seiten oder auf alle Seiten Ihrer Website einfgen. Das Einfgen von Code in den HEAD- oder BODY-Abschnitt ist auerdem durch einen greren Eingabedialog erleichtert worden.

Einfhrung

19

EinfhrungEs ist offensichtlich, dass die berwiegende Mehrheit an Websites grafischer Natur ist. Das Erscheinungsbild Ihrer Website ist sehr wichtig. Schlielich mchten Sie eine kompetent und professionell gestaltete Website. Wir finden, dass Sie nicht eine Vielzahl von Programmen - Grafik- und HTML-Bearbeitung - verwenden mssen sollten, um Ihre Website zu erstellen. Wir denken, Sie sollten die Freiheit haben, Text, Grafiken und Fotos berall auf der Seite platzieren zu knnen. Das Erstellen von Websites sollte hnlich wie bei PDF-Dateien funktionieren - Sie mssen gar nicht wissen, was hinter den Kulissen geschieht. Sie wrden auch nicht erwarten, die PDF-Daten direkt bearbeiten zu mssen. Sie sollten das HTML Ihrer Website weder kennen noch bearbeiten mssen.

Was macht Web Designer Premium so anders?Web Designer Premium ist einzigartig darin, dass es das einzige Webdesign-Werkzeug ist, das wirkliche Freiheit im Design einer Website erlaubt, alles kann berall platziert werden und genau so akkurat an gleicher Stelle im Browser erscheinen. Text, Grafik und Fotos knnen berall auf der Seite angeordnet werden, in jeder Gre, jedem Winkel, sie knnen sich berlappen und mit Transparenzen versehen sein, erzeugt eine auf den Bildpunkt exakte perfekte HTML-Seite. Web Designer Premium kann Sachen bewerkstelligen, die bei anderen Web-Autorensystemen als nahezu unmglich angesehen wurden, wie um unregelmige Formen und Fotos flieender Text. Fortgeschrittene Vektor-Grafik-Werkzeug sind enthalten, um alles von einfachen Formen bis zu komplexen Firmenlogos und Grafiken zu zeichnen. Enthalten sind auerdem automatische Grafikoptimierungen, nicht nur fr optimal aufgelste Bilder, sondern auch mit automatischer Erkennung wiederholter Elemente innerhalb der Website, um optimale, schnelle Websites zu erstellen. CSS-Ebenen mit fortgeschrittenen Features wie Transparenzen oder sogar Transparenz-Verlufen, MouseOver-Effekte und mehr werden untersttzt. Die erzeugten HTML-Seiten sind 100% browser- und plattformkompatibles XHTML. Und obendrein ist Web Designer Premium auch noch das vielleicht einfachste, am leichtesten zu lernende Autoren-Werkzeug, das verfgbar ist. Web Designer Premium richtet sich an Grafik-Designer, die kein HTML und keine Skriptsprachen lernen wollen. Fr Grafik-Designer ist es das perfekte, schnelle Werkzeug fr Website-Prototypen. Genauso werden aber auch Anfnger angesprochen, die auf dem einfachsten mglichen Weg zu professionell aussehenden Internetseiten gelangen wollen. Web Designer Premium bietet keine Programmierwerkzeuge, keinen Skript-Edtor und noch nicht einmal eine HTML-Ansicht. Unsere Programmphilosophie ist diese: Mann muss auch nicht die PDF-Beschreibungssprache beherrschen, um PDFs zu erzeugen. Warum

20

Weitere Informationsquellensollte man also irgend etwas ber HTML oder Javascript wissen wollen, nur um groartige Websites zu erstellen.

Eine Webseite in sechs Schritten erstellenDiejenigen von uns, deren Aufmerksamkeitsspanne kurz ist (wie bei den meisten von uns), knnen die Hauptvorteile von Web Designer Premium entdecken, indem sie den Anweisungen im Start-Dokument folgen, das sich beim Programmstart von Web Designer Premium ffnet. Hierbei handelt es sich sowohl um eine Einfhrung als auch eine richtige Website, mit der Sie experimentieren knnen. Sie finden dieses Beispieldokument auch in der Design-Galerie. Rckgngig Denken Sie daran, dass Sie jede nderung mit der RCKGNGIG -Schaltflche oder Strg+Z wieder rckgngig machen knnen. Wenn Sie die Schaltflche gedrckt halten, knnen Sie schnell durch Ihre nderungen wieder zum Anfang zurck gehen.

Weitere InformationsquellenWenn Sie bei der Arbeit mit diesem Programm Hilfe bentigen, knnen Sie die folgenden Quellen verwenden: Programmhilfe: Whlen Sie WEB DESIGNER HILFE... aus dem Men HILFE , um die MAGIX Web Designer 7 Premium-Hilfe zu ffnen. Statusleiste: Achten Sie auf den Text in der Statusleiste im unteren Bereich des MAGIX Web Designer 7 Premium-Fensters. Er beschreibt immer die aktuell ausgewhlte Funktion und ist daher ideal geeignet, MAGIX Web Designer 7 Premium besser kennenzulernen. Lesen Sie dazu auch das Kapitel Statusleiste (auf Seite 84). Tooltips: Wenn Sie den Mauszeiger kurz ber einer Schaltflche oder einem Steuerelement stillhalten, erscheint ein kleines Fenster mit Informationen ber die Funktion. Mens: Wenn Sie wissen mchten, was ein Menpunkt bewirkt, whlen Sie ihn aus und drcken Sie dann mit gehaltener Maustaste F1. Dialogfelder: Wenn Sie wissen mchten, was ein Dialogfeld bewirkt, dann klicken Sie einfach auf die HILFE- Schaltflche im Dialog. Tutorial-Videos: Whlen Sie EINFHRUNGSVIDEOS aus dem HILFEMEN, um eine Liste der verfgbaren Tutorial-Videos anzuzeigen.

Dokument-EigenschaftenDATEI -> DOKUMENT-EIGENSCHAFTEN

zeigt Ihnen Informationen, wie etwa Gre und benutzte Schriftarten des Dokuments, an. So knnen Sie schnell erkennen, ob Ihnen eine bestimmte Schriftart fehlt, damit das Dokument richtig angezeigt wird. Eingaben in das Kommentarfeld werden zusammen mit der Datei gespeichert. Diese Anmerkungen werden bei jedem Aufrufen des Dialogs angezeigt.

Weitere Informationsquellen TooltipsWenn Sie mit der Maus ber eine Schaltflche fahren, zeigt der Tooltip die Funktion der Schaltflche an.

21

ber MAGIX Web Designer 7 PremiumHILFE > BER MAGIX WEB DESIGNER 7 PREMIUM zeigt Informationen zur Programmversion. Wenn Sie sich an den Support wenden mchten, mssen Sie diese Infos bereit halten.

22

Erste Schritte

Erste SchritteDieser Abschnitt gibt einen berblick ber die Hauptfunktionen von Web Designer Premium. Sptere Abschnitte gehen zu jedem Werkzeug mehr ins Detail.

Programmoberflche

Infoleiste - ndert sich fr jedes Werkzeug Zoom Website-Vorschau Design-Galerie (Galerien-Werkzeugleiste) Seiten- & Ebenen-Galerie (Galerien-Werkzeugleiste) Auswahl-Werkzeug Foto-Werkzeug Zeichenwerkzeuge Text-Werkzeug Schatten-Werkzeug

Erste SchritteReiter fr alle offenen Dokumente - das Symbol kennzeichnet den Dokumententyp. Farbleiste Hinweis: Alle Infoleisten von Web Designer Premium haben jetzt eine verbesserte Textdarstellung fr bessere Lesbarkeit, wenn ClearType in der Windows-Systemsteuerung aktiviert ist. In der oberen Leiste gibt es vier Schaltflchen, die sich auf Website-Funktionen beziehen. Drei von ihnen haben Ausklappleisten. Diese werden angezeigt, wenn Sie mit der Maus ber die Symbole fahren und beinhalten weitere Web-Funktionen.

23

Webseite/Komplette Website exportieren und Vorschau anzeigen Linkeigenschaften Website-Optionen Exportieren

Bewegen Sie den Mauszeiger ber die jeweiligen Schaltflchen auf der Ausklappleiste fr einen Tooltip.

Es gibt zwei Arten, eine neue Website zu erstellen. Entweder starten Sie mit einer vorgefertigten Vorlage und passen Sie Text, Fotos und Farbschema an. Oder erzeugen Sie eine Website von Grund auf, indem Sie alle erforderlichen Elemente, Text, Grafik, Fotos und Platzhalter wie gewnscht auf der Seite anordnen. Hinweis: Voreingestellt ffnet Web Designer Premium ein neues Dokument so, dass einzelne Seiten angezeigt werden. Um alle Seiten eines Website-Dokuments anzuzeigen, klicken Sie rechts auf die Seite und whlen MEHRSEITIGE ANZEIGE Sie knnen jetzt im Fenster von Web Designer Premium hoch- und runterscrollen, um alle Seiten des Dokuments zu sehen.

Seite zoomen/scrollen/verschiebenDiese gngigen Operationen knnen sehr einfach ausgefhrt werden: Um in die Seite hinein oder heraus zu zoomen, halten Sie Strg gedrckt und benutzen Sie das Mausrad

24

Erste Schritte Um die Seite zu verschieben, drcken Sie die Mausrad-Taste und schieben Sie die Maus (Ja, das Rad ist auch eine Taste). Um zu scrollen, benutzen Sie das Mausrad (oder die Scrollleisten natrlich) Alle Seiten Ihrer Website werden untereinander angezeigt, wie bei einem Textverarbeitungsprogramm. So ist es sehr einfach, die gesamte Website anzuschauen, besonders, wenn Sie die Ansicht herausgezoomt haben. Sie knnen Objekte per Drag & Drop zwischen den Seiten hin- und herbewegen. Wenn Sie seitenbergreifende nderungen am Farbschema vornehmen, knnen Sie sehen, wie sich die nderungen auf alle Seiten auswirken. Die aktuelle Seite ist mit vier Eckklammern gekennzeichnet. In diesem Beispiel sehen Sie Elemente, die im Arbeitsbereich neben den Seiten abgelegt wurden. Sie werden nicht als Teil Ihrer Website exportiert. Der Arbeitsbereich ist ntzlich, um Zwischenstnde oder zu bearbeitende Grafiken, Fotos oder sonstige Objekte abzulegen.

AusklappleistenEinige Werkzeuge auf der Standard-Werkzeugleiste sind unter einem einzelnen Symbol zusammengefasst. Diese Symbole haben in der unteren rechten Ecke eine kleine dreieckige Markierung. Wenn Sie den Mauszeiger ber eins dieser Symbole bewegen, erscheint eine Ausklapp-Leiste. Die Leiste enthlt die anderen Symbole, die in dieser Gruppe zusammengefasst sind. Wenn Sie die Maus ber diese Symbole bewegen, erhalten Sie einen Tooltip, klicken Sie das Symbol fr das gewnschte Werkzeug. Whlen Sie eines dieser modalen Werkzeuge von einer Ausklapp-Leiste, wird dieses Werkzeug das Haupt-Werkzeug dieser Gruppe. Sie sehen das daran, das dieses Symbol jetzt auf der Hauptwerkzeugleiste dargestellt wird. Auch auf der Standard-Werkzeugleiste oben im Fenster gibt es einige Ausklapp-Leisten. Darin werden wiederum verwandte Funktionen unter einem einzelnen Symbol zusammengefasst. Sie sind dadurch bequem erreichbar, ohne zuviel Platz auf der Werkzeugleiste einzunehmen. Tipp: Lesen Sie das Kapitel MAGIX Web Designer 7 Premium anpassen (auf Seite 443) im PDF-Handbuch fr mehr Information ber die Ausklapp-Leisten.

Erste Schritte Objekte auf der SeiteEgal, ob Sie nun eine bestehende Vorlage anpassen oder oder Ihre eigenen Grafiken erstellen, alles lsst sich frei auf der Seite anordnen, drehen, skalieren und auf die gewnschte Position verschieben. Sie knnen kinderleicht die Seitengre Ihren Wnschen anpassen und neue Seiten hinzufgen. Bestimmte Funktionen, wie das ndern des Farbschemas, wirken sich auf alle Seiten gleichzeitig aus. Dies sind die grundlegenden Typen von Seitenelementen: Text: Mit dem Text-Werkzeug knnen Sie alles von Ein-Wort-berschriften ber Textspalten bis zu Textblcken, die ber mehrere Textrahmen gehen, erstellen. Sie knnen auch Aufzhlungen und nummerierte Listen erstellen. Die Infoleiste des Text-Werkzeugs bietet die Mglichkeit, Schriftart, Textgre, Zeilenabstand und mehr. einzustellen. Sie knnen die Textgre entweder durch das Auswahl-Werkzeug ndern oder Text auf die bliche Weise auswhlen und alternativ Punkt- oder Pixelgren anpassen. Sie knnen sogar Text um jede Achse drehen und mit der Text abweisen-Funktion Text um Objekte auf der Seite (z. B. Fotos) laufen lassen. Grafiken: Jede Art von Logo, berschrift und die meisten Schaltflchen, die auf Ihrer Website erscheinen, sind Grafiken. Web Designer Premium ist ein Vektorgrafik-Programm. Das bedeutet, Sie knnen ohne Qualittsverlust die Form oder Gre Ihrer Grafiken ndern oder diese rotieren (anders als bei Pixelbearbeitungs-Programmen wie Photoshop). Und obwohl es keinen Standard fr Vektorgrafiken auf Webseiten gibt (fr Websites mssen alle Grafiken entweder im JPG, GIF oder PNG Format sein), erstellt Web Designer Premium automatisch die richtige Gre und das richtige Format. Wenn Sie zum Beispiel ein farbiges Feld hinter Ihrem Text erzeugen wollen, machen Sie dies indem Sie ein Rechteck- oder abgerundetes Rechteck zeichnen und dieses hinter Ihrem Text platzieren. Wenn Sie Ihre Website speichern, wird die Grafik Automatisch in eine PNG-Grafik mit der richtigen Auflsung umgewandelt. Fotos: Es gibt wenige Websites, die nicht in irgendeiner Weise Fotos enthalten. MAGIX Web Designer 7 Premium verfgt ber groe Zahl an Fotobearbeitungs-Werkzeugen. Sie knnen Fotos per Drag & Drop direkt von Ihrer Kamera oder aus dem Explorer-Fenster auf die Seite ziehen. Anschlieend knnen Sie die Bilder drehen, optimieren und beschneiden und Web Designer Premium erzeugt automatisch JPG-Bilder in der korrekten Auflsung. Bestehende Bilder in Templates auszutauschen funktioniert auch ber Drag & Drop - Sie knnen auerdem die Gre und Neigung der Fotos innerhalb Ihres Rahmens sehr einfach anpassen. Sie knnen auch sehr elegant Miniaturansichten von Fotos erzeugen, die beim Anklicken als vergrerte Version in einem Pop_up_Fenster geffnet werden und die optional Galerie-Steuerelemente enthalten knnen, die es den Seitenbesuchern erlauben, sich durch die Fotos zu klicken oder eine automatische Diaschau zu betrachten. Platzhalter: Dies sind grafische Objekte auf der Seite, die die Gre und Position von dynamischen Widgets wie Flash-Animationen, Videos oder Formularen reprsentieren. Wird Ihre Site exportiert, wird die Platzhalter-Grafik durch den Code ersetzt, der zum Funktionieren des Widgets erforderlich ist, so dass das fertige Widget an gleicher Stelle auf der Seite auftaucht. Fr Einzelheiten dazu lesen Sie bitte das Kapitel Website Widgets im PDF-Handbuch.

25

26

Erste Schritte Objektbasiertes WebdesignAlle diese vorher beschriebenen Elemente werden einheitlich als Objekte bezeichnet. Einer der einzigartigen Vorteile von Web Designer Premium ist, dass Sie jedes Objekt berall absolut frei platzieren knnen. Ihre Website wird alles detailgetreu anzeigen. Das AUSWAHL-WERKZEUG kann dazu benutzt werden, jedes Objekt auf der Seite auszuwhlen und zu bewegen (einfach ziehen), in der Gre zu verndern und zu drehen. Sie knnen die Reihenfolge anpassen (d. h. ob ein Objekt vor oder hinter anderen Objekten auf der Seite erscheinen soll), indem Sie die Optionen aus dem Men Anordnen benutzen. Mit dem Auswahl-Werkzeug knnen Sie die Gre von Objekten ndern, indem Sie an den Ecken des Objekts an den Grenanfassern ziehen. Sie knnen jedes Objekt drehen, indem Sie innerhalb der Eckanfasser ziehen. Und obwohl Websites keinen gedrehten Text untersttzen, erzeugt Web Designer Premium automatisch es eine passende Grafik, so dass das Resultat immer richtig aussieht. Um zu Ihrer Website hinzuzufgen, whlen Sie das TEXT-WERKZEUG , klicken Sie irgendwo auf die Seite und beginnen zu schreiben. Sie knnen auch Textspalten erzeugen, indem Sie mit dem Text-Werkzeug klicken und eine horizontale Linie ziehen oder oder diagonal Textrahmen aufziehen. Lesen Sie den Abschnitt Text (auf Seite 48) im PDF-Handbuch fr weitere Details und das Kapitel Arbeiten mit Text (auf Seite 196) fr eine komplette Aufzhlung der Textfunktionen in MAGIX Web Designer 7 Premium Sie knnen die ZEICHEN-WERKZEUGE benutzen, um Rechtecke, abgerundete Rechtecke, Kreise, Ellipsen zu erzeugen und so ziemlich jede andere Form, indem Sie das Formeditor-Werkzeug benutzen. Lesen Sie dazu den Abschnitt Zeichenwerkzeuge (auf Seite 60) im PDF-Handbuch fr weitere Details.

ObjektreihenfolgeAlle Objekte auf der Seite sind bereinander angeordnet. Das Objekt, welches zuletzt gezeichnet oder erstellt wurde, ist immer ganz oben, das heit, vor allen anderen Objekten. Sie knnen die Objekt-Reihenfolge anpassen, indem Sie die Optionen aus dem Men ANORDNEN verwenden. Wenn Sie z. B. ein neues Rechteck zeichnen, so erscheint es vor allen anderen Objekten. Indem Sie Strg+B drcken (ANORDNEN -> IN DEN HINTERGRUND ) wird das Objekt hinter alle anderen bewegt. Auf hnliche Weise bringt Strg+F alle ausgewhlten Objekte nach vorn vor alle anderen Objekte. Es gibt unabhngig davon aber trotzdem auch noch Ebenen. Alle Objekte knnen in benannten Ebenen zusammengefasst werden; jede Ebene kann ein- bzw. ausgeschaltet

Erste Schrittewerden um alles auf der Ebene zu zeigen oder zu verbergen. Lesen Sie dazu den Abschnitt Ebenen (auf Seite 69) im PDF-Handbuch.

27

Auswahl-WerkzeugMit diesem Werkzeug knnen Sie alle Objekte auf Ihrer Seite auswhlen, bewegen, skalieren und drehen. Das alles machen Sie entweder durch Ziehen an den Objekten oder den Objektanfassern; alternativ knnen Sie genaue Zahlenwerte eingeben. Das ausgewhlte Objekt wird mit vier oder acht ueren Anfassern angezeigt. Die Statusleiste am unteren Bildschirmrand zeigt ebenfalls, was Sie ausgewhlt haben.

Ziehen Sie an einem der Eckanfasser um die Gre eines Objektes zu ndern. Ziehen Sie nur innerhalb der Eckanfasser (wie links angezeigt) um das Objekt zu drehen. Rechtecke und abgerundete Rechtecke haben acht Anfasser, damit Sie diese sowohl drehen als auch strecken knnen. Andere Objekte, wie etwa Gruppen, Textblcke oder Fotos haben nur vier Anfasser und knnen nicht gestreckt werden (sie wrden verzerrt werden).

Objekte schrittweise bewegenMit den Pfeiltasten kann man Objekte schrittweise, Pixel fr Pixel, bewegen. Wenn Sie die Umschalt-Taste gedrckt halten, bewegen sich die Objekte um zehn Pixel.

Objekte drehenObjekte knnen auf zwei Arten gedreht werden. Klicken Sie ein zweites Mal auf das Objekt, damit die Auswahlanfasser zu Rotationsanfassern werden, an denen Sie dann ziehen knnen. Wenn die rechteckigen Auswahl-Anfasser gezeigt werden, knnen Sie auch den Mauszeiger knapp innerhalb der Eckanfasser bewegen, bis der Mauszeiger sich zu einem Dreh-Anzeiger verndert - dann knnen Sie das gewhlte Objekt durch Ziehen drehen. Normalerweise knnen Sie so ziemlich alle Objekte in MAGIX Web Designer 7 Premium drehen, auch Fotos, berschriften oder Textblcke. Da Webbrowser keinen gedrehten Text anzeigen knnen, konvertiert MAGIX Web Designer 7 Premium automatisch gedrehten Text in eine Grafik, wenn Sie Ihr Dokument als Website exportieren.

28

Erste SchritteInfoleisteWenn ein Objekt ausgewhlt wurde, zeigt die Infoleiste ber dem Dokument alle relevanten Steuerelemente des ausgewhlten Werkzeugs. Die Leiste verndert sich je nach ausgewhltem Werkzeug. Dies ist die Infoleiste des Auswahl-Werkzeugs:

Abb.: Die Infoleiste ber Ihrem Dokument zeigt die Funktionen des ausgewhlten Werkzeugs.

Sie knnen Zahlenwerte in jedes Feld eingeben; um z. B. die Gre eines Objektes um 20% zu reduzieren, knnen Sie 80% in das W-Feld eintragen (also eine prozentuale Gre). Das kleine Schloss bestimmt, ob Hhe und Breite zusammen verndert werden sollen.

Objekte kopierenSie knnen die blichen Kopieren- (Strg+C) und Einfgen- (Strg+V) Befehle verwenden, aber wirklich schnell geht es, wenn Sie mit gedrckter rechter Maustaste an einem Objekt ziehen.

Website ToolbarDie Werkzeugleiste Websites bietet bequemen Zugriff auf hufig benutzte Web-Funktionen.

Vorschau Link Website-Optionen Export

Bewegen Sie den Mauszeiger ber die Schaltflchen in der Ausklapp-Leiste fr einen mit Hinweisen zur Funktion dieser Schaltflche.

Tooltipp

Eine Website erzeugenEs gibt zwei Arten, eine neue Website zu erstellen. Entweder Sie starten mit einer vorgefertigten Vorlage und passen Text, Fotos und Farbschema an. Oder Sie erzeugen

Erste Schritteeine Website von Grund auf, indem Sie alle erforderlichen Elemente, Text, Grafik, Fotos und Platzhalter wie gewnscht auf der Seite anordnen. Platzhalter sind Objekte auf der Seite, welche in der fertigen Website durch Elemente wie Flash-Animationen, YouTube-Videos, Interaktive Karten und andere Widgets ersetzt werden.

29

Vorschau Ihrer WebsiteWenn Sie in Web Designer Premium eine Website erzeugen, zeigt ihnen das Dokument eine akkurate statische Vorschau, aber um das Verhalten der Pop-ups, MouseOver-Effekte, Flash-Animationen und anderer Widgets zu kontrollieren, mssen Sie die richtige Browser-Vorschau benutzen. Dazu gibt es zwei Vorschau-Optionen in der Ausklappleiste der Web-Werkzeugleiste.

WEBSITE-VORSCHAU

Alle Seiten Ihrer Website werden exportiert und das Vorschaufenster geffnet. Daher sollten alle Seiten und Links Ihrer Site funktionieren. Mit den Navigationsschaltflchen oben im Vorschaufenster knnen Sie sich auf der Seite vor und zurck bewegen, genau wie bei einem richtigen Browser, und Startseiten (Home)-Schaltflche bringt Sie wieder zurck auf die Seite, von der Sie die Vorschau begonnen hatten.

SEITEN-VORSCHAU

Nur die aktuelle Seite wird exportiert und angezeigt. Dies ist ntzlich, wenn Sie eine umfangreiche Site bearbeiten, deren Export als Ganzes eine lngere Zeit in Anspruch nimmt. So knnen Sie sich schnell mal die Seite anschauen, an der Sie gerade arbeiten, ohne den Rest mit exportieren zu mssen. Fr eine Vorschau Ihrer Website oder -seite im Vollbildmodus klicken Sie die Schaltflche VOLLBILD-ANZEIGE in der rechten oberen Ecke des Vorschaufensters (drcken Sie ESC oder F11, um zur normalen Anzeige zurckzukehren) Wenn Sie das Vorschaufenster schlieen und spter wieder ffnen, behlt Web Designer Premium den letzten verwendeten Anzeigemodus bei, also normal, maximiert oder Vollbild.

Wenn Sie Ihre Site noch nicht exportiert hatten, wird diese Vorschau in einen temporren Ordner exportiert. Sobald die Website exportiert wurde, wird jedes mal, wenn Sie die Vorschau aufrufen, an diese Stelle neu exportiert, so dass bei der Vorschau die exportierte Website kontinuierlich aktualisiert wird.

30

Erste SchritteBrowser fr die Vorschau auswhlenVoreingestellt benutzt die Vorschau eine vereinfachte Version des Internet Explorers, Sie knnen aber auch einen anderen der fnf populrsten Browser zur Vorschau benutzen. Fr die Anzeige der Seite in Ihrem Lieblings-Browser, klicken Sie die entsprechende Schaltflche oben im Vorschaufenster. Hinweis: Es sind nur die Schaltflchen aktiv, fr die der entsprechende Browser auch installiert ist. Vorschau der Seite in Google Chrome

Vorschau der Seite in Mozilla Firefox

Vorschau der Seite im Internet Explorer

Vorschau der Seite in Opera

Vorschau der Seite in Safari

Klicken Sie auf eine der Schaltflchen, um die Seite aus dem Vorschaufenster im entsprechenden Browser zu laden. Wenn Sie sich die Seite in einem anderen Browser als den hier aufgefhrten anschauen wollen, klicken Sie rechts auf die exportierte .htm-Datei und whlen Sie FFNEN MIT... oder ziehen Sie die Datei einfach in ein offenes Browserfenster. Sobald Sie Ihre Website exportiert haben, wird jedes Mal, wenn Sie die Vorschau-Schaltflchen anklicken, auch die exportierte Datei aktualisiert; Sie mssen also nur die Neu laden-Schaltflche Ihres Browsers bettigen (oder F5 drcken).

Vorlagen, Cliparts und Widgets verwendenffnen Sie die DESIGN-GALERIE . Diese zeigt Ordner an, die eine Auswahl an Website-Designs und dazu passenden Grafikdateien mit einem speziellen Thema enthalten.

Erste SchritteEs gibt auch Ordner mit Widgets wie Formularen, E-Commerce-Funktionen, Web-Gadgets und vielem anderen. Blttern Sie durch die Ordner und doppelklicken Sie auf eine Datei, um sie in einem neuen Dokument zu ffnen. Jeder Themen-Abschnitt enthlt eine Auswahl an Seiten-Layouts und einigen anderen sinnvollen Seitenelementen wie etwa Schaltflchen oder Textfeldern. Jedes Thema enthlt auch immer eine komplette Website-Vorlage und verschiedene Farbschemata. Sie knnen die gesamte Website umfrben, nur indem Sie ein Farbschema aus der Galerie auf eine Seite ziehen oder doppelklicken. Einige der Ordner in der Galerie (insbesondere der WIDGETS -Ordner) werden automatisch von den MAGIX-Servern heruntergeladen, wenn Sie online sind und die Galerie ffnen. Daher wird sich Anzahl und Inhalt der Ordner gelegentlich ndern. Sie knnen gelegentlich nachschauen, um die letzten nderungen zu sehen.

31

Neue Seiten zu Ihrer Website hinzufgenSie knnen jede Vorlage aus der DESIGNS-GALERIE auf Ihre Seite ziehen. Wenn es sich dabei um eine Seiten-Vorlage handelt, wird automatisch eine neue Seite zu Ihrer Website hinzugefgt. Vorher werden Sie gefragt, ob Sie die Farbnderungen bernehmen mchten. Wenn Sie eine Clipart, wie etwa eine Schaltflche, eine berschrift oder ein Foto, einfgen, wird es dort auf der Seite eingefgt, wo Sie es loslassen; Sie werden auch dann gefragt, ob Sie die Farbnderungen bernehmen mchten. Zustzlich zu Webseiten-Abschnitten mit bestimmten Themen, hat die DESIGN-GALERIE auch Ordner, in denen sich zustzliche Schaltflchen-Designs, Banner, berschriften, Foto-Objekte und mehr befinden. Ziehen Sie einfach das gewnschte Design aus der Galerie auf Ihre Seite. Sie werden gefragt, ob Sie wollen, dass die Grafik die Farb-Einstellungen der Website bernimmt. Wenn Sie sich dagegen entscheiden, knnen Sie die Farben der importierten Grafik immer noch bearbeiten - siehe unten. Ihre importierte Grafik ist nur ein weiteres Objekt auf der Seite und kann mit dem AUSWAHL-WERKZEUG verschoben, skaliert und gedreht werden. Um eine neue Seite mit demselben Design hinzuzufgen, klicken Sie am besten rechts auf die Seite und whlen AKTUELLE SEITE DUPLIZIEREN oder benutzen die SEITE DUPLIZIEREN- Schaltflche auf der Hauptwerkzeugleiste. Dies reproduziert die aktuelle Seite weiter unten. Sie knnen dann die Elemente wie gewnscht lschen oder bearbeiten. Das hat den Vorteil, dass Sie dieselbe Navigationsstruktur beibehalten knnen. Sie knnen eine neue, leere Seite hinzufgen, indem Sie rechts auf die Seite klicken und NEUE SEITE whlen, oder Sie benutzen die Schaltflche LEERE SEITE EINFGEN im Ausklappmen Seite. Sie knnen eine Seite lschen, indem Sie rechts auf die Seite klicken und AKTUELLE SEITE LSCHEN whlen, oder Sie benutzen die Schaltflche AKTUELLE SEITE LSCHEN im Ausklappmen Seite.

32

Erste SchritteVideos, Flash und andere Widgets einbettenLeicht knnen Sie eine groe Vielfalt interaktiver Elemente, sog. Widgets einbinden; YouTube-Videos, Google Maps, Flash-Dateien oder HTML-Codeabschnitte (snippets). Dies geschieht ber Platzhalter, dies sind Objekte (einfache Rechtecke oder Fotos), mit denen eine HTML- oder Flash-Datei verknpft ist. Wenn Sie Ihre Website speichern, wird der Platzhalter durch diese Datei bzw. diesen HTML-Code ersetzt. Fr Einzelheiten ber Widgets und Platzhalter lesen Sie das Kapitel Website Widgets (auf Seite 373) im PDF-Handbuch. Die Design-Galerie enthlt eine regelmig aktualisierte Auswahl von Widgets verschiedener Provider. Ziehen Sie diese per Drag & Drop auf Ihre Seite. Es ffnet sich ein Browserfenster, das Sie zur Seite des Widget-Anbieters bringt, wo Sie Ihr Widget auswhlen und anpassen knnen. Wenn Sie fertig sind, klicken Sie Einfgen am unteren Rand des Browser-Fensters und das Widget wird auf der Seite eingefgt, dabei wird automatisch ein Vorschaubild des Widgets erzeugt. So einfach geht's! Oder Sie finden selbst Seiten, die Widgets anbieten, und knnen genauso einfach den Code zu Ihrer Site hinzufgen.

Flash ClipartsMit MAGIX Web Designer 7 Premium knnen Sie Flash-Animationen von Grund auf erstellen (siehe das Kapitel Flash-Animationen (auf Seite 397) im PDF-Handbuch); das Programm enthlt aber auch eine Reihe von Flash-Templates, die Sie anpassen knnen. Flash-Templates knnen nicht direkt auf die Seite gezogen werden, sonden mssen in einem gesonderten Animations-Dokument geffnet werden, in dem Sie diese wie gewnscht anpassen knnen. Anschlieend speichern Sie die Flash(.swf)-Datei auf Ihrer Festplatte. Nun knnen Sie mit der Platzhalter-Funktion (auf Seite 283) eine Platzhalter-Grafik erzeugen und diese mit Ihrer Flash (.swf)-Datei verknpfen.

WidgetsEinige der Eintrge in der DESIGN-GALERIE sind dynamische Widgets die Sie schnell und einfach zu Ihrer Website hinzufgen knnen. Wenn Sie eins davon auf die Seite ziehen, ffnet sich ein Browserfenster mit der Widget-Website, wo Sie das Widget konfigurieren knnen. Daher mssen Sie online sein, um Widgets nutzen zu knnen. Sind Sie fertig mit dem Anpassen des Widgets, klicken Sie auf EINFGEN unten im Fenster. Es wird automatisch ein Platzhalter-Bild erzeugt, das ist ein Schnappschuss vom Aussehen des Widgets auf der exportierten Seite im Browser. Auf der Seite in MAGIX Web Designer 7 Premium funktioniert das Widget noch nicht, Sie sehen nur das Vorschaubild. Benutzen Sie die Webseitenvorschau, um Ihre Widget in Aktion zu erleben! Wenn Sie drauen im Internet auf ein interessantes Widget stoen, stellt Ihnen der Webseitenbetreiber normalerweise einen HTML-Codeabschnitt (snippet) bereit, den Sie kopieren und auf Ihrer Seite einfgen knnen. Dies ist in MAGIX Web Designer 7 Premium sehr einfach. Alles, was Sie tun mssen, ist, zum AUSWAHL-WERKZEUG zu wechseln und den Code auf Ihrer Seite einzufgen (Strg+V). MAGIX Web Designer 7 Premium erkennt, dass es sich um HTML-Code handelt und erzeugt automatisch ein Platzhalter-Bild, das nach einigen Sekunden auf Ihrer Seite erscheint. Der Code ist bereits mit dem

Erste SchrittePlatzhalter-Bild verknpft, Sie brauchen also nur die Vorschau zu bemhen und sehen Ihr Widget bereits funktionieren! Auerdem knne Sie Widget-Code auch in den HEAD-Abschnitt der Webseite einfgen, wenn ntig. Klicken Sie auf den Reiter Platzhalter (auf Seite 283) im WEB-EINSTELLUNGEN -Dialog und klicken sie die Schaltflche HTML CODE (HEAD) und fgen Sie den HTML Code in den Dialog ein. Mehr dazu siehe Widgets (auf Seite 373).

33

Website-FarbenAlle Templates benutzen eine kleine Anzahl von Grundfarben und verschiedene Schattierungen dieser Grundfarben. Der einfachste Weg, Ihre Seite neu einzufrben, ist eins der alternativen Farbschemata zu benutzen, die zu jedem Web-Thema in der DESIGN-GALERIE bereitgestellt werden. Ziehen Sie ein Schema auf eine Seite, um die gesamte Site umzufrben oder doppelklicken Sie auf das Schema. Sie knnen die einzelnen Grundfarben auch direkt bearbeiten. Diese werden Benannte Farben genannt und erscheinen auf der linken Seite der Farbleiste am unteren Rand des Fensters.

Aktuelle Linien- und Fllfarbe Farbeditor Farbpipette Keine Fllfarbe Benannte Themen-Farben und verknpfte Farben Feste Palette an Standardfarben Halten Sie den Mauszeiger ber eine Farbe, um Ihren Namen anzuzeigen. Statuszeile. Zeigt, was ausgewhlt ist und liefert Hinweise. Klicken Sie einfach auf eine der benannten Farben und whlen Sie die Bearbeiten-Funktion (wenn Sie mit dem Mauszeiger ber die Farbe fahren sehen Sie den Namen als Tooltip).

34

Erste Schritte

Wenn Sie eine Farbe bearbeiten, knnen Sie die Farbpipette dazu verwenden, um eine Farbe vom Bildschirm, sogar aus anderen Fenstern, aufzunehmen. Whlen Sie die zu bearbeitende Farbe: Fllfarbe/Linienfarbe des ausgewhlten Objekts oder jede der benannten Grundfarben Klicken Sie auf das Label-Symbol um eine benannte Farbe zu erzeugen Klicken Sie, um die erweiterten Farbeinstellungen zu ffnen Vorherige Farbe Aktuelle Farbe Ziehen Sie hier, um eine Schattierung des ausgewhlten Farbtons zu whlen Ziehen Sie hier, um einen Farbton auszuwhlen Der Farbeditor bietet eine einfache Mglichkeit, um eine Farbe auszuwhlen. Klicken Sie auf Erweitert, um RGB-Werte einzugeben. Beachten Sie, dass wenn Sie auf diese Weise eine Grundfarbe ndern, alle verknpften Schattierungen im Dokument ebenfalls gendert werden.

Formen einfrbenSie knnen jede Form mit einer Farbe fllen, entweder durch Ziehen der Farbe aus der FARBLEISTE und Ablegen auf der Form oder dadurch, dass Sie zunchst das Objekt auswhlen und dann auf die Farbleiste klicken und FLLFARBE SETZEN auswhlen. Klicken Sie alternativ auf das FARBEDITOR -Symbol (oder drcken Sie Strg+E) um den Farbeditor anzuzeigen. Sie knnen dort jede beliebige Farbe festlegen. Sie knnen gezeichnete Objekte mit einem Farbverlauf belegen, indem Sie das FLL-WERKZEUG (auf Seite 226) benutzen.

Importierte Cliparts einfrbenWenn Sie eine Grafik durch Ziehen aus der DESIGN-GALERIE importieren, die Import-Option verwenden oder eine .web- oder .xar-Datei auf Ihre Seite ziehen, werden Sie normalerweise gefragt, ob Sie die Farbeinstellungen anpassen mchten. Wenn Sie dies

Erste Schritteverneinen, wird jede in dieser Grafik verwendete benannte Farbe zur Farbleiste hinzugefgt. Ein Klick auf eine der Farben in der Farbleiste gibt Ihnen die Mglichkeit, die Farbe zu bearbeiten.

35

Fotos einfrbenWenn Sie ein Foto einfrben, wird es zu einem Halbton-Foto. Beispiel: Um ein Foto schwarz wei zu machen, whlen Sie es aus und klicken Sie auf das weie Farbfeld am Ende der Farbleiste. Sie knnen als helle und dunkle Farbe jede Farbe auswhlen, nicht nur schwarz und wei. Hinweis: Wenn das Foto Teil einer Gruppe ist, wie es bei vielen Objekten in den Templates und Cliparts der Fall ist, dann mssen Sie das Foto zunchst innerhalb der Gruppe auswhlen. Das machen Sie, indem Sie Strg gedrckt halten, wenn Sie mit dem AUSWAHL-WERKZEUG auf das Objekt klicken. Sie knnen das Foto auch direkt auswhlen, indem Sie auf es im FOTO-WERKZEUG klicken.

Hintergrundfarbe der SeiteDie meisten Seiten-Designs in der DESIGN-GALERIE haben zwei Arten von Hintergrund. Ein breiter Seitenhintergrund erstreckt sich ber den Hintergrund des gesamten Browser-Fensters. Und darber werden die verschiedenen Webseiten-Elemente dargestellt, die blicherweise aus verschiedenen farbigen Flchen bestehen.

36

Erste SchritteAuf der Farbleiste gibt es meist eine Farbe Hintergrundfarbe und eine weitere Farbe Paneel-Farbe, und indem Sie diese bearbeiten, steuern Sie die verschiedenen Hintergrundfarben. Die anderen benutzten Farben heien typischerweise Themenfarbe 1, 2 usw.

Hintergrundfarbe Paneel-Farbe Themenfarben 1& 2 Hintergrundfarbe der Seite einstellen Wenn Sie eine neue, leere Seite ffnen (DATEI -> NEU ) ist diese Seite voreingestellt wei. Dies ist der Hintergrund, auf dem Sie alle Elemente Ihrer Website platzieren. Wenn Sie eine Farbe von der Farbleiste auf die Seite ziehen , wird die Hintergrundfarbe auf diese Farbe eingestellt. Im Webbrowser wird diese Farbe im gesamten Hintergrundbereich des Fensters angezeigt.

Erste Schritte

37

Sie knnen jedoch auch dem Seitenhintergrund wie oben beschrieben eine Farbe zuordnen und dann dem Bereich um die Seite herum eine andere. Dieser Bereich rund um die Seite wird als Arbeitsbereich bezeichnet. Ziehen Sie einfach eine Farbe auf den Arbeitsbereich und stellen Sie die Seitenfarbe wie oben beschrieben ein. Wenn Sie jetzt die Seitenvorschau benutzen, sehen Sie, dass die Hintergrundfarbe des Browserfensters auf die Farbe des Arbeitsbereichs eingestellt wurde und das Rechteck der eigentlichen Seite seine eigene Farbe hat.

38

Erste Schritte

Sie knnen diese Farben mit dem Farbeditor bearbeiten. Klicken Sie rechts auf die Seite und whlen Sie SEITENHINTERGRUND NDERN , um den Farbeditor mit der Seitenfarbe aufzurufen. Um die Hintergrundfarbe des Arbeitsbereichs zu ndern, klicken Sie rechts auf den Arbeitsbereich und whlen Sie SEITENHINTERGRUND NDERN . Um eine gekachelte Hintergrund-Textur festzulegen, ziehen Sie ein Foto oder Bitmap auf Ihr Dokument. ffnen Sie die BITMAP-GALERIE und scrollen Sie zum gerade geladenen Bild. Klicken Sie es an und anschlieend auf die HINTERGRUND -Schaltflche an der Galerie.

Seitenhintergrund-EbeneWenn Sie die Seitenhintergrundfarbe wie oben beschrieben einstellen, indem Sie eine Farbe auf die Seite ziehen, erzeugt das eigentlich eine neue Ebene in Ihrem Dokument, Sie knnen diese sehen, wenn Sie die SEITEN- & EBENEN-GALERIE ffnen, sie wird als SEITENHINTERGRUND-EBENE bezeichnet. Diese Ebene ist normalerweise gesperrt, so dass Sie ihren Inhalt nicht auswhlen oder bearbeiten knnen. Aber Sie knnen sie in der Seiten- & Ebenen-Galerie entsperren, um einige eingeschrnkte Bearbeitungen am Seitenhintergrund vorzunehmen. Klicken Sie auf das Schloss-Symbol neben der Ebene zum entsperren Wenn Sie jetzt den Seitenhintergrund anklicken, sehen Sie, dass ein Rechteck ausgewhlt wurde (das steht auch in der Stauszeile). Dieses Rechteck bedeckt die gesamte Seite und

Erste Schrittewird dazu benutzt, die Seitenfarbe festzulegen. Sie knnen jetzt einige Bearbeitungen an diesem Rechteck vornehmen, ihm z.B. eine Verlaufsfllung mit dem Fllwerkzeug geben oder im Rechteck-Werkzeug die Ecken auf abgerundet stellen. Hinweis: Sie mssen auch dem Arbeitsbereich eine Farbe zuweisen, bevor Sie dem Seitenhintergrund einen Verlauf zuweisen knnen.

39

Die Oberkante der Seite versetzenWenn Sie Arbeitsbereich und Seitenhintergrund verschiedene Farben zugewiesen haben und sich die Seite im Browser betrachten, sehen Sie, dass sich die Seite bis an die Oberkante des Browserfensters erstreckt. Oberhalb der Seite sehen Sie nichts von der Farbe des Arbeitsbereichs. Sie knnen daher einen Versatz einstellen, damit oberhalb Ihrer Seite im Browser etwas Platz gelassen wird. Um einen Versatz hinzuzufgen, ndern Sie den Seitenursprung (Nullpunkt des Lineals). Normalerweise ist der Seitenursprung in der linken oberen Ecke der Seite. Wenn Sie diesen Ursprung beispielsweise um 20 Pixel nach oben verschieben, erzeugen Sie einen 20 Pixel breiten Abstand am oberen Rand der Seite, wenn sie im Browser angezeigt wird. Sie knnen den Ursprung auf zwei unterschiedliche Weisen verndern. Offnen Sie den Dialog EXTRAS ->OPTIONEN, wechseln zum Reiter RASTER & LINEAL und erhhen bei Ursprung den Wert der Y-Koordinate. Der Wert entspricht normalerweise der Hhe Ihrer Seite, erhhen Sie diesen also um soviel, wie der obere Rand breit sein soll. Ist Ihre Seite beispielsweise 700 Pixel hoch, ndern Sie den Wert der Y-Koordinate von 700 auf 720, um einen 20 Pixel Versatz zu erhalten. Alternativ knnen Sie den Ursprung auch interaktiv einstellen. Schalten Sie die Lineale ein mit FENSTER ->LINEALE ANZEIGEN(Strg+L). Klicken und ziehen Sie das Fadenkreuz, es befindet sich dort, wo sich waagerechtes und senkrechtes Lineal treffen, in der linken oberen Ecke des Fensters. Verschieben Sie jetzt den Ursprungspunkt auf die passende Distanz senkrecht oberhalb der linken oberen Ecke Ihrer Seite. Das ndern der horizontalen Position des Ursprungs hat keinen Einfluss auf die Horizontale Positionierung Ihrer Seite, also lassen Sie diese unverndert.

Fortgeschrittene HintergrndeWebbrowser gestatten keine Farbverlufe als Hintergrund ber das gesamte sichtbare Fenster (dass heit, als richtiger HTML-Tag Background), aber sie untersttzen wiederholte, gekachelte Bitmaps als Hintergrund. Sie knnen daher einen Farbverlaufshintergrund mithilfe einer solchen gekachelten Bitmaps erstellen.

40

Erste Schritte

Indem Sie einen langen, dnnen Streifen auf der linken Seite erzeugen bekommen Sie, wenn dieser als Hintergrund festgelegt wird, einen Farbverlauf ber die gesamte Seite als Hintergrund.

Um diesen Effekt zu erzeugen, folgen Sie diesen Schritten:

1.

2.

3.

4.

Zeichnen Sie ein langes, dnnes Rechteck. Dieses muss so hoch sein, wie jeder Benutzer sein Browser-Fenster wahrscheinlich macht, damit es sich vertikal nicht wiederholt. Ein Wert von 1000 Pixeln oder mehr sei hier empfohlen, also deutlich hher als Ihre Seite. Dazu mssen Sie gegebenenfalls herauszoomen. Es sollte sehr schmal sein. Stellen Sie sicher, dass das Rechteck keine Auenlinie hat: Whlen Sie es aus und setzen Sie es auf Keine Auenlinie. Klicken Sie auf das Keine Farbe-Symbol in der Farbleiste (oder whlen Sie keine im Linienstrke Dropdown-Men in der oberen Werkzeugleiste). Stellen Sie sicher, dass das Rechteck einige ganze Pixel breit ist, danach stellen Sie sicher, dass die X- und Y-Koordinaten sich auf ganzen Pixeln befinden. (Whlen Sie mit dem AUSWAHL-WERKZEUG das Rechteck aus, ndern Sie die Breite (W) und drcken Sie die Eingabe-Taste. Anschlieend verndern Sie die X- und Y-Positionen auf ganze Zahlen. Mit dem FLL-WERKZEUG (auf Seite 226) knnen Sie dem Rechteck den gewnschten Farbverlauf geben, indem Sie einfach mit der Maus ber das Rechteck ziehen. Der Farbverlauf muss genau von oben nach unten verlaufen, falls ntig, korrigieren Sie das mit den Fll-Pfeilen. Exportieren Sie das Rechteck als PNG-Bild. Klicken Sie die Schaltflche ALS und ziehen Sie es anschlieend aus dem Explorer wieder direkt auf Ihre Seite.PNG EXPORTIEREN

5.

Erste Schritte6.ffnen Sie die BITMAP-GALERIE , scrollen Sie herunter bis zu der Grafik, die Sie gerade geladen haben (eine sehr dnne, fast unsichtbare Miniaturansicht in der Galerie) und whlen Sie sie aus (klicken Sie auf sie in der Galerie). Klicken Sie anschlieend auf die HINTERGRUND -Schaltflche an der BITMAP-GALERIE . Jetzt knnen das originale Rechteck von der Seite lschen.

41

Hinweis: Das funktioniert nur dann ber den Hintergrund des gesamten Browser-Fensters, wenn Sie dem Arbeitsbereich keine separate Farbe zugewiesen haben. Falls der Arbeitsbereich seine eigene Farbe hat, erstreckt sich der Farbverlauf nur ber den Hintergrund des Seitenbereichs.

Verknpfte SchattierungenSie knnen Farben erzeugen, die hellere oder dunklere Schattierungen einer anderen Farbe sind. Wenn Sie dann die Ursprungsfarbe ndern, nehmen auch alle helleren und dunkleren Schattierungen den neuen Farbton an. Z. B. ein schattierter Farbverlauf auf einer Schaltflche wie dieser: Hierbei handelt es sich um ein einfaches abgerundetes Rechteck mit einem Farbverlauf als Fllung, der mit dem Fll-Werkzeug erstellt wurde. Im Fll-Werkzeug knnen Sie auf ein Ende des Pfeiles klicken, um die Farbe festzulegen. Wenn Sie das Haupt-Grn als benannte Farbe anlegen, dann hellere oder dunklere Varianten dieser Farbe als verknpfte Schattierungen erstellen und anschlieend die benannte Farbe bearbeiten, ndern sich die Schattierungen ebenfalls. So knnen Sie auf einfache Weise komplex schattierte Objekte umfrben.

42

Erste SchritteUm eine verknpfte Schattierung zu erzeugen, ffnen Sie die erweiterten Einstellungen im Farbeditor und whlen Sie das Dropdown-Men NORMALE FARBE . Whlen Sie dort SCHATTIERUNG EINER ANDEREN FARBE .

Klicken Sie auf diese Schaltflche, um die erweiterten Einstellungen anzuzeigen Sie knnen nun jede hellere oder dunklere Schattierung der Grundfarbe auswhlen. Das Kreuz zeigt die Grundfarbe an. Whlen Sie Schattierung in diesem Dropdown-Men und dann die Grundfarbe Sie knnen auch eine verknpfte Schattierung, die in der Farbleiste auftaucht, erzeugen (so dass Sie diese einfach auf andere Objekte anwenden knnen. Wenn Sie eine neue benannte Farbe anlegen, knnen Sie auswhlen, dass diese Farbe eine verknpfte Schattierung einer anderen Farbe sein soll.

FotosSie knnen jedes Foto ersetzen, indem Sie eins per Drag & Drop aus Ihrem Explorer auf ein Foto in Web Designer Premium ziehen. Wenn Sie es auf den Hintergrund ziehen, wird es

Erste Schrittedort auf der Seite eingefgt, wo Sie es losgelassen haben. Alle eingefgten Bilder werden mit 500 Pixeln angezeigt, aber Sie knnen die Gre wie immer mit dem Auswahl-Werkzeug ndern.

43

Lassen Sie Ihr Foto ber einem bestehenden Bild los, um es zu ersetzen. Lassen Sie es ber dem Hintergrund los, um es als neues Foto einzufgen

Wenn das importierte Foto sehr gro ist, werden Sie gefragt, ob Sie stattdessen eine in der Gre reduzierte Version importieren mchten. Dies wird empfohlen mehr dazu im Abschnitt Foto-Auflsung. Wenn Sie ein bestehendes Foto ersetzen, wird das Fll-Werkzeug ausgewhlt und ein Paar Fll-Pfeile werden im rechten Winkel auf dem Foto angezeigt.

44

Erste SchritteDas Foto ist in Wirklichkeit die Fllung einer Form. Sie knnen am Foto ziehen, um es neu zu positionieren oder an den Enden der Fll-Pfeile ziehen, um seine Gre innerhalb der Form zu ndern oder es zu drehen.

Ziehen Sie am Foto um es innerhalb des Rahmens zu verschieben. Ziehen Sie am Ende der Pfeile um seine Gre zu ndern und es zu drehen.

Mehrere Fotos ersetzenBei einigen Vorlagen der DESIGN-GALERIE ,insbesondere Foto-Alben, knnen mehrere Fotos gleichzeitig ausgetauscht werden. Sie knnen im Windows Explorer mehrere Dateien auswhlen, indem Sie bei gehaltener Strg-Taste auf die Dateien klicken, oder bei gehaltener Umschalt-Taste eine Folge von Dateien auswhlen. Dann ziehen Sie diese alle zusammen in MAGIX Web Designer 7 Premium, die Fotos werden eins nach dem anderen ersetzt, von oben nach unten auf der Seite. Dadurch knnen die Seiten eines Fotoalbums rasend schnell mit Bildern gefllt werden. Wenn Sie mehr Fotos hineinziehen, als in die aktuelle Seite eingefgt werden knnen, schaut MAGIX Web Designer 7 Premium auf die folgenden Seiten, ob sich dort einige oder alle Fotos unterbringen lassen. Falls das fr die Anzahl der Fotos immer noch nicht ausreicht, wird die aktuelle Seite so oft dupliziert, wie ntig ist, um alle Fotos unterzubringen. Mit diesem leistungsfhigen Mechanismus knnen Sie im Nu eine mehrseitiges Fotoalbum-Website erzeugen, indem Sie eine Album-Vorlage laden und die Fotos hineinziehen.

Groe Fotos importierenWenn Sie groe Fotos importieren, fragt Sie MAGIX Web Designer 7 Premium, ob Sie eine grenreduzierte Version Ihrer Fotos importieren mchten. Es ist wichtig, diese Option zu whlen, wenn Ihr Dokument eine groe Anzahl Fotos enthalten soll, besonders bei einem Website-Dokument. Sonst werden Sie feststellen, dass Ihr abgespeichertes Design wesentlich grer ist, als es sein msste (es enthlt originale Kopien aller Ihrer Fotos) und Sie haben unter Umstnden nicht gengend Speicher, um Ihre Website zu laden, zu bearbeiten und zu exportieren. Fr ein Web-Dokument sind die Bilder auch in der reduzierten Version hoch genug aufgelst, um vernnftige Ergebnisse zu erzielen, fr

Erste SchritteInternetseiten ist es also fast nie notwendig, Digitalfotos in der vollen Auflsung zu importieren.

45

Foto-WerkzeugMit dem FOTO-WERKZEUG haben Sie viele Mglichkeiten, jedes Foto zu beschneiden oder zu optimieren.

Um ein Foto zu beschneiden, ziehen Sie einfach einen Rahmen ber dem Foto auf, whrend Sie das OPTIMIEREN-FOTO-WERKZEUG ausgewhlt haben. Sie knnen Schnittkanten anpassen, indem Sie an den Anfassern um das Foto ziehen. Oder benutzen Sie das BESCHNEIDEN-WERKZEUG fr eine erweiterte Kontrolle ber den Beschnitt. Lesen Sie den Abschnitt Arbeiten mit Fotos (auf Seite 292) fr Hintergrund-Informationen zur Art, wie MAGIX Web Designer 7 Premium mit Fotos umgeht und den Abschnitt ber das FOTO-WERKZEUG, um zu lernen, wie das FOTO-WERKZEUG verwendet wird.

Vorschau-Fotos mit Pop-upsSie knnen sehr einfach kleine Vorschau-(Thumbnail-)Fotos erzeugen (einfach auf die Gre verkleinern), die nach einem Klick eine grere Version zeigen. Verkleinern Sie einfach Ihre Fotos auf die bliche Weise mit dem AUSWAHLWERKZEUG .

46

Erste SchritteWhlen Sie das kleine Vorschau-Foto und aktivieren Sie die POPUP-FOTO Option im LINK -Reiter des Web-Einstellungen-Dialogs (klicken Sie die LINK-SCHALTFLCHE in der WEB-WERKZEUGLEISTE ).

Klicken Sie auf die Schaltflche EINSTELLUNGEN neben der Popup-Foto-Option, um zum Reiter BILD im WEB-EIGENSCHAFTEN-DIALOG zu wechseln.

Erste Schritte

47

Hier knnen Sie das Erscheinungsbild der Popups ndern. Mit einer Option knnen Sie einen Titel ber jedem Foto anzeigen lassen. Im Eingabefeld TITEL bestimmen Sie den Titel fr jedes Foto. Sie knnen auch optional unter jedem Popup-Foto eine Bildunterschrift anzeigen. Setzen Sie die BILDBESCHREIBUNG (Alt Text) fr die Vorschau im selben Dialog. Siehe Abschnitt Popup-Fotos im Kapitel Webeinstellungs-Dialog fr alle Einzelheiten zu den verfgbaren Optionen. Standardmig wird auch im Browser die Beschreibung (ALT-Tag im HTML) als Tooltip angezeigt, wenn Sie die Maus ber das Vorschaubild bewegen. Um einen anderen Text anzuzeigen, typischerweise etwas wie Zum Vergrern klicken, wenn die Maus ber das Vorschaubild bewegt wird, gehen Sie in den Reiter MOUSEOVER und geben Sie bei POPUP-TEXT ZEIGEN Zum Vergrern klicken ein.

Foto-Auflsung - alles automatischWenn Sie ein Foto importieren wollen, welches hher oder breiter als 1920 Pixel ist (HD-Bildschirmauflsung), werden Sie gefragt, ob Sie stattdessen eine grenreduzierte Version importieren wollen. Fr Internetzwecke bentigen Sie sehr selten grere Fotos, daher ist der Import der reduzierten Version fast immer angebracht. Grenreduzierte Fotos zu benutzen ist auch empfohlen, um die Gre ihres Designs (.web oder .xar-Datei) klein zu halten und vor allem den Speicherbedarf des Programms beim Bearbeiten und Exportieren.

48

Erste SchritteWenn Sie sich nicht sicher sind, ob Sie das Foto nicht doch spter in voller Auflsung bentigen, knnen Sie es auch erst normal importieren und spter runteroptimieren. Zum Optimieren whlen Sie im Kontextmen (rechter Mausklick) die Option Foto optimieren. Oder optimieren Sie alle JPEG-Fotos in Ihrem Dokument auf einmal, indem Sie im Men EXTRAS -> ALLE JPEGS OPTIMIEREN auswhlen. Web Designer Premium speichert das Bild immer mit der vollen Auflsung (es sei denn, Sie haben diese beim Import reduziert wie oben erwhnt). Das bedeutet, Sie knnen das Bild nach Wunsch ohne Qualittsverlust skalieren und beschneiden. Web Designer Premium wandelt alle Ihre Fotos automatisch in ein JPEG-Bild mit der richtigen Auflsung um, wenn Sie Ihre Website speichern. Sie mssen sich ber DPI, Bildgre, Pixel oder dergleichen keine Gedanken machen. Was Sie in Web Designer Premium (bei 100% Zoom) sehen, ist genau das, was auch auf Ihrer Webseite erscheint. Wenn Sie ein Foto, oder jedes andere Objekt, auf eine bestimmte Gre bringen mchten, geben Sie einfach die bentigte Gre in den Feldern fr Breite und Hhe in der Infoleiste des Auswahl-Werkzeugs ein. Wenn Sie ein Foto auf der Seite platzieren (solange Sie kein existierendes Foto ersetzen), wird es auf 500 Pixel Breite gesetzt. Wenn Sie es aber genau 200 Pixel breit haben mchten, geben Sie einfach 200pix in das W-Gren-Feld des Auswahl-Werkzeugs. Sie knnen dabei jede beliebige Einheit verwenden - 2 cm macht es z. B. 2 Zentimeter breit.

TextSie knnen Text bearbeiten, indem Sie das TEXT-WERKZEUG auswhlen und auf den Text klicken. Sie haben alle blichen Textbearbeitungsmglichkeiten und knnen Text aus der System-Zwischenablage einfgen. Mit einem Doppelklick whlen Sie ein Wort, mit einem Dreifachklick whlen Sie eine ganze Zeile - das ist hilfreich, will man den gesamten Text einer Schaltflche auswhlen. Die Infoleiste bietet wie immer eine groe Anzahl an Einstellungen fr dieses Werkzeug.

Erste SchritteDas Schriftarten-Men zeigt eine Liste von Schriftarten und ist in drei Abschnitte eingeteilt. Der obere Abschnitt zeigt die im Dokument verwendeten Schriftarten, darunter finden Sie websichere Schriftarten und im unteren Abschnitt werden alle auf dem Computer installierten Schriftarten angezeigt.

49

Abb.: Die drei Abschnitte des Schriftarten-Mens. In diesem Beispiel wurde Courier New ausgewhlt mit den beiden fetten und kursiven Varianten. Nicht alle Schriftarten haben solche Varianten.

Im Schriftarten-Men knnen Sie live Schriftarten auswhlen. Whrend Sie mit der Maus durch das Men fahren, ndert sich der ausgewhlte Text, so dass Sie sehen knnen, wie Ihr Dokument mit der jeweiligen Schriftart ausshe.

SchriftgreDas Schriftgren-Feld zeigt die Schriftgre in Pixeln, da dies die sicherste Methode ist, die Textgre fr den Gebrauch im Internet festzulegen. Sie knnen aber auch jede Gre in Punkt (oder jeder anderen Einheit) eingeben indem Sie einen Wert mit pt (fr Punkt) eingeben, z. B. 72 pt oder 1 cm, die dann in die korrekte Pixelgre umgerechnet werden.

50

Erste SchritteWebsichere SchriftartenNur eine kleine Auswahl an Schriftarten kann sicher fr den Haupttext einer Website verwendet werden - nur die Schriftarten, von denen Sie wissen, dass Sie auf dem Computer, auf dem die Seite angeschaut wird, vorhanden sind. Obwohl es keine Garantie dafr gibt, gibt es eine gngige Anzahl von Schriftarten, die auf etwa 98% aller Computer verbreitet sind, inklusive Apple Macs und Linux Computer. Diese Schriftarten nennen sich websichere Schriftarten und sind in einem separaten Abschnitt des Schriftarten-Mens aufgelistet. Wenn Sie versuchen, eine Website zu speichern, die keine websicheren Schriftarten verwendet, werden sie von MAGIX Web Designer 7 Premium gewarnt. Sobald Sie ein Textobjekt in eine Grafik umwandeln, knnen Sie jede Schriftart verwenden. Lesen Sie dazu den Abschnitt ber Gruppen (auf Seite 55) weiter unten, um nheres zu erfahren.

Neue Textobjekte erstellenEs gibt drei Arten von Textobjekten - eine einfache Textzeile, eine Text-Spalte und ein rechteckiges Textfeld. Um eine einfache Textzeile zu erzeugen, whlen Sie das TEXT-WERKZEUG und klicken Sie irgendwo auf den Hintergrund. Sie knnen nun anfangen zu schreiben. Um eine Spalte zu erzeugen, klicken auf dem Hintergrund und ziehen Sie eine horizontale Linie. Sie knnen die Spaltenbreite jederzeit anpassen. Um einen Textbereich zu erstellen, klicken und ziehen Sie diagonal. Sie knnen die Breite und Hhe des Textfeldes anpassen.

Gedrehter TextUnblicherweise (einzigartig fr einen Webeditor) knnen Sie jedes Textobjekt, sogar Textspalten drehen, indem Sie die Drehen-Funktion des Auswahl-Werkzeugs verwenden. Da Webbrowser aber gedrehten Text nicht untersttzen, konvertiert Web Designer Premium jeden gedrehten Text in eine Grafik, wenn die Seite als Website exportiert wird.

Aufzhlungen und Nummerierte ListenMit den entsprechenden Schaltflchen auf der Infoleiste des TEXT-WERKZEUGS knnen Sie einfach Aufzhlungen und nummerierte Listen eingeben. Mit Rechtsklick auf eine nummerierte Liste und der Option Listeneigenschaften... knnen Sie das Nummerierungs-Schema ndern. Fr eine ausfhrliche Information dazu lesen Sie bitte das Kapitel Arbeiten mit Text (auf Seite 196).

Weiche Schatten, Text mit Farbfllung, transparenter TextSie knnen diese Effekte mit den entsprechenden Werkzeugen erzeugen. Beispiel: Wenn Sie bei gehaltener Maustaste mit dem Fll-Werkzeug ber Text ziehen, entsteht ein Farbverlauf oder wenn Sie mit dem Schatten-Werkzeug an ihm ziehen, entsteht ein weicher Schatten. In diesen Fllen wird Ihr Text von Web Designer Premium fr Ihre exportierte Website automatisch in eine Grafik umgewandet.

Erste SchritteTextabweisende ObjekteDARUNTER ABWEISEN (AUF SEITE 213)

51

Wenn Sie auf ein Objekt, z. B. ein Foto, rechtsklicken und die Men-Option TEXT auswhlen, knnen Sie Text um das Objekt herumlaufen lassen, das ber dem Text liegt. Viele Objekte, z. B. Fotos, Seiten-Navigationen, Schaltflchen und berschriften, die in den Vorlagen der DESIGNS-GALERIE verwendet werden, weisen automatisch Text ab - Text fliet immer um diese Objekte, wenn Sie diese umher bewegen. Abweisende Objekte weisen nur den Text ab, der sich hinter dem Objekt befindet - Sie mssen also gegebenenfalls das Objekt In den Vordergrund bringen, damit das Abweisen funktioniert (Strg+F). Alternativ knnen Sie ein Objekt auch nur fr den Text innerhalb einer Ebene anweisend machen, so dass verhindert wird, dass Text in einer tiefer liegenden Ebene abgewiesen wird (das ist ntzlich fr Popup-Ebenen in einer Website) siehe Ebeneneigenschaften (auf Seite 392). Alle Arbeitsschritte im TEXT-WERKZEUG sind live - der Text wird neu formatiert und fliet anders, whrend Sie die Spaltenbreite ndern oder textabweisende Objekte verschieben. Hinweis: Sie knnen Text jetzt auch um verankerte Objekte (auf Seite 51) herum abweisen lassen.

Verankerte ObjekteSoll ein grafisches Objekt genau neben einem bestimmten Teil eines Textblocks erscheinen, so kann dieses Objekt verankert werden und es bewegt sich mit dem Text. Klicken Sie rechts auf das Objekt und whlen Sie AN TEXT VERANKERN. Links oben am Objekt erscheint nun ein Anker-Symbol, klicken und ziehen Sie dieses Symbol mit dem AUSWAHL-WERKZEUG an die Stelle im Text, an der Sie dieses Objekt verankern wollen. Das verankerte Objekt verschiebt sich nun zusammen mit dem Ankerpunkt, sobald Sie den Text bearbeiten. Hinweis: Sie knnen Text jetzt auch um verankerte Objekte (auf Seite 51) herum abweisen lassen.

52

Erste SchritteTextfelderGenauso wie einige Schaltflchen der Designs-Galerie knnen auch einige Textfelder ihre Breite der Breite oder Lnge an den Textes anpassen, der eingegeben wurde.

Der Feldhintergrund verndert sich, um sich lngeren und breiteren Textblcke anzupassen.

Sie knnen die Breite einer Textspalte anpassen, indem Sie ins Text-Werkzeug wechseln und an den Anfassern fr die Spaltenbreite (unter der ersten Textzeile) ziehen. In den meisten Templates in der Design-Galerie gibt es ein paar Textfelder, die zu dessen Thema passen. Einige Textfelder knnen nur vertikal, andere vertikal und horizontal gestreckt werden.

Rechtschreibprfungber die Schaltflche auf der Infoleiste TEXT-WERKZEUGS knnen Sie die Sprache der Rechtschreibprfung auswhlen. Wenn Sie RECHTSCHREIBUNG BEI DER EINGABE PRFEN auswhlen, werden auch alle unbekannten Worte mit einer roten Punktlinie unterstrichen. Klicken Sie mit der rechten Maustaste auf ein Wort, um alternative Schreibweisen vorgeschlagen zu bekommen.

Eingebettete SchriftartenWeb Designer Premium speichert die Zeichenformen aller Schriftarten, die in Ihrem Dokument verwendet werden. Das heit, wenn Sie jemand anderem Ihre .web- oder .xar-Datei geben oder die Datei auf einen anderen Computer bertragen, so wird dort dasselbe angezeigt wie bei Ihnen, selbst wenn die richtigen Schriftarten nicht auf dem Computer installiert sind. Dies gilt aber nur fr die Zeichen, die im Dokument verwendet werden (es wird keine komplette Schriftart mit gespeichert). Das heit also, dass wenn an Computern, an denen die Schriftarten fehlen, neuer Text eingegeben wird, die richtigen Zeichenformen fehlen werden. Tipp: Es gibt viele Tastaturkrzel im TEXT-WERKZEUG . Lesen Sie dazu den Abschnitt ber Tastaturkrzel (auf Seite 471). Ein Krzel zum Experimentieren mit Seitenlayouts ist Strg + Umschalt + L, mit dem Sie einen pseudo-lateinischen Blindtext einfgen.

Erste Schritte SeitengreSie knnen jede beliebige Seitengre im Reiter SEITE des EINSTELLUNGEN DIALOGS (Datei->Seiteneinstellungen) festlegen. Es wird nicht empfohlen mehr als 990 Pixel zu nehmen, da dies die maximale Breite von vielen Bildschirmen ist (1024 minus etwas Abstand fr die Scrollleiste). Weiter verbreitet ist eine Seitenbreite von etwa 800 Pixeln. Die Hhe Ihrer Seite knnen Sie durch Ziehen am unteren Rand der Seite verndern. Whlen Sie dazu das AUSWAHL-WERKZEUG und fhren Sie den Mauszeiger ber die untere Kante der Seite, der Mauszeiger verndert sich dann und zeigt an, dass Sie nun durch Ziehen die Seitenhhe verndern knnen.

53

Seitengre von Templates ndernSie knnen auch die vertikale Gre der vorgefertigten Templates durch Ziehen an der unteren Seitenkante verndern. Sie mssen jedoch die Objekte der Seite verschieben und ihre Gre ndern. Viele Templates haben z. B. eine Fuzeile. Mit dem AUSWAHL-WERKZEUG knnen Sie diese an die neue Position bringen. Manchmal ist der Haupttext auf einem farbigen Hintergrund-Rechteck. Dieses knnen Sie auch mit dem AUSWAHL-WERKZEUG vergrern, indem Sie am unteren Objektanfasser ziehen. Die meisten Templates benutzen Textspalten, die lnger werden, wenn Sie mehr Text eingeben. Hinweis: Wenn Sie Strg gedrckt halten, whrend Sie ziehen, stellen Sie sicher, dass das Ziehen genau vertikal oder horizontal ist.

Ihre Arbeit speichern. Eine Website erzeugenBenutzen Sie die Menoptionen SPEICHERN oder SPEICHERN UNTER um Ihren Fortschritt zu sichern. Damit wird eine Datei mit der Endung .web, dem Dateiformat von Web Designer Premium, gespeichert (dabei handelt es sich nicht um eine Website). Es wird empfohlen, Ihre Arbeit von Zeit zu Zeit zu speichern. Wenn Sie Ihre Website spter bearbeiten und aktualisieren wollen, mssen Sie auf diese Weise eine .web-Datei speichern. Es wird auch empfohlen, die Funktion Automatische Sicherheitskopie zu aktivieren. Einstellungen dazu befinden sich im Reiter Sicherheitskopien des OPTIONEN-Dialogs. Wenn aktiv, werden in regelmigen Abstnden Sicherheitskopien aller genderten, offenen Dokumente gespeichert. Im Dialog kann auch festgelegt werden, wie sich das Programm beim Schlieen verhlt. Entweder Sie erhalten fr jedes Dokument die bliche Sicherheitsabfrage, zu speichern oder die nderungen zu verwerfen oder alle offenen Dokumente werden automatisch als Sicherheitskopie gespeichert und beim nchsten Programmstart wiederhergestellt.

54

Erste SchritteEine Website besteht aus den HTML-Dateien und den anderen dazugehrigen Dateien, die im Netz verffentlicht werden sollen. Um diese zu speichern, whlen Sie Men Datei -> Website exportieren oder klicken Sie diesen Button auf der Website-Werkzeugleiste. Dadurch entsteht eine .htm-Datei fr jede Seite und ein Ordner, der alle Grafikdateien enthlt, die auf Ihrer Website vorhanden sind. Wenn Sie eine Website exportieren, werden alle Seiten zusammen exportiert und jede unbenannte Seite wird um ein _1, _2 usw. am Ende des Namens ergnzt, den Sie beim Export vergeben haben. Der _FILES -Ordner enthlt alle Grafiken und andere Dateien, die zu Ihrer Website gehren. Sie knnen jeder Seite ber den Reiter SEITE des WEB-EINSTELLUNGEN -Dialogs einen individuellen Namen geben, oder benutzen Sie dafr die Seiten & Ebenen-Galerie (auf Seite 383). Der Standard-Name Ihrer Website ist index.htm, da dies der bliche Name fr die erste Seite einer Website ist. Die Vorschau einer gespeicherten Website ist einfach in jedem Internetbrowser mglich, indem Sie die index.htm (oder auch jede andere .htm-Datei) aus dem Windows-Explorer ber ein Browserfenster ziehen.

Automatische SicherheitskopienDer Reiter Sicherheitskopien des Optionen-Dialogs erlaubt Ihnen, die automatische Sicherheitskopie an- oder abzustellen. Diese Funktion speichert Kopien genderten offenen Dokumente in regelmigen Abstnden. Wir empfehlen, diese Option aktiviert zu lassen, damit Ihre Arbeit regelmig gesichert wird. Sie knnen dort auch auswhlen, ob Sie beim Schlieen des Programms eine Sicherheitsabfrage ber ungespeicherte nderungen bekommen wollen, oder ob stattdessen alle offenen Dokumente automatisch gesichert und beim nchsten Start wiederhergestellt werden sollen. Siehe Kapitel Arbeiten mit Dokumenten (auf Seite 93) fr ausfhrliche Informationen.

Dehnbare ObjekteViele Grafikobjekte, wie etwa Schaltflchen und Textfelder, knnen Ihre Gre automatisch der Lnge des Textes anpassen. Einige Schaltflchen heien z. B. Dehnbare Buttons. D. h. dass die Lnge der Schaltflchen sich abhngig vom Text auf der Schaltflche anpasst. Von den meisten Vorlagen und allen Schaltflchen im Ordner Buttons in der Design-Galerie gibt es eine Version mit fester Breite und eine dehnbare Version. Es wird empfohlen, dass, wenn Sie eine Reihe von Schaltflchen erstellen (meistens eine horizontale oder vertikale Sammlung von Links oder Schaltflchen), Sie eine feste Breite verwenden, so dass diese alle dieselbe Gre haben.

hnlich dazu knnen viele der Seiten- und Textflchen in den Vorlagen und manchmal sogar der Haupt-Textbereich ihre Gre horizontal und vertikal anpassen. Im Falle von

Erste SchritteTextfeldern knnen Sie die Breite der Spalte mit dem Text-Werkzeug verndern, indem Sie am linken oder rechten Ende des Spalten-Anzeigers ziehen.

55

GruppenSie knnen jede Auswahl von Objekten gruppieren. Viele Elemente der Templates in der Design-Galerie, wie z. B. Schaltflchen, Textfelder und Foto-Objekte sind gruppierte Elemente. Gruppen werden in dem Sinne wie einzelne Objekte behandelt, dass Sie diese verschieben, ihre Gre anpassen und sie drehen knnen, als wren sie ein Objekt. Sie knnen z. B. eine Schaltflche von Grund auf erzeugen, indem Sie ein Rechteck mit dem Rechteck-Werkzeug zeichnen und einen Text mit dem Text-Werkzeug darauf platzieren. Dies sind unabhngige Objekte, die Sie mit dem Auswahl-Werkzeug verschieben knnen. Aber wenn Sie beide mit dem Auswahl-Werkzeug auswhlen (Sie knnen einen Rahmen um beide ziehen oder die Umschalt-Taste gedrckt halten, whrend Sie auf die einzelnen Objekte klicken) und dann Strg+G drcken (oder im Men ANORDNEN -> GRUPPIEREN ), werden sie zu einem gruppierten Ob