Web design quoi utiliser Photoshop ou Illustrator?


8

Que dois-je utiliser pour concevoir des sites Web, Photoshop ou Illustrator?

Existe-t-il un logiciel correct ou s'agit-il plutôt d'un choix personnel?


Quel sera votre contenu?
SaturnsEye

C'est en effet une question d'opinion. Il existe de nombreux logiciels pour concevoir un site Web. Ai, Ps, Dreamweaver, directement dans le navigateur. Chacun a ses fans et ses détracteurs.
Vincent

1
En outre, sachez qu'il existe de nombreuses autres options que Illustrator et Photoshop
spirale

@SaturnsEye J'apprends et j'essaie de choisir un outil.
Giannis

1
@SaturnsEye La structure, la disposition
Giannis

Réponses:


7

Je ne suis pas d'accord avec la réponse d'Anaksunaman concernant Photoshop. L'autre jour, nous avons eu une question similaire à laquelle j'ai répondu ( Organiser des PSD pour les développeurs ) où j'ai mentionné que dans cette ère en évolution, nous, en tant que concepteurs et codeurs, devons évoluer avec le flux de travail et l'utilisation de Photoshop est archaïque et ne sert plus à rien dans la conception Web comme un moyen de développement EFFICACE. C'est toujours un excellent outil pour la manipulation de photos, mais l'utiliser pour implémenter la conception d'un site Web est inutile pour moi.

Je recommanderai (référence: quelles sont les étapes de conception d'un site Web? ) Qu'une meilleure approche peut être réalisée avec Illustrator, en particulier avec l'utilisation de plans de travail. Cependant, je ne fais pas référence à la conception de l'ensemble du site dans Illustrator Im en parlant du filaire et de la maquette. Vous devez toujours concevoir dans le navigateur, mais si vous concevez des icônes, elles peuvent être complétées dans Illustrator et exportées. Si vous souhaitez développer une image de marque ou tout ce qui concerne l'impression, j'espère que le logo que vous avez développé est en forme vectorielle et que la forme vectorielle peut être enregistrée en tant que SVG pour une image évolutive dans une conception Web réactive. Donc, une simple maquette ou quelque chose d'icône liée peut être exportée en tant que code SVG et incluse dans un document XHTML (référence: j'ai fait une carte en AI, mais la taille du fichier est ÉNORME en tant que svg?)

En ce qui concerne le codage, je crois que Dreamweaver est inutile et gaspille de l'argent et si vous demandez à quelques sociétés de développement Web avec lesquelles j'ai parlé, ils rient de Dreamweaver. C'est correct pour les nouveaux utilisateurs, mais les personnes avec qui j'ai travaillé et qui ont commencé à utiliser Dreamweaver se sont largement appuyées sur la zone d'aperçu de la conception au lieu de travailler sur le code et l'achèvement du code est une mauvaise habitude pour un nouveau codeur. Vous ne vous souviendrez pas comment coder correctement si vous utilisez toujours la complétion de code au départ. Il existe de grands et puissants éditeurs de code gratuits tels que Notepad ++, Text Wrangler (je préfère BBEDit qui est payant) et Sublime Text.

Donc, un récapitulatif de votre question "Web design quoi utiliser Photoshop ou Illustrator?": Les deux, la manipulation d'image utilisent Photoshop et Illustrator pour le logo, la maquette, le wire-framing, les icônes et tout ce qui peut être exécuté en SVG. Une fois votre maquette terminée, je travaillerais dans un éditeur de code et développerais le reste de votre site.


1
Cela vous plairait-il si je vous disais que j'ai fait une grande partie de mon travail dans GIMP, Inkscape et Notepad ++? :-P
Anaksunaman

Je n'utilise même plus Gimp ou Photoshop. J'ai trouvé que si je devais éditer des images, j'utilise juste ImageMagick et je travaille pour Adobe =)
DᴀʀᴛʜVᴀᴅᴇʀ

4

Photoshop ou illustrateur?

Oui. Et aussi probablement

  • papier
  • des crayons
  • outils de wireframing
  • javascript
  • html
  • css

En d'autres termes, vous avez une boîte à outils et vous utiliserez le bon outil pour la tâche particulière à accomplir.


1
L'essentiel de votre réponse est correct, mais je n'ai vraiment rien appris de sa lecture. Quelques exemples concrets (comme dans la réponse de Dark_Vader) seraient utiles.
Stijn

3

Malheureusement, je dirais que ce n'est pas une question binaire car tout programme graphique peut produire du contenu à utiliser sur un site Web. À cet égard, il s'agit donc bien davantage d'un choix personnel.

