GitHub README、Issue、プルリクエスト、Wikiの画像はただそこにあるわけではありません — それらのページを見るすべての開発者がロードします。複数の大きな未圧縮スクリーンショットがある READMEはロードに数秒かかり、リポジトリのサイズにメガバイトを追加します。 GitHubにアップロードする前に画像を圧縮することは、リポジトリをクリーンで高速でプロフェッショナルに保ちたい開発者にとって良い慣行です。

GitHubの画像サイズ制限

リポジトリファイル：50 MBを超えるファイルは警告を生成し、 100 MBを超えるファイルはプッシュがブロックされます。リポジトリにコミットする場合、画像はそれぞれ1 MB未満にする必要があります
Issue/PRのドラッグ＆ドロップアップロード：GitHubはIssueとプルリクエストの画像添付ファイルに対してファイルあたり最大10 MBを許可します
ベストプラクティス：READMEとWikiコンテンツのすべての画像は 200 KB未満に、Issue/PR添付ファイルは500 KB未満に保ってください

GitHub画像に最適な形式

PNG：GitHub READMEのスクリーンショット、コードスニペット、ダイアグラムに最も一般的な形式
WebP：GitHub Markdownはすべての最新ブラウザでWebPを正しくレンダリングします。 WebPはJPEGより25〜35%小さいです
SVG：GitHubはMarkdownでSVGファイルをインラインでレンダリングします。ダイアグラム、アーキテクチャチャート、バッジに理想的です

GitHub READMEの画像圧縮手順

スクリーンショットを撮る：画面全体ではなく関連する領域だけをキャプチャします。画像クロップを使用して不要な余白をトリミングしてください
表示幅にリサイズ：GitHubはデフォルト列でREADME画像を最大約800 px幅でレンダリングします。画像リサイズを使用して最大1200 pxにリサイズしてください
画像を圧縮：画像圧縮を使用してファイルサイズを削減してください。READMEインライン画像の場合200 KB未満を目標にしてください
最新のリポジトリにはWebPに変換：画像変換器を使用してWebPに変換してください

GitHubデモ用GIFの最適化

GitHubのIssueとREADMEでのデモ、バグ再現、機能プレビューを示すアニメーションGIFは一般的です。未圧縮の画面録画GIFは簡単に20〜50 MBになります。

長さを制限：デモGIFは10秒未満に保ってください
フレームレートを下げる：ほとんどのUIデモには10〜15 fpsで十分です
解像度を下げる：デモGIFには600〜800 px幅で十分です

GitHub画像を小さく保つことはプロフェッショナルな職人技の証です。クイック圧縮には画像圧縮を、大きなスクリーンショットのスケールダウンには画像リサイズを、形式変換には画像変換器を使用してください。