---
title: "Androidだけ文字が小さく見えるときの原因と直し方"
description: "AI生成HTMLをAndroidで共有したら文字が小さくなるトラブルに直面した方向け。viewportメタタグの不備やfont-sizeの単位ミスなど主要な原因を解説し、修正手順を具体的に示します。"
image: "https://giga-site.com/og-image.png"
canonical: "https://giga-site.com/articles/android-small-text-fix"
markdown: "https://giga-site.com/articles/android-small-text-fix/index.md"
category: "トラブルシュート"
publishedAt: "2026-06-25"
updatedAt: "2026-06-25"
readingMinutes: 5
---
# Androidだけ文字が小さく見えるときの原因と直し方
共有したHTMLをAndroidで開いたら文字が極端に小さい、という報告はよく届きます。PCのChromeでは正常に見えていても、AndroidのWebViewやChromeはビューポート設定に敏感で、わずかな記述ミスが文字サイズの崩れを引き起こします。原因を特定して修正するまでの手順をまとめました。
> Source HTML: https://giga-site.com/articles/android-small-text-fix
> Article index: https://giga-site.com/articles/index.md
## よくある原因
最も多い原因はviewportメタタグの欠落または誤記です。``がない場合、AndroidのブラウザはページをPC幅（通常980px）として描画し、全体を縮小表示するため文字が極端に小さくなります。AI生成HTMLはこのタグを省略することがあるので、``内に必ず存在するか確認してください。
もう一つの原因はfont-sizeにpxではなくvw単位を使っている場合です。たとえば`font-size: 1.5vw`はPC幅1200pxなら18pxになりますが、Android画面幅360pxでは5.4pxになり読めません。本文テキストにはpxまたはremを使い、vwはタイトルやヒーロー要素に限定するのが安全です。
- 相手がログインなしで開ける状態か確認する
- PCとスマホで最低1回ずつ表示を確認する
- 内部情報・個人情報・不要な外部送信が残っていないか見る
- レビュー期限と修正時の差し替え方を決めておく
## 自分側で確認すること
HTMLファイルをテキストエディタで開き、``タグ内に`viewport`のmetaタグが存在するか検索してください。存在しない場合は``を追加します。initial-scaleを0.5や2.0にしている場合も文字サイズが意図と異なるので、必ず1に設定します。
CSSのfont-sizeを一括確認する手順として、ブラウザのDevToolsを使う方法が便利です。Chromeのデバイスツールバーで端末を「Pixel 7」などに設定し、Elementsパネルでbodyやpタグのcomputed font-sizeを確認します。16px未満になっているなら、該当セレクタのfont-size指定を修正する必要があります。
- HTML内の外部script・form action・iframeを確認する
- APIキーやトークンらしき文字列がないか検索する
- 画像・CSS・JSのパスが公開後も解決できるか見る
- noindexと認証を混同せず、必要なら両方設定する
## 相手側で確認すること
受け取った側がAndroidで見たときに文字が小さい場合、まず「Chromeの設定→フォントサイズ」が「小」になっていないか確認してもらいましょう。ただしこの設定は`text-size-adjust: none`をCSSに指定しているページでは無効化されるため、送り手側がそのプロパティを使っていないかも確認が必要です。
相手のAndroidバージョンとChromeのバージョンも把握できると原因を絞りやすくなります。Android 9以前のWebViewは`-webkit-text-size-adjust: 100%`の挙動が異なります。「設定→デバイス情報→Androidバージョン」で確認してもらい、古いOSであれば`-webkit-text-size-adjust: 100%`をbodyに追加することで改善するケースがあります。
- HTML内の外部script・form action・iframeを確認する
- APIキーやトークンらしき文字列がないか検索する
- 画像・CSS・JSのパスが公開後も解決できるか見る
- noindexと認証を混同せず、必要なら両方設定する
## 再発防止の運用
AI生成HTMLを受け取ったら公開前に必ずChromeのデバイスツールバーで「Galaxy S21」など一般的なAndroid端末でプレビューする習慣をつけましょう。ギガサイト便であれば公開URL発行後にスマートフォンで直接URLを開いて確認できます。この一手間で受信者からの「見えない」報告の8割は防げます。
AIへのプロンプトに「viewportメタタグを必ず含め、font-sizeはpxかremのみ使用し、vwはタイトルのみ」と明記しておくと生成物の品質が安定します。テンプレートとして保存しておき、毎回使い回すことでヒューマンエラーを削減できます。
- HTML内の外部script・form action・iframeを確認する
- APIキーやトークンらしき文字列がないか検索する
- 画像・CSS・JSのパスが公開後も解決できるか見る
- noindexと認証を混同せず、必要なら両方設定する
## よくある質問
### viewportメタタグを追加したのにAndroidでまだ文字が小さいです
CSSにmax-widthや固定widthをpxで指定し、画面幅を超えている可能性があります。bodyに`width: 100%; max-width: 100%`を追加し、コンテナ要素のwidthも%やmaxで指定し直してください。
### iPhoneでは正常に見えるのにAndroidだけ崩れるのはなぜですか
SafariとChromeのデフォルトUA stylesheet、text-size-adjustの扱いが異なるためです。特に`-webkit-text-size-adjust`が未指定だとAndroid Chromeが自動縮小を行うことがあります。bodyに`-webkit-text-size-adjust: 100%`を指定すると改善するケースが多いです。
### 修正後のHTMLをギガサイト便で差し替えるにはどうすればよいですか
ギガサイト便の管理画面から対象の共有URLを選び、「ファイル差し替え」でHTMLを再アップロードします。URLは変わらないため、すでにリンクを共有済みの相手もリロードするだけで修正版を確認できます。
## 関連記事
- [Androidだけ文字が小さく見えるときに共有前に確認するチェックリスト](https://giga-site.com/articles/android-small-text-checklist/index.md)
- [Androidだけ文字が小さく見える問題をAI生成HTMLで防ぐプロンプト](https://giga-site.com/articles/android-small-text-ai-prompt/index.md)
- [Androidだけ文字が小さく見えるときに相手へ伝える確認依頼の書き方](https://giga-site.com/articles/android-small-text-request-message/index.md)
- [OGP画像が更新されないときの原因と直し方](https://giga-site.com/articles/ogp-image-not-updating-fix/index.md)
- [ファビコンが更新されないときの原因と直し方](https://giga-site.com/articles/favicon-cache-fix/index.md)
- [QRコードで開くと404になるときの原因と直し方](https://giga-site.com/articles/qr-404-fix/index.md)
```json
{
"@context": "https://schema.org",
"@type": "Article",
"headline": "Androidだけ文字が小さく見えるときの原因と直し方",
"description": "AI生成HTMLをAndroidで共有したら文字が小さくなるトラブルに直面した方向け。viewportメタタグの不備やfont-sizeの単位ミスなど主要な原因を解説し、修正手順を具体的に示します。",
"datePublished": "2026-06-25",
"dateModified": "2026-06-25",
"mainEntityOfPage": "https://giga-site.com/articles/android-small-text-fix",
"url": "https://giga-site.com/articles/android-small-text-fix",
"inLanguage": "ja",
"image": "https://giga-site.com/og-image.png",
"articleSection": "トラブルシュート",
"author": {
"@type": "Organization",
"name": "ギガサイト便"
},
"publisher": {
"@type": "Organization",
"name": "ギガサイト便"
},
"mainEntity": [
{
"@type": "Question",
"name": "viewportメタタグを追加したのにAndroidでまだ文字が小さいです",
"acceptedAnswer": {
"@type": "Answer",
"text": "CSSにmax-widthや固定widthをpxで指定し、画面幅を超えている可能性があります。bodyに`width: 100%; max-width: 100%`を追加し、コンテナ要素のwidthも%やmaxで指定し直してください。"
}
},
{
"@type": "Question",
"name": "iPhoneでは正常に見えるのにAndroidだけ崩れるのはなぜですか",
"acceptedAnswer": {
"@type": "Answer",
"text": "SafariとChromeのデフォルトUA stylesheet、text-size-adjustの扱いが異なるためです。特に`-webkit-text-size-adjust`が未指定だとAndroid Chromeが自動縮小を行うことがあります。bodyに`-webkit-text-size-adjust: 100%`を指定すると改善するケースが多いです。"
}
},
{
"@type": "Question",
"name": "修正後のHTMLをギガサイト便で差し替えるにはどうすればよいですか",
"acceptedAnswer": {
"@type": "Answer",
"text": "ギガサイト便の管理画面から対象の共有URLを選び、「ファイル差し替え」でHTMLを再アップロードします。URLは変わらないため、すでにリンクを共有済みの相手もリロードするだけで修正版を確認できます。"
}
}
]
}
```