Webdesign Was soll man mit Photoshop oder Illustrator machen?


8

Was soll ich zum Entwerfen von Websites, Photoshop oder Illustrator verwenden?

Gibt es eine richtige Software oder ist es eher eine persönliche Entscheidung?


Was wird dein Inhalt sein?
SaturnsEye

Das ist in der Tat eine meinungsbasierte Frage. Es gibt viel Software zum Entwerfen einer Website. Ai, Ps, Dreamweaver, direkt im Browser. Jeder hat seine Fans und Kritiker.
Vincent

1

@SaturnsEye Ich lerne und versuche, ein Werkzeug auszuwählen.
Giannis

1
@ SaturnsEye Die Struktur, Layout
Giannis

Antworten:


7

Ich bin mit Anaksunamans Antwort in Bezug auf Photoshop nicht einverstanden. Neulich hatten wir eine ähnliche Frage, die ich beantwortete ( Organisieren von PSDs für Entwickler ), wo ich erwähnte, dass wir als Designer und Programmierer uns in dieser sich entwickelnden Ära mit dem Workflow weiterentwickeln müssen und die Verwendung von Photoshop archaisch ist und im Webdesign keinen Zweck mehr erfüllt ein wirksames Mittel zur Entwicklung. Es ist immer noch ein großartiges Werkzeug für die Fotomanipulation, aber es ist für mich sinnlos, es zur Implementierung eines Website-Designs zu verwenden.

Ich werde empfehlen (Referenz: Was sind die Schritte beim Entwerfen einer Website? ), Dass mit Illustrator ein besserer Ansatz erzielt werden kann, insbesondere mit der Verwendung von Zeichenflächen. Obwohl ich mich nicht auf das Entwerfen der gesamten Site in Illustrator beziehe, spreche ich über das Drahtmodell und das Modell. Sie sollten weiterhin im Browser entwerfen, aber wenn Sie Symbole entwerfen, können diese in Illustrator ausgefüllt und exportiert werden. Wenn Sie ein Branding oder etwas Druckbezogenes entwickeln möchten, würde ich sicherlich hoffen, dass das von Ihnen entwickelte Logo in Vektorform vorliegt und dass die Vektorform als SVG für ein skalierbares Bild im reaktionsschnellen Webdesign gespeichert werden kann. Ein einfaches Modell oder ein Symbol kann als SVG-Code exportiert und in ein XHTML-Dokument aufgenommen werden (Referenz: Ich habe eine Karte in AI erstellt, aber die Dateigröße ist als SVG RIESIG?)

Zum Thema Codierung glaube ich, dass Dreamweaver sinnlos ist und Geld verschwendet. Wenn Sie sich bei einigen Webentwicklungsunternehmen erkundigen, mit denen ich gesprochen habe, lachen sie über Dreamweaver. Es ist in Ordnung für neue Benutzer, aber Leute, mit denen ich zusammengearbeitet habe und die Dreamweaver verwendet haben, haben sich stark auf den Bereich der Entwurfsvorschau verlassen, anstatt am Code zu arbeiten, und die Code-Vervollständigung ist eine schlechte Angewohnheit für einen neuen Codierer. Sie werden sich nicht daran erinnern, wie man richtig codiert, wenn Sie die Code-Vervollständigung immer von Anfang an verwenden. Es gibt einige großartige und leistungsstarke kostenlose Code-Editoren wie Notepad ++, Text Wrangler (ich bevorzuge BBEDit, das bezahlt wird) und Sublime Text.

Ein Rückblick auf Ihre Frage "Webdesign, was ist mit Photoshop oder Illustrator zu tun?": Bei beiden Bildmanipulationen werden Photoshop und Illustrator für Logos, Modelle, Drahtmodelle, Symbole und alles verwendet, was als SVG ausgeführt werden kann. Nachdem Ihr Modell fertig ist, würde ich in einem Code-Editor arbeiten und den Rest Ihrer Site entwickeln.


1
Würde es Sie beruhigen, wenn ich Ihnen sagen würde, dass ich große Teile meiner Arbeit in GIMP, Inkscape und Notepad ++ erledigt habe? :-P
Anaksunaman

Ich benutze Gimp oder Photoshop nicht mehr viel. Ich habe festgestellt, dass ich, wenn ich Bilder bearbeiten muss, nur ImageMagick benutze und für Adobe bezahlt arbeite =)
DᴀʀᴛʜVᴀᴅᴇʀ

4

Photoshop oder Illustrator?

Ja. Und wahrscheinlich auch

  • Papier
  • Bleistifte
  • Wireframing-Tools
  • Javascript
  • html
  • CSS

Mit anderen Worten, Sie haben eine Toolbox und verwenden das richtige Tool für die jeweilige Aufgabe.


1
Das Fazit Ihrer Antwort ist richtig, aber ich habe durch das Lesen nichts gelernt. Einige konkrete Beispiele (wie in der Antwort von Darth_Vader) wären nützlich.
Stijn

3

Leider würde ich argumentieren, dass dies keine binäre Frage ist, da jedes Grafikprogramm Inhalte ausgeben kann, die auf einer Website verwendet werden sollen. In dieser Hinsicht ist es also viel mehr eine persönliche Entscheidung.

