Gestaltung einer Website kann eine Menge Spaß , aber herausfordernden sein . Vielleicht der schwierigste Teil der Konstruktion ist zu entscheiden, wie das Layout jedes Segment der Website. Während dies in vielen Web-Editoren durchgeführt werden können , sind sie oft nicht die besten Werkzeuge in dieser frühen Planungsphase . Adobe Photoshop bietet eine einfachere und effizientere Möglichkeit, Web-Layouts zu erstellen , weil es Ihnen , um das Layout , ohne sich mit dem HTML-Code visualisieren können . Dieses Tutorial soll Ihnen beibringen, um eine Web-Layout in Photoshop CS3 erstellen , andere Versionen von Photoshop ähnlich sein sollten. Things You
Adobe Photoshop
brauchen anzeigen Weitere Anweisungen
1
Öffnen Sie ein neues Dokument. Wenn Sie mit Adobe CS3 oder höher sind , hat Adobe eine Voreinstellung für Web-Seiten, 640 x 480 Pixel vorgesehen ist. In der "Neuen " Wählen Sie im Dialogfeld "Web " aus dem " Preset " drop-down Menü . Wenn Sie nicht über ein Web- Presets oder Ihre Web-Layout ist eine andere Größe, geben Sie die Größe Ihrer Web-Seite in der "Breite" und "Höhe" -Boxen.
2
Füllen Sie den Hintergrund mit der Hintergrundfarbe. Wählen Sie das " Füllwerkzeug . " Doppelklicken Sie auf das " Vordergrundfarbe ", um das Fenster " Color Picker ". Wählen Sie den " Nur Web-Farben " aktivieren . Dann wählen Sie Ihre Hintergrundebene. Wählen Sie " OK".
3
Platz das Banner . Erstellen Sie eine neue Ebene . Wählen Sie " Datei> Platz ... " Navigieren Sie zu Ihrem Banner-Bild und klicken Sie auf "OK". Positionieren Sie Ihr Banner nach Wunsch. Wenn Sie nicht über ein Bild banner , können Sie einen Platz für Ihr Banner , wie im nächsten Schritt gezeigt .
4
Fügen Sie die restlichen Segmente des Web-Layout . Erstellen Sie eine neue Ebene für jeden Teil der Web-Seite. Wählen Sie ein Form-Werkzeug aus der Werkzeuge -Menü. Wählen Sie eine Hintergrundfarbe für das Segment . Zeichnen Sie die restlichen Layout für Ihre Website.
5
Schneiden Sie die Web-Layout , um es für das Web vorbereiten . Wählen Sie den " Slice" -Tool. Zeichnen Sie ein Rechteck um jedes Segment .
6
für Web speichern . Wählen Sie " Datei> Für Web speichern ". Schaltfläche "Control A" , um alle Scheiben zu wählen. Dann klicken Sie auf " Speichern". Wählen Sie " HTML-und Bild " aus dem " Format " Drop-Down -Menü. Stellen Sie sicher, dass "alle Slices " ausgewählt und speichern Sie das Layout im Website-Ordner . Die Web-Layout ist nun bereit , um Inhalte in einem Web- Editing-Programm wie Dreamweaver hinzuzufügen.
