176541410 ランダム
 ホーム | 日記 | プロフィール 【フォローする】 【ログイン】

あなたのブログをきれいにする方法教えます~ブログデザイナーヒナによるブログデザインQ&A~

あなたのブログをきれいにする方法教えます~ブログデザイナーヒナによるブログデザインQ&A~

【毎日開催】
15記事にいいね!で1ポイント
10秒滞在
いいね! --/--
おめでとうございます!
ミッションを達成しました。
※「ポイントを獲得する」ボタンを押すと広告が表示されます。
x
2005年07月10日
XML
カテゴリ:web制作

おひさしぶりです!

今月は、週一~二くらいで、まったり更新する予定です。

で、このサイトも、そろそろデザインもあきてきたので、リニューアルしようとしてまして…。その様子なんかを書いてみるのも、みなさんのお役に立つかも?と思い…。

今日は、背景画像について…。

楽天広場では、管理画面の「メニュー>基本設定>デザイン設定>詳細設定(上級者用)」のリンク先で、サイトの背景画像を設定することができます。

この場合、注意すべき点として

1)設定した背景画像は、サイト全体に適用される(ページごとに別の背景にするのはできない仕様)

2)画像の位置指定、繰り返しなしなどの設定はできない。

→本来、HTMLでは、スタイルシートを使って、背景を一回だけ表示する、あるいは縦方向にだけ繰り返す、あるいは横方向にだけ繰り返す、という指定ができるようになっていますが、楽天広場では、これらの設定ができません。

3)背景に使う画像はあらかじめ、「画像倉庫」または「画像オプション」に追加しておく必要がある。外部のサイトにおいてある画像を背景にすることはできない。

現在の、このサイトで、左上に薔薇が表示されているのは、背景画像として設定しているわけですが、もし、この画像が、薔薇の大きさにぴったりなサイズで作られていたとしたら…

薔薇 薔薇 薔薇 薔薇 薔薇 薔薇 薔薇 薔薇 薔薇薔薇 薔薇 薔薇 薔薇 薔薇 薔薇 薔薇
薔薇 薔薇 薔薇 薔薇 薔薇 薔薇 薔薇 薔薇 薔薇薔薇 薔薇 薔薇 薔薇 薔薇 薔薇 薔薇
薔薇 薔薇 薔薇 薔薇 薔薇 薔薇 薔薇 薔薇 薔薇薔薇 薔薇 薔薇 薔薇 薔薇 薔薇 薔薇
薔薇 薔薇 薔薇 薔薇 薔薇 薔薇 薔薇 薔薇 薔薇薔薇 薔薇 薔薇 薔薇 薔薇 薔薇 薔薇


こういう風に背景が繰り返されて表示されてしまうわけです。(画像つかって説明する手間を惜しんですみません)

本来は この「薔薇」の画像で


薔薇





                      


こんなふうに表示ができるはずなんですが、2)にあるとおり、楽天の仕様でできなくなっています。そこで↑のように、表示したいときには、しかたなく…

薔薇   ---------      ずっと空白        ------------->
 ↓
 ↓
 ↓
 ↓
 ↓
 空白                   


というような、画像の横が真っ白(もしくは透明)の画像を作るのです。

だいたい横は1200px(ピクセル)くらい、縦は800pxくらいで作ると、横が繰り返されなくなります(見る人の画面サイズによります)

あまり、大きく作っても、容量が大きくなり、表示に時間がかかって得策ではないのですが…。この際仕方ありません…。

縦は、どうしても、文章が長くなったりすると、どんどん画面が下に伸びますので、たとえば、このサイトを見ればわかるように、やっぱり下には薔薇が繰り返されています。

そこはあきらめて…。もともと 多少繰り返されても大丈夫な画像を使うしかないですね。

ちなみに…。

背景は、設定は簡単ですが、自作の画像でかっこよく見せるのはわりと難しいです。

小さい画像だと、どうしても繰り返されてしまい、うまく作らないと繰り返された画像の切れ目が不連続に見えたりしてかっこわるい…。 あるいは、背景の柄が邪魔になって本文が読みにくくなったりするという問題もでてきます。

文字の下に敷く場合には、どうしても可読性に支障がでますので、配慮が必要です。このサイトの例のように、ワンポイントのもの、あるいは 文字表示領域にかぶらない部分のみの画像…のようなものだとわりとよいかもしれません。

具体例は…… そのうち…。

【 ★今日の日記はいかがでしたか? お役に立てましたら、一日一票お願いします♪投票する


【 ★人気ブログランキング参加中。ただいまの順位は?

【ビジネス系のみの新しい注目ブログランキングにも登録してみました:鬼ブログランキング!
↑他の役立つブログも見に行ってみては??(クリックするとこのブログの応援になります!ヨロシク!)









お気に入りの記事を「いいね!」で応援しよう

最終更新日  2005年07月11日 01時44分43秒
コメント(1) | コメントを書く


■コメント

お名前
タイトル
メッセージ
画像認証
別の画像を表示
上の画像で表示されている数字を入力して下さい。


利用規約に同意してコメントを
※コメントに関するよくある質問は、こちらをご確認ください。


こんばんは♪   mika89 さん
ご無沙汰しています。
いつも勉強になるな~♪
私、自分でHPつくれるようになりたいのです。
どんな本をみて勉強すればいいですか?
お忙しくない時に、教えてくださると嬉しいです♪
よろしくお願いします^0^ (2005年07月17日 01時30分12秒)

PR

キーワードサーチ

▼キーワード検索

バックナンバー

2024年04月
2024年03月
2024年02月
2024年01月
2023年12月

フリーページ

カテゴリ


© Rakuten Group, Inc.