ここから本文です

ホームページ制作の手順を教えて下さい。 まず、Fireworksでページの構成を作る?...

zak********さん

2014/10/1413:35:28

ホームページ制作の手順を教えて下さい。
まず、Fireworksでページの構成を作る?
次に、Dreamweaverで、HTML化する?
画像は、Photoshopで編集する?

以上の手順で合ってますでしょうか? Fireworksでページを構成した後、どのようにしてDreamweaverに移動させるのか? 教えて下さい。

閲覧数:
83
回答数:
3

違反報告

ベストアンサーに選ばれた回答

tam********さん

2014/10/1414:20:24

ケースバイケースだったり、人によって違うかもしれませんが、私の場合

1.企画、構成の整理。
先ず手書きで紙に書きますが、サイトマップを作ります。具体的に言うと、最初トップページが有り、「ボタン1を押せばページ2に行く。」「2ページ目のボタンaを押せば、2-aページに行く」等、をまとめます。
こうする事で
・全部で何ページになるか?
・伝えたいコンテンツは全て有るか?
・同線が煩わしい物になっていないか?
等を考えて必要に応じてページを統合したり、増やしたりします。

2.各ページのレイアウトを考える。
いきなり完成図を作るのではなく、各ページ毎に
・ロゴやボタンはこの位置に置く。
・バナーはこの位置の置く。
・テキストはこの位置から書く。
・マウスを乗せるとこうなるなどのギミックを考える。
等、大まかな骨組を作ります。

1と2の項目は自分一人や仲間内さえ分かればいい状況なら手書きの紙で適当に済ませますが、依頼者がいる場合はこの工程をパワーポイントにまとめて、クライアントの了承を得たり、修正します。(クライアントもこの段階からイメージができる様になるので少しずつ要望が出てきます)

3.具体的なデザイン案
もし、完成したらこういう図になる。と具体的な一枚絵を作ります。この工程に入って初めてPhotoshop、Illustrator、Fireworksの出番になります。どのソフトを使うかと言うのはやり易い物で結構です。この段階で画像イメージは全て作ります。
完成図を見せてOKが出たら次の工程に進みます。

4.スライス作業
3の段階で作った画像データを「スライスツール」を使って切り分け、バナーやボタン等をパーツ毎に独立した画像ファイルにします。この時切り方が雑だと後の作業に影響が出るので丁寧に切る。

5.コーディング作業
この段階でDreamweaver等、テキストエディターやオーサリングソフトを使い、実際にHTMLやCSS等のプログラムを書いていきます。そして、サーバーにアップする事で完成します。

※4の段階でスライスした物を書きだす時、グラフィックソフトが自動でhtmlも記述した形で書いてくれる機能が有りますが、はっきり言って使い物になりません。ソース文がぐちゃぐちゃでひどいです。

6.アフターケア
間違いが有れば対応したり、更新業務を担当したりして運営をしていきます。


と大体この様な流れになります。
ですので、「グラフィックソフトで作ったデザイン画をDreamweaverに持っていく」という考えより、「グラフィックソフトで作ったデザイン画をHtml、CSSを使って再現する」と言う考え方の方が妥当です。その再現するソフトで業界で一番浸透しているのがDreamweaverですが、このソフトはHtml、CSSを扱える人が使う事を前提としており、Dreamweaverを使いこなせればホームページを作れるという代物では有りません。その為、何も知らない素人の方には敷居が高いかもしれません。
もし、分からないならDreamweaver と言うより HTML、CSSの学習をされた方がいいです。

質問した人からのコメント

2014/10/14 15:14:50

詳しくありがとうございます。

ベストアンサー以外の回答

1〜2件/2件中

並び替え:回答日時の
新しい順
|古い順

kot********さん

2014/10/1414:33:10

スライスでパーツを指定した後「書き出し」でhtmlと画像を書き出し、htmlをDreamweaverで開けば編集できます。
Fireworks上で画像を作ってあるならPhotoshopは要りません。

aki********さん

2014/10/1413:59:33

ホームページを作るだけなら、Dreamweaverだけで可能です。
また、Fireworksは必要ないでしょう。

htmlで作る場合、何も無くて作ると大変なので、テンプレートを使われると良いでしょう。
また、現在のテンプレートのほとんどがCSSで構成されてますので、それらも含めて勉強されると良いかと思います。

個人で使う分には、下記の物でも良いと思います。
Copyrightを外さず、そのまま利用すれば、問題有りません。
http://template-party.com/

みんなで作る知恵袋 悩みや疑問、なんでも気軽にきいちゃおう!

Q&Aをキーワードで検索:

Yahoo! JAPANは、回答に記載された内容の信ぴょう性、正確性を保証しておりません。
お客様自身の責任と判断で、ご利用ください。
本文はここまでです このページの先頭へ

「追加する」ボタンを押してください。

閉じる

※知恵コレクションに追加された質問は選択されたID/ニックネームのMy知恵袋で確認できます。

不適切な投稿でないことを報告しました。

閉じる