Das heißt, wenn Sie keine sofortige Codierung durchführen (nur Modelle und zu exportierende Elemente usw.), ist Photoshop bei weitem das am häufigsten verwendete Produkt. Kunden möchten oder erwarten möglicherweise, dass Sie dieses Produkt verwenden, und in ähnlicher Weise können Dritte, die an Sie liefern (z. B. wenn Sie Logoarbeiten auslagern), ihre fertigen Produkte im PSD-Format an Sie liefern. Daher wird dringend empfohlen, eine Kopie von Photoshop zu haben, unabhängig davon, was Sie täglich tun.

Für Ihre eigene Arbeit sind die Funktionen zwischen Illustrator und Photoshop ähnlich genug. Sie können Illustrator sicherlich anpassen, um Front-End-Webdesigns (die grafischen Teile) zu erstellen. Eine einfache Google-Suche ergab dieses Ergebnis für einige Grundeinstellungen für CS5, die Webdesignern helfen würden. Denken Sie daran, dass Illustrator eher auf vektorbasierte Bilder und Drucke ausgerichtet ist und daher bei der Verwendung für das Webdesign möglicherweise ein wenig über den Tellerrand hinausgeht.

Adobe Dreamweaver belegt hinter Photoshop den zweiten Platz auf der fast unverzichtbaren Liste, wahrscheinlich zumindest, wenn Sie mit Ihrem Design codieren. Für die Einstiegsarbeit mit Code (und einigen proprietären Problemen) ist Adobe Muse eine Art Alternative zu Dreamweaver. Es gibt natürlich viele andere gute Produkte, die ähnliche Dinge tun, aber auch hier ist die Popularität von Dreamweaver gefragt.

Alternativ gibt es eine Handvoll guter kostenloser Code-Editoren wie MS Visual Studio Express, Komodo und Notepad ++ (und Sie können MarkdownPad sogar für einige grundlegende Inhaltsarbeiten verwenden.) Was Sie verlieren, wenn Sie Dreamweaver nicht verwenden, ist WYSIWYG, meistens, da andere Produkte dies tun Code-Vervollständigung usw. Aber wenn Sie wirklich WYSIWYG ohne Dreamweaver wollen, gibt es auch andere Produkte.

Wenn Sie eine Nicht-Vektor-Raster-Alternative zu Illustrator wünschen, die nicht Photoshop ist, können Sie wahrscheinlich Corel-Produkte oder das Open-Source-Gnu-Bildmanipulationsprogramm (GIMP) verwenden. Das GIMP hat den Vorteil (wie die von mir erwähnten alternativen Code-Editoren), kostenlos zu sein.

Alle guten Werkzeuge, die Sie verwenden, sollten (werden) wahrscheinlich eine Art "Slice" -Option zum Exportieren endgültiger Elemente aus Ihrem Modell haben (vorausgesetzt, diese werden nicht bereits aussortiert und separat gespeichert). Abgesehen davon gibt es meiner Meinung nach nur sehr wenige "Muss" -Funktionen, außer im Namen der Zweckmäßigkeit.

Um ehrlich zu sein, könnten Sie buchstäblich Ihr gesamtes Webdesign mit MS Paint und Notepad erstellen, wenn Sie sich ausreichend auskennen ...


2

Sie können beide für das Webdesign verwenden, hängt von Ihrer Wahl ab. Wenn es jedoch darum geht, Webdesigns / Drahtgitter frühzeitig bereitzustellen, ist Illustrator für diese Aufgabe viel schneller und einfacher zu verwenden.



1

Für mich ist Illustrator zweifellos, aber Sie können mit Photoshop fast alles tun, was Sie wollen. Wenn Sie sich nicht das vollständige Creative Cloud-Paket leisten können, empfehle ich Ihnen, genügend Geld für Photoshop CC zu finden.

Wenn Sie sich die Creative Cloud leisten können, empfehle ich Folgendes:

  1. Adobe Muse CC für Drahtrahmen und Layoutdesign
  2. Adobe Illustrator CC für Symbole, Logos und andere Abbildungen
  3. Adobe Photoshop CC zum Bearbeiten und Bearbeiten von Fotos

In der Adobe-Muse geschieht die ganze Magie. Es wurde von einigen der Entwickler von InDesign erstellt und wurde so konzipiert, dass Druckdesigner Websites live im Web veröffentlichen können, ohne eine einzige Codezeile schreiben zu müssen.

Modelle müssen nicht mehr im PDF-Format vorliegen, sondern Sie können ein ansprechendes Design erstellen, mit dem der Kunde ein Gefühl dafür bekommt, wie es in der realen Welt funktioniert. Wenn Sie dennoch PDF-Präsentationen erstellen möchten, empfehlen wir Ihnen, die Chrome-Erweiterung Awesome Screenshot herunterzuladen, da Sie keine PDF-Dateien mit PNG-Dateien aus Muse exportieren können. Na ja, das weiß ich sowieso nicht?

Ich empfehle auch, dass Sie die Website irgendwann selbst codieren und nicht alles nur zum Nachdenken überlassen, da Sie auf lange Sicht eine besser erstellte Website erstellen werden.

Ich möchte auch erwähnen, dass viele Webdesigner nicht einmal Design-Software verwenden, sondern einfach von Anfang an direkt im Browser entwerfen.

Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.