konvertieren PSD zur Website

8

Ich lerne Web-Dev und bin schon irgendwann festgefahren.

Wie konvertiere ich eine PSD-Vorlage in eine HTML / CSS-Website?

Ich habe den gesamten Teil des Bildes abgeschnitten und separat in .gif gespeichert, aber dann? Muss ich sie manuell in eine Dreamweaver-leere Vorlage einfügen? Ich dachte, es wäre ein automatisierter Weg dazu ...

Ich habe auch versucht "Speichern für Web und Geräte ..", aber beim Speichern, erstellt es eine HTML-Datei und ein einzelnes Bild, das jedes Element enthält? Ich habe mehrere Bilder erwartet, damit ich sie in Dreamweaver neu anordnen kann.

    
user251356 28.01.2010, 20:51
quelle

5 Antworten

11
  1. Während bestimmte Anwendungen eine Automatisierung des "Konvertierungs" -Prozesses von der Composite-Grafik zum Web-Layout ankündigen / anbieten, möchten Sie diese Funktionen nicht verwenden. Sie werden dir mehr Ärger machen, als sie wert sind. Vor allem, wenn Sie CSS für das Layout verwenden (was ich sehr zu empfehlen). Das ist nicht zu sagen, diese Funktionen haben keine begrenzte gültige Nutzungen (mehr dazu in Punkt 2) es nur, dass sie nicht magisch Ihre Website von einer Grafik generieren.
  2. Um "Save for Web ..." zu verwenden, müssen Sie das Slice-Tool verwenden, um das Bild in die verschiedenen Bilder zu zerlegen, die Sie für das Layout benötigen. Wenn Sie dann für das Web und die Formate mit HTML speichern, wird das HTML / CSS und die Bilder exportiert. Auch dies ist keine Magie und die Chancen stehen gut, dass Sie das meiste von dem, was es für Sie getan hat, komplett neu machen müssen - es ist nutzlos für mehr als das Schneiden eines bestimmten Bereichs des Layouts (sagen wir ein einzelnes Menü).

Es gibt im Allgemeinen keinen vollautomatischen Weg, dies zu tun, denn je nachdem, was Sie für das Layout benötigen, müssen Sie die Dinge auf verschiedene Arten auslegen, während es theoretisch möglich ist, alle möglichen potenziellen Anforderungen zu berücksichtigen eine nette kleine Export-GUI ist nicht wirklich machbar.

Um das zu erreichen, müssen Sie HTML / CSS lernen. Und je mehr Sie lernen, desto mehr werden Sie Dreamweaver hassen (zumindest in "Layout-Ansicht"). Garaunteed.

    
prodigitalson 28.01.2010, 21:00
quelle
9

Ja, Webdesign funktioniert nicht durch Magie. Die richtige Vorgehensweise besteht darin, den tatsächlichen Code, der die Elemente positioniert, manuell zu schreiben, anstatt sie in Dreamweaver einzufügen. Es gibt viele gute Tutorials, schau dir diese an, zum Beispiel:

Tatu Ulmanen 28.01.2010 21:00
quelle
8

Willkommen in der Realität.

Sie müssen sich selbst in Scheiben schneiden und würfeln (gut, schneiden Sie das Bild selbst und schneiden Sie es selbst, aber schneiden Sie sich nicht, egal wie viel Sie wollen), und platzieren Sie dann jedes einzelne Teil in Ihrem HTML oder Template.

    
SuperMagic 28.01.2010 21:01
quelle
6

Dies kann Ihnen helfen, es führt Sie durch den Prozess.

    
James Campbell 28.01.2010 21:04
quelle
5

Es gibt eine Reihe von automatisierten Diensten, die PSDs für Sie konvertieren:

Sie sollten jedoch auch einen service-basierten Ansatz in Betracht ziehen. Es gibt eine blühende Gemeinschaft von professionellen Slicern da draußen (einfach google "psd to html" und du wirst sehen, was ich meine).

Sie könnten auch versuchen, aus einem Programm oder Framework wie:

Redesign

Es kommt wirklich auf Ihr Budget, Ihre Zeitpläne und Ihre Fähigkeiten an.

Ich bin ein großer Befürworter, etwas wirklich gut zu verstehen, bevor ich versuche, es zu automatisieren. Wie die anderen Poster schon gesagt haben, ist das Schneiden von Hand (Handcoding) sehr wertvoll, besonders wenn man es nicht gut versteht. Es kann jedoch sein, dass Sie nicht die Zeit investieren, die für ein gutes Verständnis des Themas erforderlich ist. Und das ist auch vollkommen in Ordnung.

Ich denke, am Ende des Tages gibt es keine "richtige" Lösung. Unterschiedliche Leute haben unterschiedliche Anforderungen, die die Wahl ändern werden.

    
Homer6 12.03.2014 22:15
quelle

Tags und Links