HTMLでレスポンシブやRetinaディスプレイ、ファイル形式など画像の読み込みを最適化する | Free Style
Webサイトのコンテンツとして、とても重要な写真やイラストなどの画像。 綺麗な写真をどのように見せて、写真コンテンツとして情報を伝えるか。 写真もデザインの1つです。 アイコンやイラストなどの画像もそうですが、写真の画像も綺麗な画質でWebに載せていきたいところです。 しかし、画像も高解像度であればファイルサイズが大きくなり、Webサイトにも影響を与えてしまします。 Retinaディスプレイでは、高画素密度であるため利用する画像を2倍にしないと、画質が悪くて少しぼやけて見えてしまいます。 スマートフォンでは、そこまで大きいサイズの画像を読み込む必要はないので、ファイルサイズの小さい画像を読み込むようにしたりと、いろいろとコントロールする必要はあります。 Webサイトに最適化していこうとなると、意外といろんな問題が見えてきます。 ただ、これらの問題はHTMLで対応可能です。 今回は、デバイス
PNGとJPEG画質の違いは? 拡張子でどう違う? ウェブ画像使い分けの基本 | 初代編集長ブログ―安田英久
今日は、新年度シリーズとして（続くのかな？）、ウェブで使う画像の基本に関する情報をお届けします。お題は「PNG？ JPEG？ GIF？」どんなときにどのファイルフォーマットを選ぶべきかの基本です。 結論から言うと、ウェブ画像（動画ではない静的な画像）の基本は次のとおりです。 写真（自然物）はJPEG 画面キャプチャ（人工物）はPNG（しかも8bit PNGにして減色する） 次のものは様子をみながら8bit PNGとJPEGで最適なものを選ぶ 自然物と人工物が混じったもの（写真が使われているサイトの画面キャプチャ）グラデーションが入っている画面キャプチャ写真でも色数が少なくてパターンが直線的なもの Web画像は「キレイで」「大きくて」「軽い」が命ウェブサイトに画像は付き物です。ビジュアルに魅力を訴求することで、テキストだけのコンテンツよりも効果が増します。 しかし、画像というものは、キレイで
無料で使える素晴らしい紙の背景&テクスチャ30選『30 Great Free Paper Backgrounds and Textures』 – creamu
Design 無料で使える素晴らしい紙の背景&テクスチャ30選『30 Great Free Paper Backgrounds and Textures』 紙のテクスチャ探している。 そんなあなたにおすすめなのが、『30 Great Free Paper Backgrounds and Textures』。無料で使える素晴らしい紙の背景&テクスチャ30選だ。 以下にいくつかご紹介。 その他のリストは以下から。 » 30 Great Free Paper Backgrounds and Textures All of these textures should be free for commercial use, but to be absolutely sure, check each web site usage terms and license before downloading
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
http://okinny.tumblr.com/
オキニー 画像ブックマーク
