Posts Tagged デザイン

facebookのいいねボタンを設置する方法

facebookのいいねボタンをWebサイトに設置する方法を紹介します。 WordPressを利用している方は、プラグインTweet, Like, Google +1 and Shareで設置することも可能です。 いいねボタンを設置する方法…

CSSで作るツールチップ

少ない表示領域を補うためや、ページをスッキリされる手段としてツールチップは良く利用されます。 jQueryやjavascriptを利用したリッチなツールチップのプラグインは良く見かけますが、今回はCSSのみでツールチップを実現してみました。…

良く利用するCSS3プロパティのクロスブラウザ対応まとめ

CSS3では、丸角や影をつけたりと今まで出来なったリッチなUIが作れるようになりました。 しかし、まだ全てのブラウザで完全に実装されていないため、ベンダープレフィックスや独自のプロパティが必要となってきます。 そのため、CSS3で良く利用す…

センスの良い配色のWebサイトを作る方法

センスの良い配色を選ぶ時には、彩度・明度・色相のバランスや青/白は清潔感、黒は高級感などの色の意味を知ってバランスの良い組合わせ模索する必要があります。 配色の本が出ている位なので、こういったセンスを磨くのはとても大変です。 私は本職のデザ…

CSSで作るdivボックスデザイン

pタグは文章、tableタグは表と言ったようにタグにはそれぞれ意味があります。しかし、divタグはHTML上意味の無いタグとして扱われます。 そのため、レイアウトやデザインなど装飾に使われます。 今回はそんなdivタグでボックスデザインをい…

読みやすい行間と文字サイズ

ブラウザのデフォルト設定だと、行間隔が詰まりすぎたり、文字が大きい、または小さいすぎるなど、やや読みづらいものとなってしまいます。 文字のサイズや行と行の間隔を適切なものにするだけで、文章を読みやすさを格段にUPできます。 今回は、「文字サ…

ホームページに最適な画面サイズ

ホームページのレイアウトを作るときに、まず決める必要があるのが画面のサイズです。 最適なサイズでレイアウトを組むことが、見やすいレイアウトにつながって行きます。 今回は、レイアウトを組むために最適なサイズがいくつなのかを調べてまとめてみまし…