現在のサイト作成プロセスにおいて、避けて通れない道はサイト速度の高速化です。
そこでポイントになってくるのが画像の最適化になります。
今回はWebサイトまたはブログの高速化の観点で画像容量は小さくしてサイズはそのまま保つ方法というテーマで下記の疑問に答えます。
- 画像容量を下げたいけど画像のサイズは変えたくない。
- 画像を軽くするにはどうしたら良い？
- サイトの速度改善をしたい。
こんな疑問や要望に対して解説します。
記事をかいている人
・現役Webマスター職で勤務
この記事を読んで得られる事
・サイトの最適な書き出し方がわかる
・画像容量を減らして実際にサイトまたはブログの速度を改善出来る
画像容量は小さくしてサイズはそのまま保つ方法とは
結論から言うと、画像の圧縮ツールを活用することで、画像の容量を小さくし、画質・画像サイズを保ったまま保存することができます。
画像圧縮ツールには色々な種類がありますが、僕が実際のWeb制作現場で活用しているツールはtinypngというサイトです。
画像の圧縮率が非常に高く、その上画質は劣化しづらいのでかなり重宝しています。
もちろん画像のサイズはそのまま変更はしないで保存できます。
使い方はとても簡単で容量を小さくしたい画像を選択し、サイトにドラック＆ドロップするか、画像を参照させるかのどちらかであとは勝手にツールが圧縮をかけてくれます。
それをダウンロードして完了です。
画像編集ソフト「Photoshop」を使った画像の書き出し形式
画像を扱うにはAdobe Photoshopがおすすめです。
色々な書き出し形式に対応しているので、画像の元データから最適なサイズと容量で保存する事が出来ます。
理由：画像書き出し時に画像のプレビューが出てきて画質の調整やファイル形式・ファイルサイズ・容量を確認できる為。
画像保存の書き出し形式には下記４種類のパターンが一般的です。
・【Gif】Gifはアニメーションをさせる画像を保存する際に適した画像形式です。
・【Png8】Png8は画像の色数が少なく、ベタ塗りやイラスト画像を保存する時に適しています。
・【Png24】Png24は背景透過など、透過画像を保存する際に適した画像形式です。
こういった画像のそれぞれの特徴を踏まえた上で形式別に画像保存すると画像の容量を抑えつつ、最適化された画像で保存することができます。
サイトスピードはSEOに大きな影響を及ぼす：画像を軽くしよう
最後に、サイトやブログの表示速度の重要性を説明します。
近年ではGoogleがサイトパフォーマンスの指標を作りSEOの観点でもかなり重要視しています。
今後、速度が遅いページに対してはSlowのラベルが着いたり、ローディング中のゲージが長く表示されたりといった仕組みが搭載されると言われています。
そもそもスピードが遅いサイトやブログはグーグル検索結果の上位には上がってこないかと。
これはすべてユーザー体験を考慮されたアルゴリズムの変化です。
そこでサイト運営をしている企業やブロガーはこぞってサイトのパフォーマンス改善に努めています。
そして、サイト自体の容量を大きくしているのは画像データが大半を占めます。
そこで画像の最適化が必須となる訳ですね。
今回紹介したようなツールを使ったり、画像保存形式を変えるだけでもかなり画像の容量は縮小できます。しかも画像劣化も気にならない程度に。
サイトスピードの改善はどんどん加速していくので、是非この機会に画像最適化を試してみてください。
それではまた！
コメント