ホームページのリンクメニュー

質問

ＨＰのリンクメニューにナビゲーションを利用している例をよく見かけますが、みなさんはどのように作ってるのでしょうか。

具体的な例としては下記ＵＲＬのようなものですが、ＪＡＶＡを使用せずにＣＳＳだけでデザインできる利点もあるようです。

使用例「グローバルナビゲーションのロールオーバーをJavaScriptを使わず、CSSのみで実現する」
​http://css-happylife.com/template/07/​
​http://blogimg.goo.ne.jp/user_image/5e/43/9620a56f8595f82e251d8c79b...​

現在までは各リンクボタンを一枚一枚作成して、それをマウスを当てたときに色違いになるようにＪＡＶＡを利用しておりました。

それが一枚で済む利点は興味深いものがあったので自分で作ろうと思ったんですが、これだけ升目があると縦横の仕切り線や文字の位置にばらつきができてしまいましてうまく作れません。
しかも格段が色違いになっており、どうやってアレンジしていいのかさっぱりわかりません・・・

一応父親のＰＣにAdobe Photoshop CS3が入ってるので、これを借りて試行錯誤しながら作ってみましたが、一週間考えてもダメでした。

何かいいアドバイスお願いします！

回答No.2

fujillin

ご質問の意味がいまいち把握できませんが・・

＞現在までは各リンクボタンを一枚一枚作成して、それをマウスを
＞当てたときに色違いになるようにＪＡＶＡを利用しておりました。
ということができていたのですよね？
画像のチェンジをスクリプトを利用して行うかCSSを利用して行うかの違いだけなので、すでに画像があるのなら、画像の扱いに悩むことはないはずなのですが・・・

＞Adobe Photoshop CS3が入ってるので、これを借りて試行錯誤しな
＞がら作ってみましたが
クリック用の画像を新たに作成するのなら、まず文字のない基本ベースを作成しておきます。
次に、これを別レイヤーにコピーして、効果（hoverなど）の時のベースとして、色調を変えたりして作成します。
さらに、上の乗せる文字などについても、それぞれに別レイヤーで作成し、ベースとの組み合わせで、最終画像を作ってゆけば、位置がずれたりせず、同じトーンの画像を効率的に作成することが可能になります。

補足

混乱させてしまう内容で本当に申し訳ありません。

fujillinさんのご回答の後者のほうの回答がまさに問題の点なんです。
言葉では「なるほど！」と理解できますが、中々思うようにはいきません・・・

当然サンプルから作っていく練習本を購入してなんとかやっておりますが、とても複雑ですね。

回答No.1

kata_san

ごく普通に
<A HREF="ユーアルエル" TARGET="_blank">テキスト</A>
で良いのではないですか？
TARGET="_blank"
を記述しなければ、新しいページで開くことはありません。
作り手が難しく考えないで、「閲覧する人が見やすい」
という方法を選択するべきではないでしょうか？

補足

はぁ・・・
そうですね・・・

元々はそういうページ構成でやっておりまして、それからcssを使ったリンクメニュー（マウスを当てると背景が変わる）に変更し、現在はそれを画像に置き換えてます。

しかしリンクメニューが「ホーム|メール|リンク|コンテンツ」と４つの項目がありまして、マウスを当てて画像をチェンジさせる分を含めると８つの画像が必要になります。

個人的にはこれで十分だと思いますが、１枚でやれることは１枚でやりたいと思いまして・・・