いつも有り難うございます。
HPの管理もどきのようなことをやっている個人事業者です。(独学レベルです。)
イラストレータでページ自体(.ai)を作成されたデータがあります。
これをweb上に公開・管理運営するように依頼されました。
質問は、どのような手順で行えば良いか、です。
・ページは全体で8枚ほどです。(それぞれ.aiで作成されています。)
・デザインは崩したくないです。
・ページをトップページからリンクでつなげます。
(その他、ページ内のイラストや文にもリンクを付けたいです)
・写真が50枚程度あり、またこれからも不定期で更新していきたい。
・写真は拡大したい (HPビルダーでの作成・操作はできます)
・持っているソフトはHPビルダー10、イラストレータ9.0
現在思い浮かんでいる手順は、
イラレ上で、ページ内のイラストや文面を細かくデータに分割・保存 → HPビルダーで配置し直し、リンク作成(htmlファイル作成) → アップロード
この手順は、非常に作業に手間がかかり過ぎるように感じています。
技術的には、タグが多少解っており、CSS等が使いこなせていないレベルです。 他の質問や各ソフトの紹介解説をみても、私の状態にあうかどうかが良くわかりません。 ご回答いただけるとありがたいです。
No.3ベストアンサー
- 回答日時:
Photoshopを使った場合も基本的には同じような感じです。
先程、紹介したURLに載っているように、
・データ書き出しでPhotoshop形式で書き出す。
・そのデータをPhotoshopで開いて、ツールパレットの一番したのボタン押してImageReadyに渡す。(直接ImageReadyで開いてもいい)
・ImageReadyのスライスツールでパーツごとに分ける。
・あとは、JpegやGIFで書き出す。一応HTMLも書き出してくれます。
・それをビルダーで編集
↓ImageReadyでのスライス例
http://www.too.com/ec/tutorial/slice/index.html
ようはIllustratorで個別にWeb用に保存としていたのを後からやっているだけ。
ImageReady使えるようになれば、ロールオーバー(マウス重ねると絵が変わる奴)やアニメーションGIFが作れるようになります。
ビルダーでも出来るかもしれませんが。
繰り返しになりますが、印刷物と違って、Webページは見る側の環境に大きく左右されるので、レイアウトにはズレが生じます。
どうやるにしても、Illustratorのデータを100%再現するのは難しいです。
SEOやアクセシビリティを考慮しないなら、FlashやPDF、画像にすることで100%再現する事はできますが…。
どんなソフト使うにしても、貴方が思い浮かべていた手順のように、
ボタンや見出し等の装飾されたもの、写真やイラストをJpegやGIFで保存して、文章は一旦Illustratorからメモ帳等にでもコピー&ペーストしておいて、
Illustratorのレイアウトを参考にして、
ビルダーで新規にレイアウトを作り、適切に配置するしかありません。
CSSを使えば、ある程度レイアウトを制御できますが、ブラウザによって解釈が異なるので、ちゃんとやらないと悲惨なことになります。
相手には印刷物とwebページは全く違う事を説明をしておいた方がいいでしょうね。
dezimacさま
再度の詳しいご回答ありがとうございました♪
私の知りたかったことが、すべて聞けたようです。 そしてスマートな説明で、本当にわかりやすかったです。
重ね重ねありがとうございました!
依頼主とこのtopicをみて、相談しながら、これから先を考えていきます。
また次回、よろしくお願いします~(^o^)/
No.2
- 回答日時:
ちょうど同じ悩みがあります。
私も今、友人のホームページを作っています。
実は広告系のデザイナーなので、初めて今回HPを作りました。
やっぱり使い慣れている、イラストレータでラフを作りました。
(友達にもそのラフを見せてデザインの了解を得ました)
ところが、そこからWeb用にデータを作るのが、ほんとに大変でした。ぜんぜん再現できないのです。
問題1
オブジェクトの重なりがフレームに落としこめない。
私はできるだけ、一枚のjpgに書き出して、背景で配置しています。
(flashをつかうとできるらしいのですが・・時間も無く。)
問題2
フォントの行間が、設定できない。種類も選べない。
(これはCSSで対処できました。でも字間は無理みたいでした)
問題3
写真を切り抜いて、重ねることはできない。
(私の技術ではです・・)
文字はなんとかなりそうですが、問題はフォトショップが無いことですね。使いやすい画像ソフトがあればいいのですが・・無料のものでもjpgが作れればいいと思います。プロじゃないし。
動かないところはできるだけ、1枚背景にしてしまうことをお勧めします。リンクがある文字だけ別で作るのはどうでしょうか?
(更新を自分でやる前提で)まずはテキストを除いて、イラストレータでjpg書き出してみてはどうでしょうか?
それを画像ソフトで適正な処理をするのです。
まったくの素人意見です。私もいい解決法を探しているところです。
早速のご回答ありがとうございました。
同じ悩みをお持ちでしたか!
このように問題点を書き出し、その結果を書いていただいただけで、とってもすっきりいたしました。 ありがとうございます。
依頼主と共に、このご回答を参考にさせていただきます。
ありがとうございました。
No.1
- 回答日時:
Photoshop(に付属のImageReady)があればいくらか楽なんですがね。
パーツ単位でWeb用に保存して、ビルダーで配置し直して再構成するしかないと思いますよ。
Illustratorはボタンとかのパーツを作るには適していますが、もともとWebページをレイアウトするソフトじゃないですからね。
チラシとか印刷物を作るならIllustratorでいいけど。
Webページは印刷物と違って見る環境にも影響されるので、PDFやFlash、画像にでもしない限りレイアウトは多少なりともズレてきますね。
http://www.too.com/ec/tutorial/t2_2/ai9web1.html
早速のご回答ありがとうございました。
書きそびれましたが、photoshop5.5 を持っています。
ただほとんど使用したことがなく、今までの画像処理でしたらMSofficeのPictureManagerなどで事足りていました。
photoshopを利用する場合は、どのような手順になるのでしょうか?
よろしければ引き続きご回答いただけるとありがたいです。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- Mac OS Macで今あるファイルの連番(ページ番号)に足し算をしてリネームしたい 1 2022/10/12 17:22
- 英語 会社で英語を使うことになっての英語の勉強方法 5 2022/07/03 11:49
- ホームページ作成・プログラミング ログインしないとみることができないWebページの作成方法 3 2023/07/29 13:33
- HTML・CSS WEBサイトの構築。表示データとWEBデザインを分離する考え方を専門用語・業界用語では何と言うか? 8 2022/09/27 09:16
- その他(プログラミング・Web制作) パイソンでのプログラミングについて 3 2022/08/11 20:31
- ドメイン・サーバー・クラウドサービス 自作サイトをサーバーにアップロードしたのですが… 2 2022/11/08 18:12
- その他(IT・Webサービス) WEBサイト内のファイルを探す方法は? 1 2022/11/11 16:38
- PHP ここでの ②if($su_d<>"")の比較演算子 を使う理由は 1 2022/03/26 02:33
- ホームページ作成・プログラミング ホームページ月額更新管理費用 4 2023/04/22 12:38
- PHP htmlspecialcharsが機能していないです。 バグですか? 1 2022/04/05 01:22
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
一太郎のレイアウト枠がずれて...
-
HPビルダー。レイアウト枠がブ...
-
HPビルダー8でレイアウトの重なり
-
Wordの文字削除ができない
-
【テプラの使い方で】複数行の...
-
ワード ヘッダ下部とフッタ上...
-
テプラで2行目の文字を大きく...
-
WinMergeの色設定
-
PhotoShopで任意の色数に減色し...
-
Excel 行列番号のハイライト色...
-
Excelのヘッダー表示を変数で指...
-
検索窓のフォントの大きさを変...
-
ホームページビルダー リンク...
-
エクセルのグラフ データテー...
-
ホームページビルダー作成にて...
-
macとwinで色の見え方が違う、...
-
絵具を混ぜて作ったときの色を...
-
イラレでCMYKをDICに変換すると...
-
見本のCMYKとIllustratorのDIC...
-
DICとIllustratorについて教え...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
一太郎のレイアウト枠がずれて...
-
DREAMWEAVERによるレイアウト作...
-
ホームページ製作前のWEBデザイ...
-
ファイルメーカー5で2列の一...
-
ホームページビルダーでワード...
-
GOLIVE5.0 レイアウト画...
-
ホームページビルダーで、レイ...
-
イラストレータレイアウト(デー...
-
ワードでweb形式で保存するとき...
-
HPビルダー8でレイアウトの重なり
-
ファイルメーカーでレコードの...
-
ホームページの表示がおかしい...
-
ジャストホーム2で
-
HPビルダー16で固定レイアウト...
-
Firefox プラグイン for 紙copi...
-
ホームページビルダー7で作った...
-
Dreamweaver8のレイヤー、DIVタ...
-
ソフト上の画像と別の画像がア...
-
CSSレイアウトってなぜこんなに...
-
hd tune 2.55 の画面が切れてい...
おすすめ情報