これからの季節に親子でハイキング! >>

今までは1コづつ単体でボタンを作り(イラストレーターで)ホームページビルダーに貼り付けてリンクを挿入してホームページを作成していましたが、ボタンを単体ではなくナビゲーションバーに作り変えたいのです。作業工程を教えてください。
ナビゲーションバーってもしかして素材を同じ色・大きさで作って並べてるだけ?
素材作成ソフトはフォトショップかイラストレーターです。そしてImage Readyも必要でしょうか?使ったことないですが、あります。
オンマウスでロールオーバーさせたりしたら分りやすい見だしになる
と思うのですが・・・Image Readyで出来るのですか???
はてなマークばかりですいませんっ
よろしくお願いします。

このQ&Aに関連する最新のQ&A

A 回答 (3件)

PhotoshopとImageReadyを連携させて、メニューバーや画像などいっぺんに作って、一つの大きな画像を、ImageReadyでスライス(分割)して、それぞれにロールオーバーなどの動きを作り、書き出す(保存する)と、分割された複数の画像とロールオーバーなど用の画像ができます。

HTMLを同時に作成することもできますので、私の場合は、Deamweaverにコピペして、ロールオーバーのスクリプトなどを設定し直しています。
    • good
    • 0
この回答へのお礼

ありがとうございます。
Photoshopで作ってImageReadyに貼り付け効果を付けていくのですね。
実はまだまだ初心者でして、最近ようやくPhotoshopって画像の加工だけでないんだと気付いたレベルなのです。
今回初めてシェイプでボタンを作って並べてナビゲーションバーにしてみようと思い立ちまて・・・
ImageReady開いてみました。
Photoshopで作った素材を貼り付けて色々やってみてだめで閉じてしまいました・・・スライスの意味すら分らないので勉強します。
目標はImageReadyを使用してよりアクティブなページを作れるようになる事です!ありがとうございました。

お礼日時:2007/01/31 00:36

> 並べてるだけ?


そうです。
|項目1|項目2|……
と並べているだけです。
統一感出したいなら文字を入れないボタンを一つ作って、
それをコピーして文字入れればいいです。

ロールオーバーの作り方は検索すれば、解説(図解)しているページがいくらでも見つかるから、それを参考に。
ここで言葉だけで説明するよりその方が判りやすいでしょう。
http://www.google.co.jp/search?hl=ja&q=ImageRead …
    • good
    • 0
この回答へのお礼

ありがとうございます。
適当にボタン作って並べてみました。
出来ました。
ボタンに影とかつけると若干背景がお邪魔するので今後の課題です。
初心者なのでコピペも画面睨み付けて場所狂わないように必死です。
(同じ場所でテキスト作らなきゃロールオーバーがずれるって思い・・・)
頑張りたいです。
ありがとうございました。

お礼日時:2007/01/31 00:44

私もホームページを作っていて、ナビゲーションバーを付けています。


…が、ナビゲーションバーって呼ぶ程の代物ではないです。(笑)

>ナビゲーションバーってもしかして素材を同じ色・大きさで作って並べてるだけ?
私はそうですね。(笑)
他に作り方が思いつかなかったので、そうしてます。
正式な作り方があるのかは知りませんが、これで困った事とかはないですよ。
    • good
    • 0
この回答へのお礼

ありがとうございます。
性格上少しづついろんなものかじっている次第で・・・どれも中途半端で今回も突如ナビゲーションバーが気になりまして、自分のページにも取り入れようと必死です。
そして質問させていただいたとおり同じ素材を並べる手法でナビゲーションバー完成しました!
ロールオーバーボタンもテキスト色と背景変えて作って動かしてみたらうまくいっちゃいました。うれPです!!!
きっと複雑なロールオーバー(ポップアップメニューとか)になるとImage Readyでスライス使って・・・ということになっていくんだと勝手に結論付けています。
念願のナビゲーションバーデビューです。
ありがとうございました。

お礼日時:2007/01/31 00:59

このQ&Aに関連する人気のQ&A

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!

このQ&Aを見た人はこんなQ&Aも見ています

このQ&Aを見た人が検索しているワード

このQ&Aと関連する良く見られている質問

