ハシウェブ

Web制作、プログラミングに関する情報を発信するブログ

アフィリエイト広告を利用しています

Webページ高速化に必要な画像最適化ツールまとめ

この記事は、最初の投稿から5年以上が経過しています。

最終更新から2039日が経過しています。

Webページ高速化に必要な画像最適化ツールまとめ

「ブログを高速化するために画像を最適化する方法を知りたい」
「簡単に画像最適化をしたい」

悩み

画像最適化するためのツールを紹介します。

目次
  1. 圧縮
    1. Optimizilla
    2. TinyPNG
  2. リサイズ
    1. 画像リサイズツール
    2. 縮小専用
  3. トリミング
    1. 画像トリミングツール
  4. WordPress
    1. EWWW Image Optimizer
  5. imageMagick
  6. gulp
  7. まとめ

圧縮

Optimizilla

JPG画像、PNG画像を最大20枚まとめて圧縮できるWebツールです。

画像圧縮ツール – JPEG、PNG、WebP、GIFをオンラインで圧縮

画像を無料でオンライン圧縮。品質を維持しながらファイルサイズを削減。

TinyPNG

「TinyPNG」という名前ですが、PNG画像だけでなくJPG画像も圧縮できます。
無料だと最大サイズが5MBまでですが、有料版のPROにすると最大サイズが75MBまで大きくなります。

TinyPNG – Compress AVIF, WebP, PNG and JPEG images

Free online image optimizer for faster websites! Reduce the file size of your AVIF, WEBP, JPEG and PNG images while preserving the image quality.

リサイズ

画像リサイズツール

JPG画像とPNG画像をリサイズできるWebツールです。


Fatal error: Uncaught ValueError: DOMDocument::loadHTML(): Argument #1 ($source) must not be empty in /home/hashi84/hsmt-web.com/public_html/wp/wp-content/themes/hsmt-web/functions/custom_ogp.php:29 Stack trace: #0 /home/hashi84/hsmt-web.com/public_html/wp/wp-content/themes/hsmt-web/functions/custom_ogp.php(29): DOMDocument->loadHTML('') #1 /home/hashi84/hsmt-web.com/public_html/wp/wp-content/themes/hsmt-web/blog/image-optimisation.php(58): get_ogp('https://www.web...') #2 /home/hashi84/hsmt-web.com/public_html/wp/wp-includes/template.php(812): require('/home/hashi84/h...') #3 /home/hashi84/hsmt-web.com/public_html/wp/wp-includes/template.php(745): load_template('/home/hashi84/h...', false, Array) #4 /home/hashi84/hsmt-web.com/public_html/wp/wp-includes/general-template.php(206): locate_template(Array, true, false, Array) #5 /home/hashi84/hsmt-web.com/public_html/wp/wp-content/themes/hsmt-web/single-blog.php(100): get_template_part('blog/image-opti...') #6 /home/hashi84/hsmt-web.com/public_html/wp/wp-includes/template-loader.php(106): include('/home/hashi84/h...') #7 /home/hashi84/hsmt-web.com/public_html/wp/wp-blog-header.php(19): require_once('/home/hashi84/h...') #8 /home/hashi84/hsmt-web.com/public_html/index.php(17): require('/home/hashi84/h...') #9 {main} thrown in /home/hashi84/hsmt-web.com/public_html/wp/wp-content/themes/hsmt-web/functions/custom_ogp.php on line 29