こんにちはゲストさん。会員登録(無料)して質問・回答してみよう!

解決済みの質問

webサイトのデザイン方法について

webサイトのデザイン方法について

自分はillustrator photoshop dreamweaverを使ってwebサイト制作を勉強しております。

最初に全体のデザインをillustrator上で作って、使用した画像を個別にphotoshop illustratorでgifなどのファイルに書き出してdreamweaverで組み立てています。

しかしこんなやり方は効率が悪いのではないかと不安になります。(illustrator上でデザインしても、その画像の大きさはdw上のメモ

リを参考に大体で決定しています。)

illustrator上でpx数を決定して、全くそのデザイン案通りに作業を進めていくような上手なやり方を知りたいです。

fireworksというソフトは持っているのですが使ったことがありません。

みなさんのデザインの行程を是非詳しく教えていただきたいです。

例えば、まずは、illustratorで ~px × ~pxのドキュメントを新規作成して~~~という風に教えていただけたら幸いです。

fireworksを使っている人や使っていない人の両方の意見をお聞きしたいです!

よろしくお願いします!

投稿日時 - 2010-08-24 17:13:00

QNo.6132435

困ってます

質問者が選んだベストアンサー

私はPhotoshopでデザインをつくり、それをそのままスライスして名前を付け書き出しています。それをDWでコーディングします。

Photoshopでは1000pxのアートボードに800px幅でデザインをつくります。
この幅(800px)の設定は、デザインの参考に見たサイトに多いサイズだったからです。

Photoshopでは角丸がきれいにできなかったり、イラストをつくりにくいので、Illustratorで部品をつくってPhotoshopに持ってくることはあります。

私の友人はPhotoshopよりIllustratorの方が得意なので、大きなアートボードにデザイン幅(たとえば800px)でデザインをつくり(要は実物大のデザインをイラレで作り)、画面を100%にしてキャプチャで撮って、Photoshopでスライスしていました。
ただこの方法は部品の修正が面倒です

前の回答の方の幅の設定の仕方、私も参考になりました。ありがとうございました。

投稿日時 - 2010-08-26 21:47:49

お礼

大変わかりやすいご回答ありがとうございました。
現在はphotoshopでカンプを作る勉強をしています。
要所要所でilllustratorを使ったほうが効率がいいですね。

投稿日時 - 2013-12-02 09:00:33

このQ&Aは役に立ちましたか?

0人が「このQ&Aが役に立った」と投票しています

回答(2)

ANo.1

普段Photoshopでデザインカンプ→コーディングを行ってるものですが

大体左右幅960でカンプを起こしてます。
その後、スライスして埋め込みます。

960pxの数値は約数が多いことと
1024×768の解像度のディスプレイで余白が多すぎない というのを基準に決めています。

800×600を考慮する場合、横幅760pxにするといいと思います。

投稿日時 - 2010-08-25 11:12:09

お礼

大変参考になりました。
ありがとうございました。

投稿日時 - 2013-12-02 09:01:19

あなたにオススメの質問