Qホームページビルダーでプルダウンメニュー作成

質問させていただきます。HP作成中です。素材サイトにあるようなプルダウンメニューを作成したいのですがどのような方法で作成するのでしょうか?こちらのサイトです。http://www.s-chimp.com/mc/
メニューをクリックするとサブメニューが表示されます。理想としては違うメニューをクリックしたときに他のサブメニューが表示されたままではなく閉じると嬉しいです。初心者なので難しいことは出来ないと思うのですがどなたかお願いいたします。

Aベストアンサー

ホームページビルダーの機能にはありませんので
こちらの メニュー か 個人的に使ってみたいスクリプト を参考にしてください

http://www.wsb.jp/hpb/java_s/top.htm

QHPビルダーで中央表示がしたいのですが・・。 

HPビルダーで中央表示がしたいのですが・・。 
どこでも配置を使って作ったHPが、左端がブラウザに固定の表示になってしまいました。
常に開いたブラウザの中央に表示されるようにするにはどうしたらいいのでしょうか。

Aベストアンサー

>http://www-06.ibm.com/jp/domino01/swhc/esupport.nsf/all/hpb1037

IBMのサイトを参考にしてください。

標準モードで「表の挿入」で「表」を使って、表の一番外枠を選択状態で「書式(O)」「位置揃え(A)」「中央揃え(E)」で表が中央に来ます。

または、普通の「文字の中央」をクリックでもOKです。

どのサイズのディスプレイでも中央表示となります。

どこでもモードでは不可です、標準モードで作成です。

表の列や行は後からいくらでも追加や削除が出来ますので、文字列の配置や画像の挿入位置などレイアウトを考えて、列や行を作りましょう。

またセルの結合や分割もできますので、自由な画面のレイアウトが可能です。

表の外枠を選択状態で「編集(E)」「属性の変更(A)」で表やセルの寸法を決めたり枠表示を消したり、枠に色をつけたりも出来ます。

Qホームページビルダー リンク設定できない

ホームページビルダーで作っているのですが リンクできません
ビジュアルサイトビューでリンク設定できたらツリーみたいになるはずなのに
リンクされていないHTMLファイルのとこにあるのですが
リンク挿入 ページリンク作成する リンク先INDEX.HTMLとつなげたいのですが
どうしたらいいのですか?

Aベストアンサー

親ウィンドウ(index.html)のページを開きます。
その中の「この部分にリンクを貼りたい」というところを反転させます(文字の場合)。
ロゴや画像の場合はその部分をクリックするだけでOK。
そのリンクを貼りたいところで右クリックすれば、「リンク挿入」があります。
別ウィンドウが出てきます。
「参照」ボタンでどのページをリンクしたいのか設定。
一番下に「ターゲット」があります。
このターゲットで別ウィンドウを開くのか、フレーム使用で右側に開くのかなどを設定します。

右クリック→リンク挿入でなくても、
リンクを設定したいところをクリックして、ツールバーにある「挿入」→リンクでも出来ます。

他には、ご質問にある「ビジュアルサイトビュー」で、
「リンクされていないHTMLファイル」にあるページをリンクしたいページまでドラッグすることも出来ます。リンク解除したいときには、逆に「リンクされていないHTMLファイル」にドラッグすれば元通りですね。

http://www-6.ibm.com/jp/domino01/swhc/esupport.nsf/key/49256A6A0001F136492568B70015C90E?opendocument

参考URL:http://www-6.ibm.com/jp/domino01/swhc/esupport.nsf/key/49256A6A0001F136492568B70015C90E?opendocument

親ウィンドウ(index.html)のページを開きます。
その中の「この部分にリンクを貼りたい」というところを反転させます(文字の場合)。
ロゴや画像の場合はその部分をクリックするだけでOK。
そのリンクを貼りたいところで右クリックすれば、「リンク挿入」があります。
別ウィンドウが出てきます。
「参照」ボタンでどのページをリンクしたいのか設定。
一番下に「ターゲット」があります。
このターゲットで別ウィンドウを開くのか、フレーム使用で右側に開くのかなどを設定します。

右クリック→リン...続きを読む

