Web用画像のサイズ決め方について
- Web用画像（ボタンや背景画像）を作成する際のサイズ決め方について疑問があります。基本的なセンターよせの２カラムのサイトで、ヘッダー部分に横並びのナビゲーションメニューがある場合、モニタサイズやデザインによってどのようなサイズを設定すれば良いのでしょうか？
- ナビゲーションメニューの画像のサイズを決める際、モニタのサイズやデザインによって適切なサイズは異なるかと思いますが、一般的にはどのような基準で決めるべきでしょうか？センターよせの２カラムのサイトのヘッダー部分に横並びのナビゲーションメニューがある場合、最適なサイズ設定について教えてください。
- Web用画像のサイズを決める際、センターよせの２カラムのサイトのヘッダー部分に横並びのナビゲーションメニューがある場合、どのようなサイズが一般的に適しているのでしょうか？モニタサイズやデザインによって異なるかと思いますが、一般的な基準や考え方について教えてください。
- ベストアンサー
web用画像（ボタンや背景画像）を作る上でのサイズの決め方
現在htmlなどweb関係の勉強をしていて、ちょっとphotoshopでナビゲーションメニューの画像を作っています。 そこで疑問に思ったのですが、ヘッダーの横幅の決め方ってみなさんどうしていますか？もちろん、デザインによって様々すぎるのでなんともいえないと思いますが、基本的なセンターよせの２カラムとかのサイトで、ヘッダー部分に横並びのナビゲーションメニューがあるようなサイトの場合でお願いします。 完全に感覚的なものなのか、それともある程度「サイズの決め方」というものがあるのか…そこを教えてください。（見る人によってモニタのサイズも変わってくるので、最高でもこれ以上は大きくしない…とか、最近では○○くらいのサイズのモニタが多く普及してるからそれを基準に、モニタサイズの○％で…など。） 決まった答えはないかと思いますが、個人的な意見でもいいので教えていただければと思います。 よろしくお願いいたします。
- 3104kita
- お礼率47% (95/202)
- CSS
- 回答数1
- ありがとう数3
- みんなの回答 （1）
- 専門家の回答
質問者が選んだベストアンサー
希望の回答はないと思います。 デザインありきでは無く、これから構築するサイトのターゲットや、ユーザー層を想像すればだいたいはイメージが出来るのではないでしょうか。 また、ユーザビリティ、アクセシビリティ等を配慮する必要もあります。 コーティングの際に、利用者を配慮して「エラスティックレイアウト」と言う考えもあります。最近のブラウザでは文字だけで無く、画像も比率で大きくすることができます。 当然見ている人のモニターの物理的な大きさと解像度の配慮も必要です。 そもそもホームページは見られる環境で、デザインが変わるのが理想です。 ここまで配慮をした上で、具体的にパソコンで見る場合は、どの位の大きさがいいの？と言うことですが、アドバイスとして日本で一番アクセス数が多いサイトを参考にされたら如何でしょうか。WEB をデザインされる方の多くは、Yahoo!Japan を参考にしていないでしょうか。
関連するQ&A
- WEBデザイン ナビゲーションメニュー 画像
初歩的な質問失礼します。 最近？よく見かける、横並びのナビゲーションメニューバーがウィンドウ幅いっぱいに広がっているwebサイトのデザインについて教えていただきたいことがあります。 サイト全体がセンタリングされて、幅が固定されている横並びメニューバーは作れるのですが、 http://www.sapporoholdings.jp/ このサイトのようなナビゲーションバーを作りたいと思ったところ、自分なりに調べて幅を指定しない、などのレイアウト自体の理屈は理解しました。 しかしいざ作ろうと思ったときに画像の用意の仕方で戸惑ってしまいました。 上記のサイトのように、メニューのテキストを画像で表示させる場合、通常時の画像/マウスオーバーの画像はどのように用意するのが効率がいいでしょうか？ メニュー全体の背景画像をrepeat-xでウインドウ幅いっぱいに繰り返し指定して、各メニューのテキスト（画像）と区切りのラインを透過画像で用意しているのでしょうか？ 一番左と一番右のメニューだけに背景画像repeat-xを指定しているのでしょうか？ 質問がわかりにくくてすいません、本当に知りたくて困っています。 ちなみに私の流れとしてはphotoshopを使用して、先にカンプを作ってから画像をスライスして作っています。 どなたかわかりやすく説明して頂けないでしょうか？？ いろいろな方法があるのでしょうが、みなさんのおすすめを教えて頂きたいです。 どうかよろしくお願いします。
- ベストアンサー
- CSS
- ２カラムの黄金比？レイアウトの悩み
webデザインのレイアウトで悩んでいます。 横幅のサイズは８００で、２カラムで作成するのですが、 メインとメニューの比率（％）について、どのようなサイズで 分割すれば良いかが分かりません。 ８：２や、４：２ぐらいが一般的なのでしょうか？ 比率を決めるときの目安などあれば、教えてください。
- ベストアンサー
- HTML
- heaerとfooterに背景画像が難しい css
添付画像のようなサイトを作りたいと思っております。 ヘッダーもフッターも、 ブラウザウインドウの横幅いっぱいにオレンジの下地が伸びるようにしたいです。 （ウインドウサイズを変更しても常に横幅いっぱい） しかも、そのオレンジ下地は画像です。 この場合、どの要素にどのようにコーディングすれば 作る事ができますでしょうか。。？ いろいろ試して見ているのですが、ななかなうまくいかず、、焦っています。。 初心者で申し訳ないですが、ご存知の詳しい方いらっしゃいましたら 何卒ご教授、よろしくお願いいたします。
- ベストアンサー
- HTML
- ウインドウサイズの決め方について
皆さんよろしくお願いします。 スクールの中間課題でwebサイトを作ることになりました。 サイトのアイデアも決まり、デザインも決まったのですが ウインドウサイズをどれくらいの基準で作ってよいのか 悩んでいます。 皆さんはどれくらいのサイズを基準に作られていますか？ 別ウインドウで開いたときに横幅がきっちり表示されるよ うなサイズになるんかな？ 訪問者にストレスを感じさせないように表示したいんです。 いろいろ言ってすみませんが、よろしくお願いします。
- ベストアンサー
- HTML
- webデザイン 画像の罫線を立体的にしたい
webデザイン 画像の罫線を立体的にしたい 下記のwebサイトのメニューバーの縦の罫線（項目の区切り） のような立体的な罫線のPhotoShop、Fireworksでの作り方を、どなたか 教えてくださいますでしょうか.. 。 http://www.chem.keio.ac.jp/
- 締切済み
- デザイナー・クリエイティブ職
- 左右２カラム時の、headerの使い方
お世話になります。 現在HTML５を勉強しているのですが解らない点が出てきてしまったので、 お教えいただければ幸いです。 左右２カラムのサイトを作ろうとしています。 良くある上と下にヘッダ部分とフッター部分があり、中央部分が２つに分かれているものではなく、 ヘッダー部分とフッター部分が画面構成的には無いデザインにしたいと思っています。 （左側のカラムにナビゲーション。右側のカラムにメインコンテンツ） 上の様なデザインのサイトで、HTML５で構造を示す際の記載ですが、 <header></header> <footer></footer>は、記載はしておくが、 中身には何も書き込まない形にするのが良いのでしょうか？ それとも、そもそもheaderタグも footerタグも書き込まないのが良いのでしょうか？ 理由と共にお教えいただければ幸いです。 宜しくお願いいたします。
- ベストアンサー
- HTML
- photoshopでのwebパーツ制作がうまくできません。
現在、webデザインについて勉強中です。 ＨＴＭＬ＆ＣＳＳでのコーディングは独学ですが何とか分かるようになりました。 でも、肝心なデザインの方がイマイチできません。というか、photoshopの使い方が分からず、イメージしたものを形にでないのです。。。 photoshopでwebデザインするときに参考になるようなサイト、又は参考書などを紹介していただけないでしょうか。 photoshopでやりたいことは以下のとおりです。 ・ナビ（ボタン）を作りたい。 ・素材集等を編集してイメージ画像が作りたい。 ・ヘッダ、フッタを作りこみたい。 ・webデザインのレイアウトがやりたい。 不躾な質問で申し訳ありませんが、なにとぞよろしくお願いします。
- 締切済み
- ホームページ作成ソフト
- [CSS]リキッドレイアウト上で、floatさせたサイドバーの背景画像を高さ100%で敷き詰めたい
今ヘッダフッタ付きの3カラムブログデザインを作っています。 leftnaviとrightnavi（サイドバー/メニュー）の間にmaincontents（ブログのメイネントリ）が挟まるような、まあ一般的なブログデザインです。 で、質問なんですが、leftnaviとrightnavi（サイドバー/メニュー）に背景画像を敷き詰めたいんです。 ブログですので、基本的にはmaincontents（エントリ）の方がサイドバーよりもheightが大きくなってしまいます。 その際、サイドバーの背景が、記述されたメニューの部分までしか反映されません。これについて、エントリ部分の高さまで敷き詰める方法を教えて頂けませんでしょうか？ 色々調べたところ、（http://css-happylife.com/log/css-template/000028.shtml）こちらで、width固定デザインの際にcontainerに背景画像を指定する方法が紹介されていました。 ただ、今回お伺いしたいのは、containerのwidthを%指定するリキッドデザインの場合、です。左右のサイドバーにはそれぞれ別の背景画像を指定したいと考えているのですが、それは可能なのでしょうか？
- 締切済み
- HTML
- 画面サイズ・横1024の場合の表示可能サイズについて
画面サイズ・横1024の場合の表示可能サイズについて いつもお世話になっています。 趣味のサイト再構築に当たり、流行のブログ風デザインにしようと考えているのですが、横幅のサイズで迷っています。 今までは800×600を基本にして、横幅700にして作成していました。 しかし昨今ではノートPCでも高解像度の製品が多く、自分のPCも横幅1280です。 サイトのアクセス解析等を見ても、1024以上が100%を占め、800サイズは一件もありませんでした。 そこで今回は1024を対象にして作成しようと考えているのですが、バランスを考えると横900くらいで作るのが無難なのでしょうか？ 背景には壁紙を挿入する予定ですので、余白部分があまり狭すぎても、おかしな感じになってしまいます。 そもそも1024の解像度の場合、スクロールバーの部分を計算に入れると、横スクロールバーが出ない最大横幅サイズはいくつくらいなのでしょう？ ご存知の方、いらっしゃいましたら教えて下さい。 また、実際に横1024を規定としてサイトを作成している方、横幅はいくつくらいで作っていらっしゃいますか？ 参考のためお聞きしたいです。 よろしくお願いします。
- ベストアンサー
- HTML
- 背景画像が拡大縮小しつつ、大きさが一定のメニューを固定配置するには？
flashにて、背景画像がブラウザの大きさに合わせて拡大縮小しつつ、 大きさが一定のメニューを固定配置するデザインを制作しようと思っています。 イメージとしては下記サイトのように、写真がブラウザに合わせて 伸縮するようにし、ブラウザ中心位置には大きさが一定のメニュー、 ブラウザ最下部にはヘッダーを配置したいと思っています。 http://www.creative-box.co.jp/ これまで数々の質問系サイトを見てまわり、独自に試行錯誤を繰り返したのですが、 部分的な質問＆解説しか見当たらず、途方に暮れています。 そもそも上記サイトの場合、ステージサイズをどの程度にし、 どの程度の画像を用意すればいいのかすらわからない状態です。 どなたかご教授願えれば幸いです。
- ベストアンサー
- Flash
お礼
＞希望の回答はないと思います。 とんでもないです。十分に参考になりました。確かに有名サイト等のサイズを参考にすればいいですね。 お礼遅くなってしまいすみません。どうもありがとうございました。