Cela dit, si vous ne faites aucune sorte de codage immédiat (juste des maquettes et des éléments d'exportation à utiliser, etc.) Photoshop est de loin le produit le plus utilisé. Les clients peuvent souhaiter ou s'attendre à ce que vous utilisiez ce produit et de même, les tiers qui vous livrent (comme si vous sous-traitez le travail de logo) peuvent vous livrer leurs produits finis au format .psd. Il est donc fortement recommandé d'avoir une copie de Photoshop indépendamment de ce que vous choisissez de faire au jour le jour.

Pour votre propre travail, les fonctionnalités entre Illustrator et Photoshop sont suffisamment similaires, vous pouvez certainement adapter Illustrator pour produire des conceptions Web frontales (les parties graphiques). Une simple recherche Google a révélé ce résultat pour certains paramètres de base pour CS5 qui pourraient aider les concepteurs de sites Web. N'oubliez pas qu'Illustrator vise plus directement les images vectorielles et l'impression, il peut donc nécessiter un peu de réflexion en dehors de la boîte s'il est utilisé pour la conception Web.

Adobe Dreamweaver arrive en deuxième position derrière Photoshop sur la liste presque incontournable, probablement, au moins si vous allez faire du codage avec votre conception. Pour le travail d'entrée de gamme avec du code (et certains tracas propriétaires), Adobe Muse est une sorte d'alternative à Dreamweaver. Il existe bien sûr de nombreux autres produits fins qui font des choses similaires, mais encore une fois, la popularité choisit Dreamweaver.

Alternativement, il existe une poignée de bons éditeurs de code gratuits tels que MS Visual Studio Express, Komodo et Notepad ++ (et vous pouvez même utiliser MarkdownPad pour certains travaux de contenu de base.) Ce que vous perdez en n'utilisant pas Dreamweaver est WYSIWYG, principalement, car d'autres produits ont complétion de code, etc. Mais si vous voulez vraiment WYSIWYG sans Dreamweaver, il existe également d'autres produits.

Si vous voulez une alternative raster non vectorielle à Illustrator qui n'est pas Photoshop, vous pouvez probablement utiliser les produits Corel si vous le souhaitez ou le programme open source Gnu Image Manipulation (GIMP). Le GIMP a l'avantage (comme les éditeurs de code alternatifs que j'ai mentionnés) d'être gratuit.

Tous les bons outils que vous utilisez devraient (auront) probablement une sorte d'option "tranche" pour exporter les éléments finaux de votre maquette (en supposant qu'ils ne sont pas déjà triés et enregistrés séparément). En dehors de cela, il y a très peu de fonctionnalités "incontournables" à mon avis, sauf au nom de la commodité.

Pour être honnête, vous pourriez littéralement faire toute votre conception de sites Web avec MS Paint et le Bloc-notes si vous étiez suffisamment versé ...


2

Vous pouvez utiliser les deux pour la conception Web en fonction de votre choix, mais lorsqu'il s'agit de fournir des conceptions Web / cadres de fil tôt, Illustrator est beaucoup plus rapide et plus facile à utiliser pour cette tâche.



1

Pour moi, Illustrator est haut la main, mais vous pouvez faire presque tout ce que vous voulez avec Photoshop et si vous ne pouvez pas vous permettre le package cloud créatif complet, je vous recommande d'essayer de trouver suffisamment d'argent pour Photoshop CC.

Si vous pouvez vous permettre le cloud créatif, je recommande ce qui suit:

  1. Adobe Muse CC pour le cadrage filaire et la conception de la mise en page
  2. Adobe illustrator CC pour les icônes, logos et autres illustrations
  3. Adobe Photoshop CC pour manipuler et éditer des photos

Adobe muse est l'endroit où toute la magie opère. Il a été construit par certaines des personnes qui ont construit InDesign et il a été conçu pour que les concepteurs d'impression puissent publier des sites Web en direct sur le Web sans écrire une seule ligne de code.

Les maquettes ne doivent plus être au format pdf, vous pouvez plutôt créer un design réactif que le client peut vraiment comprendre comment cela fonctionne dans le monde réel. Mais si vous souhaitez également créer des présentations PDF, je vous suggère de télécharger l'extension Chrome Awesome Screenshot car vous ne pouvez pas exporter le PDF de fichiers PNG depuis Muse; eh bien pas que je sache de toute façon?

Je recommande également que vous finissiez par coder le site Web vous-même et ne laissez pas tout cela simplement pour réfléchir car vous créerez un site mieux construit à long terme.

Je tiens également à mentionner que de nombreux concepteurs de sites Web n'utilisent même pas de logiciels de conception, ils conçoivent simplement directement dans le navigateur, dès le début.

En utilisant notre site, vous reconnaissez avoir lu et compris notre politique liée aux cookies et notre politique de confidentialité.
Licensed under cc by-sa 3.0 with attribution required.