Qホームページビルダー作成にて画面サイズでつまづいています

ホームページビルダー13でホームページを作成しているのですが、ビルダー上では画面サイズを940×1200で作成していているまして、横に長い画像を使用できる画面いっぱいまで伸ばしているのですが、webブラウザーで確認すると右にかなりの余白ができてしまう状態になります。私の理想としては見る側がどんなサイズの画面でもきちんと中央を基本にしたいと思っています。

文章だと伝えづらいので、目標イメージのサイトを書きに載せました。
そのサイトを参考にいうと、トップページの家が写ってる画像が私の場合左に寄っていて、右側に四分の一程空白ができてしまうのです。
作成ページ右いっぱいに画像を広げても空いてしまいます。

どういう処理をしたら下記サイトのようにキレイにレイアウトできるのでしょうか?どなたかわかるかたいらっしゃいましたら教えてもらえると助かります。よろしくお願いします。

Aベストアンサー

どこでも配置モードで作ると、style属性として書き出されるから、ソースが汚いといわれるんじゃないでしょうか。
外部スタイルシートに作り直せば、HTMLタグや構造そのものは比較的綺麗だと思います。

で本題のセンタリング(中央寄せ)の方法ですが、
たぶん、標準の機能(ダイアログやボタン)では作れないかもしれませんが、
以下のようにすれば、どこでも配置モードのままでも可能です。
ホームページビルダーのデザインビューではセンタリングされないかも知れません。

・センタリングしたいレイヤーを選択して、スタイルシートの編集ダイアログを表示
・位置指定の左(left)を50%に指定する
・左マージン(margin-left)を、幅の半分の値をマイナスで指定する
(幅が400pxの場合は、左マージンが-200px)

これを保存して、ブラウザで見てみてください。


HTMLコードとスタイルシートはだいたいこうなると思います。

<div style="position:absolute; top: 100px; left: 50%;
margin-left: -200px; width: 400px; height: 300px;
border: 1px solid #999999">
<p>文章など</p>
</div>

どこでも配置モードで作ると、style属性として書き出されるから、ソースが汚いといわれるんじゃないでしょうか。
外部スタイルシートに作り直せば、HTMLタグや構造そのものは比較的綺麗だと思います。

で本題のセンタリング(中央寄せ)の方法ですが、
たぶん、標準の機能(ダイアログやボタン)では作れないかもしれませんが、
以下のようにすれば、どこでも配置モードのままでも可能です。
ホームページビルダーのデザインビューではセンタリングされないかも知れません。

・センタリングしたいレイヤ...続きを読む

Q自分のホームページの容量の確認

初心者ですのでうまく質問できるかどうか・・・。

OSはWindows xp で、ホームページビルダー7でホームページを作っています。
知りたいことは、いま自分のページの容量がどれくらいなのかということです。

ビルダーで、ツール→FTPツールの起動 と来たら、ファイル転送の画面になって、[接続]をクリックすると、左に自分のコンピューターのファイルの名前やサイズ等、右にサーバーのもの、が出てくるじゃないですか。そこで上から下までのすべてのファイルの合計のサイズを確認したいのです。
(以前、サポートサービスの方が、「ほら、これが今の容量ですよ。」とそのやりかたで教えてくれました。)
あれはどうやっていたのだろうかと思います。

よろしくお願いします。

Aベストアンサー

JAVAスクリプトのみなどでリンクしているページやファイルがない,及び,リンク切れをしているページがないという前提がついてしまいますが,ホームページビルダー本体で容量を確認することが出来ます。

1.
まず,ホームページビルダー本体を起動します。
2.
全体容量を知りたいサイトを開きます。
3.
メニューバーの「サイト」>「サイト転送」の順でクリックしてください。(ツールバーの「サイト転送」ボタンでも構いません)
4.
「次へ」ボタンをクリックします。
5.
「転送対象ファイルの一覧」ボタンのすぐ上に,「すべてのファイル」を出してください。
6.
「転送対象ファイルの一覧」ボタンのすぐ下に,「合計ファイルサイズ」が表示されます。
7.
確認しましたら,「転送対象ファイルの一覧」ボタンのすぐ上を元に戻して,「キャンセル」ボタンをクリックしてください。

