- ベストアンサー
ホームページを作っているのですが｡｡｡
私は、今ホームページを製作しているのですが、どうもうまくいきません。というのは、アドビのイラストレータで一応の全体イメージを作ってみたのですが、それをどうスライスして、どういったフレーム枠にしたらイメージどおりに表示されるのか、等々、分からないことだらけになってしまい、頭がパンク状態です。一応アドビGoLiveを持っているのですが、まだ未熟で分からないのです。また、色々と試そうとマクロウィーバのファイヤーワークス等の試用版もインストールしてあるのですが、これもまだまだです。 一応全体イメージをアップしたので、お手数ですが見ていただけないでしょうか？参考になるアドバイスお待ちしております。 ちなみにOSは、win98です。 イメージURL： http://ji-san.hoops.ne.jp/webimage.jpg
- georgejo
- お礼率65% (15/23)
- HTML
- 回答数4
- ありがとう数7
- みんなの回答 （4）
- 専門家の回答
質問者が選んだベストアンサー
menuと、フッダのhtmlの横軸がbodyに比べて大きさが異なっているのでずれていますね。 htmlの大きさや隙間を指定した方がいいです。 <html> <head> <title>test</title> <meta http-equiv="Content-Type" content="text/html; charset=x-sjis"> </head> <frameset rows="68,72%,60" cols="*"> <frame src="header.html" name="top" scrolling="NO" noresize marginwidth="0" marginheight="0" frameborder="NO"> <frame src="1.html" scrolling="AUTO" marginwidth="0" marginheight="0" frameborder="NO" name="middle"> <frame src="fudder.html" scrolling="NO" noresize frameborder="NO" marginwidth="0" marginheight="0" name="under"> </frameset> <noframes><body bgcolor="#FFFFFF"> </body></noframes> </html> これは縦三分割のフレームを組んだHTMLです。参考にしても成功しなかったら似たページを探してソースを参照させてもらって研究してみてください。
その他の回答 (3)
- ponpon
- ベストアンサー率19% (67/345)
#2の補足です。 "お礼"欄に見る方の事についても配慮したと言うことだったのでもうひとつ。 画面の大きさって見る人によって違うので私は作成する時は横640x500p以内を標準にしています。 画像が少々大きかったので、ちょっとだけアドバイスです。 ただ、それ自体が作品となるデザイン系のwebサイトなどはその限りではありませんから、ご参考程度になさってください。
お礼
URLを変更しました｡ http://ji-san.hoops.ne.jp/daddy_b/daddy_b.html です。
補足
どうもありがとうございます！ さっき、テスト的に作ってみたんですが どうも、変な隙間みたいのができてしまいます｡ どうしたら、ちゃんとくっついてくれるのでしょうか？ http://ji-san.hoops.ne.jp/daddy_b.html に、アップしたんですけど、どうも。。。。(>_<)ゞグスッ HP製作は、難しいですね。。。 よかったら、アドバイスください｡ よろしくお願いします｡
- ponpon
- ベストアンサー率19% (67/345)
フレーム枠を4つに分けて考えたら良いと思います。 ＿＿＿＿＿＿＿＿＿＿＿ | | | ヘッダ | ____________________ | | | | メ| BG="#000000"| | ニ| (黒) | | ュ| | _____________________ | フッダ | _____________________ ヘッダとフッダとメニューを全ページに残して黒画面にコンテンツ(内容)を載せてはどうでしょうか。 その場合、画面上に4つのHTMLを作成し、それを配置するindex.html(仮)を作成します。 ヘッダとフッダは一枚の画像では大変重いので画像をphotoshop等で10k程度の重さに区切ったものを用意し、 それぞれのhtml上で作成したテーブルの枠に配置します。その際、枠の太さは<border="0"(無線)>にしないと、境目が出てしまいますので気をつけてください。 メニューは、やはりテーブルを組んだ後、それぞれの画像に<a href="URL"border="0" alt=･…>画像</a>のようにリンクを貼り、そこをクリックした時に黒バックのところに各htmlが表示できるようにすれば良いと思います。 黒バックですが、これはバックグラウンドに1ピクセルの画像を貼りつけるのでも良いし、純黒だったらbgcolorでしてしまったほうが良いでしょう。 フレームや、そのindexの作成方法等は書ききれないので webや本で学んでください。 これは、私が勝手に1番簡単な方法としてあげているだけで、他にも沢山の技法がありますので、一意見として参考にしてくださいね。 出来るようになるととても楽しいと思います。がんばってください。
お礼
ありがとうございます！！ フレームについては、勉強したばっかりなので 使ってみたいと考えていました。 ponponさんの方法で挑戦してみたいと思います！！ ありがとうございました！！
- ynaito
- ベストアンサー率21% (7/32)
イメージ見てきました。 大きなイメージを分割し、フレームを切って再構成するのは、なかなか難しいです。ブラウザによって、OSによって、フレーム境界の処理が微妙に異なるせいです。 コンテンツの中身がそれほど多くなく、フレームの使用が必須でないなら、GoLiveの「フローティングボックス」を使って、でかい絵をそのまま置いた上に、テキストのフローティングボックスを重ねてやるのも一法です。
お礼
さっそくのお返事ありがとうございます！ しかし、残念なことに画像が重すぎてしまい 見ていただく方々にちょっとストレスを感じさせて しまうのではないかと思い、フレームや、スライスなどの 技法を使ってやってみたいと思います。 ynaitoさんの意見は、今後、ほかのHPを作っていくのに 役に立ちそうで、大変感謝しております。 ありがとうございました。
関連するQ&A
- ファイヤーワークスでのスライス
ファイヤーワークスでスライスを切ってイメージとテキストに分けています。 かなり大きな画像でスライスもかなりの数になっています。 こうなると、スライスに切ったはずの部分が認識できずにHTMLを書き出したとき、その部分の画像がなくなっていたり、挿入したはずのテキストが表示できなくなったりします。これはファイヤーワークスのバグでしょうか？ それとも単にメモリが足りないとか？ ただし、その画像を半分にして別々の画像としてスライスし、書き出した場合は問題なく書き出すことができます。 OS：Win2000Pro / メモリ：512MB / FW Ver4
- 締切済み
- グラフィックソフト
- HP作成『フレームページが表示されない』
Adobe GoLive6にてHPを作成しています。 フレームページを作成したところ、Safariでは問題なくみることができるのですが、Internet Explorerではページ全体が表示されません。 どのようなことが原因でしょうか？ よろしくおねがいします。
- 締切済み
- その他（インターネット・Webサービス）
- Dreamweaverの機能について
WEBの製作でアドビ社の「GoLive」を使用しています。将来、マクロメディアの「Dreamweaver」も使用したいと考えております。「Dreamweaver」に「GoLive」の「レイアウトグリッド」みたいな機能はあるのでしょうか？（ページ上にテキストやフレームを自由に配置できるみたいな）あと、最近のオーサリングソフトは「ムーバブルタイプ」にも対応しているのでしょうか？
- ベストアンサー
- ホームページ作成ソフト
- パソコン（ヤフーメール）からｉモードの携帯に写真を送りたいのですが。
ヤフーメールから、携帯のｉモードに写真を送りたいのですが、できますか？写真編集ソフトは、フォトショップ（エレメンツ）とフォトショップＣＳ、ファイヤーワークス、AdobeイメージリーダーＣＳとイラストレーターＣＳなどを持っています。よろしくお願いします。
- ベストアンサー
- その他（メールサービス・ソフト）
- ホームページ製作前のWEBデザインの必要性ついて
ホームページ製作前のWEBデザインの必要性ついて ホームページ製作前にはfireworksやphotoshopなどを使って、 ページ全体のデザインを実際に絵として書くものなんでしょうか？ 確かに、デザインしたあと、fireworksのスライス機能で画像を切り出せば あとは、配置するだけなのでやりやすいと思うんですが、 先に髪で手書きでページのレイアウト（枠組み）だけ描いて、XHTML+CSSでレイアウトだけ 作り、そこに配置すべき画像があれば、GIMPやfireworksであとから必要なサイズの 画像を作る。という手順では駄目なのでしょうか？ ちなみに作ろうとするホームページはクライアントから受注するものではなく、 自分の会社（事務所）のホームページを作ろうとしています。よって デザインの提出ご提案などは必要ありません。 なぜ、こんなことを聞くのかというと、ネットでいろんな素人さん（一般人）の ホームページを見ていても、デザイン的によくできているなぁっと思うからです。 中にはデザインテンプレートを使用しているんだな。と分かるものもありますが、 そうでないものもあります。果たして彼らのホームページはみなさん一から ページデザインをfireforksなどで手間をかけて作ってからスライスしていったとは 思わなんで（プロならそうやるんでしょうけど） 製作手順としてどうやっているのかなーと思ったのです。 レイアウト（枠組）みは出来てもそこに配置すべき画像（ロゴ・タイトルバー・メニューバーなどのデザインがなかなかいいのが思いつきません。ネット上のフリーWEB素材だと 自分たちのホームページのイメージと合わなかったりするものが多いので。 本当は、必要となるサイズの画像が単品単品で欲しいだけなんです。 ここにこんなサイズのメニューボタンやタイトルボタンを入れたいから、 画像のパーツだけ作ってくださいみたいな注文ってWEB製作会社にできるんでしょうかね？ ページ全体を発注するつもりはありません。 よろしくお願いします。
- ベストアンサー
- ホームページ作成ソフト
- WEBデザインでのソフトの使い分け
現在WEBデザインの仕事をしていますが、グラフィックやページのデザインで皆さんはどのソフトをどのように使い分けていますでしょうか？ 私はデザイン案をイラレで作成したものを、フォトショにコピー&ペーストで貼り付けて書き出したり、見出しなどの文字列の画像などはフォトショで個別に作り直しているのですが、結構手間が掛かってしまいます。ファイヤーワークス（以後FW）も使えるので時々FWでデザインで作成しスライスで書き出すと言うこともやるのですが、明らかにこちらの方が効率的ではあるのですが、イラレほどにデザインが自由にできないため（点線を掛けないなど）、どうも製作のたびにソフトの使い分けで悩んでしまいます。 皆さんはどのように使い分けていますか？
- 締切済み
- デザイナー・クリエイティブ職
- Webページでタブのような画像を表示させたい
こんにちは。 Webページ作り初心者です。 タブのような画像を表示させたいと思いました。 イメージ的には http://www.apple.com/jp/ Appleのトップページの上のほうにあるような、あんな感じ。 あれを作るためには画像をどのように用意してどのように貼り付けるのが楽なのでしょうか？ 全部ひとつの画像でまとめて作ってから切り分けているのか（Photoshopではスライスというのですよね？）、それともそれぞれの画像ファイルをバラバラに用意してからブラウザできれいに表示できるように並べているのか（継ぎ目がスムースに見えるようにするためにはどんな工夫が必要なんだろう？）、ナド。 また、どのタブがアクティブになっているのかによって見た目が変わるので、同じタブの画像でもアクティブになっているバージョンとなっていないバージョンとで、2種類の画像を用意する必要がありますよね？ そんなことはないのでしょうか？ えと、AdobeのCreative Suite 2を持っているので、Photoshop、Illustrator、GoLiveがそろっています。 GoLiveは最近使い始めたばかりなので微妙ですが、PhotoshopとIllustratorなら使えます。 回答よろしくお願いします。
- ベストアンサー
- グラフィックソフト
- 至急！！助けてください！ ｈｔｍｌファイルについての質問です。
至急！！助けてください！ ｈｔｍｌファイルについての質問です。 現在、勉強しながらHPをつくっています。環境が古いのですが、MAC環境で、イラストレーターでページ全体を作って、 フォトショでスライスで切って、web用に保存し、リンクや画像の貼り付けなどをGoLive4.0で行い、CSSや、 インラインフレームなどをGoLive上でソースの手打ちを行っています。 アップはwindousで、FTTPを使いupしているの状態です。 質問の内容はGoLive上で手打ち又はフォトショで作られたソース（タグ）がFTTPを介してweb上で確認すると、タグが乱れて、 表示がぐしゃぐしゃになってしまいます。 これはどうして起こるのか？ どうすれば直るのか教えてください。 現在はおかしくなった箇所をもう一度GoLiveで開いてソースの打つ直しをしてもう一度確認すると、 今度は他の場所のタグがおかしくなってしまい。を繰り返し、原型をとどめてなく、途方にくれております。 どなたかご指南ください！ -------↓こんな感じです↓-------- 初めに作っておいたもの↓ <div id="syouhin-35"> <a href="000000.html"><img src="images/syouhin_35.jpg" width="91" height="20"alt="にんじん" border="0"></a></div> 保存してFTTPに入れてからWEBで確認。又はGoLive上でソースを開き直すと↓ <divid="syouhin-35"> <a href="000000.html"><img c="images/syouhin_35.jpg" width="91" height="20" lt="にんじん" border="0"></a></di みたいな… なぜか、きちんと打ってあったものを一度保存して、もう一度ソースを開いて確認するとすこしずつ、おかしくなるんです。 わかりずらいかもしれませんが、教えてください。＜head>内でスライスで切った画像をCSSで指定はしています。 <html>や<head><body>等もきちんとしていますし、タグもGoLive上では正しい状態になっていることは確認して保存しています。 しかし、FTTPを介してweb上（windos)で確認すると、なぜか、指定したCSSやタグ名の一部が <div id="syouhin-35">→<divid="ouhin-35"> に変っていたり、最後の</body>や</html>も、打ち込んであったのに消えてしまっていたりする状態です。
- ベストアンサー
- HTML
- WEB製作に関するソフトの設定について
WEB製作に関するソフトの設定について こんにちは。 現在WEB製作に、フォトショップCS2とファイヤーワークス8を使っています。 最近まで特に気にしていなかったのですが、 どちらのソフトも「解像度」の設定があると思うのですが、 ここについての推奨基準はどのようになっているのでしょうか？ 私の現在の状況は、両ソフトとも解像度は「72ピクセル/インチ」となっています。 これで正しいのでしょうか？ また、「画像補間方式」や「イメージサンプリング」として、 「バイキュービック」「バイリニア」「ソフトにアレスト」「ニアレストレイバー」などがあり、 これはなにを意味し、どのような影響が出るものなのかがちょっと解りません。 ※現状はバイキュービックです。 「より、精細な画像を作りたい！」など、クオリティに関わる設定を行いたい場合は、この辺りの設定をいじるものなのでしょうか？ ぼやけた質問で申し訳ありませんが、どなたかご指南頂けますでしょうか！？
- ベストアンサー
- ホームページ作成ソフト
- Adobe GoLiveでのリンク先一括変更。
Adobe GoLiveを使用してHPの作成をしているのですが、作成したHP内の共通画像の リンクURLを、全体で一括変更するにはどのようにしたらよいのでしょうか？ 例えば、作成したHPの中に HP-A.htmlとHP-B.htmlとの二つがあったとして、 共通の画像(gazou1.jpg)が一つあったとします。この画像に割り当てたURL を変更するのに今はHP-A.htmlとHP-B.htmlを それぞれのを開き、画像のURL をそれぞれ変更しています。 実際にはこれを10ページ以上しています。 これが大変てまなのですが、これを一括変更する方法ご存じの方どうかご教授 ください。よろしくお願いします。
- ベストアンサー
- その他(ソフトウェア)
お礼
色々とどうもありがとうございました！！ ここで、回答をいただいたものを参考に色々と 挑戦・研究していきます。なんだか、ホームページ作成が 楽しくなってきました。 お答えいただいたponponさんynaitoさんには、大変 感謝しております。 特に、ponponさんには、大変お手数をお掛けいたしました。 本当にどうもありがとうございました。