月別 2018年6月
2018年6月に公開された記事の一覧です。
PNGの軽量化はどうすればいいの？Macで利用できる無料のCrunchを使ってみよう！
PNGはJPEGの2〜3倍の容量になりがちです。Macで無料で使える軽量化アプリ Crunch を紹介し、どこまで小さくできるかを実際に試しました。
Compressor.io はロスレスもロッシーも選べる4形式対応のWebサービス
4種類の画像形式に対応し、ロスレスとロッシーを選べるWebサービス Compressor.io と LightFile Core の削減率を比べました。同じ画像で画質の差も検証しています。
画像軽量化がなかなか進まない3つの理由と、その解きほぐし方
画像の軽量化がわかっていても進まない3つの理由を、コンテンツ担当とシステム担当それぞれの立場から整理しました。人手に頼らず仕組みにすると解決する、という結論に至ります。
画像軽量化でコストが下がる？！例えば転送量20TB(月)だとすると、どのぐらいの差がでるのか？
画像を軽量化すると、クラウドの転送料金がどれだけ下がるのかを試算しました。AWS で月20TBの転送があるケースを例に、削減率ごとの金額差を具体的に示します。
実録Lighthouseのスコア改善〜Accessibility編
Lighthouse の Accessibility スコアを100点にした記録です。画像のalt属性、リンクのname属性、コントラスト比を直しました。100点でも十分とは言えない理由も述べます。
画像の解像度を、exiftoolで確認しよう！X Resolution、Y Resolutionが解像度を示す
画像の解像度を exiftool で確認する方法です。X Resolution と Y Resolution の見方と、コマンドの基本的な使い方を説明します。
Retinaディスプレイに合わせるには、解像度はいくつがいい？画像最適化するなら解像度も理解しよう！
Retinaディスプレイ向けの画像は解像度をいくつにすべきかを検証しました。結論は72dpiで問題なく、調整すべきなのは解像度ではなく画像の表示サイズのほうです。
競合サイトを分析できるサービス・ツールまとめ（2018年6月版）
競合サイトを分析できるサービスやツールを、2018年6月時点でまとめました。SimilarWeb をはじめ、無料の範囲でどこまで調べられるかを実際に触って整理しています。
メディアサイトは84%が対応済み！Lighthouseで調べたモバイルフレンドリーなサイトの割合
Lighthouse がモバイルフレンドリーと判定したサイトの割合を、ジャンル別に集計しました。ブログ・メディアは84%が対応済みですが、上場企業のコーポレートサイトは61%にとどまります。
表示サイズごとにファイルサイズを比較！画像最適化は、表示サイズと画質調整が重要！
表示サイズを変えながらJPEGとPNGのファイルサイズを比べました。サイズが変わっても比率はあまり変わらず、最高画質のJPEGでもPNGとは1.4倍の差が出ています。
レスポンシブ・ウェブ・デザインにおいて画像最適化が意味するもの
レスポンシブ・ウェブ・デザインにおける画像最適化の意味を説明します。同じソースで全端末に配るぶん、高速回線でない環境に不要な容量を送らない工夫が要ります。
実録Lighthouseのスコア改善〜Performance(ユーザー待ち時間)編
自社コーポレートサイトで Lighthouse の Performance スコアを改善した記録です。CDNの導入、画像の軽量化、遅延読み込みが効き、カルーセルの是非にも触れます。
JPEGとPNGの使い分けは、色数が多いか少ないかで決まる
JPEGとPNGはどちらを選ぶべきかを、色数という観点から説明します。写真のように色数が多ければJPEG、ロゴやアイコンのように少なければPNG。特性を掴めば容量が半分になることもあります。
上場企業から3,198サイトをLighthouseで監査してみた
上場企業約3,600社のコーポレートサイト3,198件に Lighthouse を実行し、モバイル対応と表示速度の実態を調べました。各スコアの平均値とヒストグラムを公開します。
LightFileチャレンジ「軽量化前のきれいな元画像はどれ？」の答え合わせ
MTDDC Meetup HOKKAIDO 2018 のブースで出題した「軽量化する前の元画像はどれ？」クイズの答え合わせです。正解は25人、見分けられた人は42%でした。
2018年6月9日「MTDDC MEETUP HOKKAIDO 2018」登壇＆ブース出展のお知らせ
MTDDC MEETUP HOKKAIDO 2018 に代表の宮永がブースセッションで登壇し、Google の監査ツール Lighthouse の見方を解説します。スポンサーブースも出展します。
JPEG2000について相談されたので、使われていない理由を調べてみた
ECサイトで JPEG2000 を使えないかと相談を受けたので、なぜ普及していないのかを調べました。対応ブラウザが Safari のみであることと、再生の負荷が理由です。
MTDDC Meetup HOKKAIDO 2018のブースで画像の目利きクイズを開催します
MTDDC Meetup HOKKAIDO 2018 のアイデアマンズブースで開くクイズのご案内です。4Kモニタに並んだ4枚から軽量化前の元画像を見分けられるか、挑戦してみてください。
月刊アイデアマンズブログ 2018年5月の人気記事
2018年5月にアイデアマンズブログでよく読まれた記事をまとめました。Lighthouse 3.0 の登場もあり、Chrome DevTools など計測系の記事に人気が集まっています。