たぶん,こちらの方がサーバーに接続しなくても良い分,簡単だと思います。
と言うか,正確な容量を知ることが出来ます。

ファイル転送(「FTPツール」と書きます)を使用する場合は,次の方法で出来ます。

1.
FTPツールを起動します。
2.
「マイコンピューター」側の適当な場所に任意のフォルダ名(「サイト名+mirror」あたりがわかりやすいと思います)をつけて作製します。(右クリックしますと,FTPツール上でもフォルダは作製出来ます)
作製出来ましたら,ダブルクリックして開いてください。
3.
調べたいサイトの転送設定でサーバーに接続します。
4.
右半分にフォルダやファイルが表示されましたら,それをすべて選択します。
5.
FTPツールの真ん中にある「左下向きの矢印ボタン」をクリックします。(ダウンロードが始まります)
6.
ダウンロードが終了しましたら,切断したからFTPツールを終了してください。
7.
エクスプローラやマイコンピュータなどを使用して,先ほどのフォルダを開きます。
8-1.
階層(フォルダ)がなければ,Windows XPですから,一番下の「マイコンピュータ」のすぐ左隣に,ファイル容量の合計が出ています。
8-2.
階層(フォルダ)がある場合は,それぞれのフォルダを開いて,トップフォルダにファイルを移動してください。ただし,ファイル名が同じもの(たぶん,「index.htm」などが1番多いと思います)が存在するときは,例えば,「index.htm」なら「index1.htm」などに変更してから移動する必要があります。
9.
すべて移動出来ましたら,もう一度,トップフォルダを開いて,一番下のマイコンピュータのすぐ左を確認してください。

ファイルやフォルダの検索が使えるかと思ったのですが,Windows XPでは使えないようですので,面倒な方法になってしまいました。(Windows 98やMeでは出来たと思いますが・・・)
もちろん,移動させなくても,各フォルダ内のファイル容量を合計すれば,良いかもしれません。
でも,おおよその目安にしかならないですよ。
通常のリンク方法を使用し,リンク切れをしているファイルがなければ,ホームページビルダー本体を使用した方が,より正確なファイル容量を知ることが出来ますね。

JAVAスクリプトのみなどでリンクしているページやファイルがない,及び,リンク切れをしているページがないという前提がついてしまいますが,ホームページビルダー本体で容量を確認することが出来ます。

1.
まず,ホームページビルダー本体を起動します。
2.
全体容量を知りたいサイトを開きます。
3.
メニューバーの「サイト」>「サイト転送」の順でクリックしてください。(ツールバーの「サイト転送」ボタンでも構いません)
4.
「次へ」ボタンをクリックします。
5.
「転送対象ファイルの一覧」...続きを読む

Qフッターを固定して、常にどのページでも常に表示

フッターを固定して、常にどのページでも常に表示させる方法について。

今、FC2様の方で、ホームページを作成しているのですが、
フッターを固定して、そのフッターの内容を
常にどのページでも表示させるようにしたいのですが、
(付属の画像のようなスクロールしても常に画面下に表示されるもの)
なのですが、

タグ初心者でどのようにすればいいのかよく解りません。

タグはどのようなものが解りやすく出来ますでしょうか?
後、タグの意味も教えていただけると嬉しいです。

回答宜しくお願い致します。

Aベストアンサー

先ほども回答した者です。
フッター固定で一応CSSで見つけましたので貼っておきます。
お望みと全く一緒の効果が有るかわかりませんが、
色々頑張ってみて下さい。
出来ればHTML、CSS、JavaScriptこの3つはあると
WEBページ制作する上で大変よろしいとおもいます。
私は参考書のみ買ってやってましたがHTMLとCSSはそれだけで覚えられます。
(プログラムではない為)、ですがJavaScriptはプログラム言語であるため、
独学だと大変です。ですが慣れると結構応用が利きますので、
頑張って下さい。
補足:私は英語苦手に付き意味を説明できません。
様は英語ですから。

参考URL:http://scuderia-web.com/tips/xhtml_css/fixed_header_and_footer.php


人気Q&Aランキング