画像圧縮＆モックアップ
画像ファイルを高品質のまま圧縮し、Webページの読み込み速度を劇的に改善します。
Core Web Vitalsの主要指標であるLCP（最大コンテンツの描画）を最適化し、PageSpeed Insightsのスコアを向上させます。すべてブラウザ内で処理されるため、画像が外部に送信されることはありません。
画像を高品質のまま圧縮してファイルサイズ削減。スマホ・PC枠のモックアップ作成も可能。ブラウザ完結で安全・無料。
🗜️ 画像圧縮
画像ファイルを高品質のまま圧縮してファイルサイズを削減します
画像をドラッグ＆ドロップ
または
対応形式: JPG, PNG, WebP
📱 モックアップビルダー
スマホやPCの枠に画像をはめ込んでプロフェッショナルなモックアップを作成
画像をドラッグ＆ドロップ
または
対応形式: JPG, PNG, WebP, GIF
使い方
画像圧縮
画像をアップロードして、画質とサイズを調整後、圧縮ボタンをクリック。元のファイルサイズと比較して確認できます。
モックアップ作成
スクリーンショットをアップロードし、デバイスタイプと背景を選択。モックアップを生成してダウンロードします。
一括処理
圧縮機能では複数ファイルを同時にアップロード可能。まとめて圧縮して個別にダウンロードできます。
このツールの特徴
完全ブラウザ処理
画像はサーバーに送信されず、ブラウザ内で処理されるため安全です
高速処理
最新の圧縮アルゴリズムにより、高品質を保ちながら高速に圧縮
デバイス枠対応
iPhone、Android、PC など主要デバイスのモックアップに対応
カスタマイズ可能
画質、サイズ、背景色など細かく調整可能
🚀 Core Web Vitals改善と画像圧縮
LCP（Largest Contentful Paint）の最適化
LCPは、ページ内で最も大きなコンテンツ（通常は画像やヒーロー画像）が表示されるまでの時間を測定します。Googleは2.5秒以内を「Good」と評価し、これを超えるとSEOランキングに悪影響を及ぼします。
画像圧縮により、ファイルサイズを50〜80%削減できるため、LCPを大幅に改善できます。例えば、3MBのヒーロー画像を300KBに圧縮すると、4G環境で約2秒短縮されます。
PageSpeed Insightsスコアへの影響
PageSpeed Insightsは、画像最適化を最優先の改善項目として指摘します。適切に圧縮された画像は、以下の指標を改善します：
- LCP（Largest Contentful Paint）: 目標2.5秒以内
- FCP（First Contentful Paint）: 初回コンテンツ表示の高速化
- CLS（Cumulative Layout Shift）: 画像の明示的なサイズ指定でレイアウトシフトを防止
圧縮方式の選択: 可逆 vs 不可逆
- 不可逆圧縮（JPEG/WebP）: 画質を犠牲にしてファイルサイズを大幅削減。Web画像に最適で、画質80〜90%で視覚的な劣化はほぼありません。
- 可逆圧縮（PNG）: 画質を保ったまま圧縮。ロゴやアイコンなど、透過が必要な画像に使用。ただし、写真には不向きです。
- 次世代フォーマット（WebP/AVIF）: JPEGより25〜35%小さいファイルサイズで同等の画質を実現。主要ブラウザで広くサポートされています。
推奨設定とベストプラクティス
画質80〜85%が最適バランスです。これ以上の画質設定は、ファイルサイズが急増する一方で、視覚的な改善はほとんどありません。また、最大幅1920pxに制限することで、4K画像の無駄なダウンロードを防げます。
レスポンシブ画像（srcset属性）と組み合わせることで、デバイスごとに最適なサイズを配信でき、モバイル環境でさらに高速化できます。
よくある質問
Q. 画像はサーバーに保存されますか？
A. いいえ、すべての処理はブラウザ内で完結し、画像がサーバーに送信されることはありません。
Q. どのくらいファイルサイズを削減できますか？
A. 画質設定にもよりますが、一般的に元のサイズの30〜80%程度削減できます。画質80%で約50%削減が目安です。
Q. 一度に何枚まで圧縮できますか？
A. 技術的な制限はありませんが、ブラウザのメモリを考慮して10枚程度が推奨です。
Q. モックアップの画像サイズはどのくらいですか？
A. デバイスタイプによりますが、スマホは約1200px、PCは約2400px幅で生成されます。