ガイド

ファイルが大きすぎても、どの設定から変えればよいかは案外わかりにくいものです。PNG と WebP の選択、容量を減らす順序、カラーコードの読み方、写真を共有する前の確認事項を、Boltpic の実際の動作を確かめながらまとめました。

• PNG・JPG・WebP の選び方

  写真、スクリーンショット、透過グラフィックでは適した形式が異なります。PNG・JPG・WebPの圧縮方法と選び方を、実際の作業に沿って整理しました。

  2026 年 7 月 28 日確認

• 画像を軽くする方法 — 画質は守ったまま

  容量を減らすときに調整しやすいのは、ピクセル寸法・形式・圧縮品質です。余計な画質劣化を避ける順番と確認方法を解説します。

  2026 年 7 月 28 日確認

• HEX・RGB・HSL — カラーコードの読み方

  #e63946、rgb(230, 57, 70)、hsl(355, 78%, 56%) がそれぞれ何を意味するのか、どの表記をいつ使うと便利か、画像から正確な値を拾う方法まで解説します。

  2026 年 7 月 28 日確認

• Web ページを速くする画像最適化チェックリスト

  画像寸法、形式、読み込み優先度、レイアウトの安定性を点検し、LCP に影響する可能性がある要因を確認します。

  2026 年 7 月 28 日確認

• 投稿する前に隠す — 写真の個人情報の処理法

  宅配ラベル、ナンバープレート、画面、通行人。投稿前に確認するもの、弱いぼかしが十分な保護にならない理由、ブラウザで隠す方法をまとめました。

  2026 年 7 月 28 日確認

• CSS グラデーション実践ガイド

  linear-gradient・radial-gradient・conic-gradient をコピペで使える例で習得。ヒーローのオーバーレイ、グラデーションテキスト、ストライプ、バンディング対策まで。

  2026 年 7 月 28 日確認