ホームページがスマホで崩れる・見づらいときの直し方
こんな状態ではありませんか
- スマホで見ると文字が小さく、指で拡大しないと読めない
- 横スクロールが出て、画面からはみ出している
- ボタンやメニューが押しづらい・反応しない
- パソコンでは問題ないのに、スマホだけレイアウトが崩れる
まず、今のサイトの状態を確かめる
URLを入れると、実際にサイトを読み取ってviewport設定の有無・固定幅で組まれているか・タップできる要素の間隔・画像の表示サイズなどを確認し、リニューアル後の構成案まで無料で表示します(登録不要・営業電話なし)。
なぜ起きるのか
1. viewport(ビューポート)の指定がない
スマホ対応の最低条件である1行の設定が入っていないと、PC用の画面をそのまま縮小して表示します。2010年代前半までに作られたサイトに多く見られます。
2. 固定幅(px)で作られている
「幅950px」のように数値で固定されていると、画面幅の狭いスマホでははみ出します。可変幅(レスポンシブ)への作り替えが必要です。
3. 一部のパーツだけ対応できていない
本体はスマホ対応でも、後から足した表・地図・画像だけがはみ出している場合があります。この場合は部分修正で直ります。
選択肢と、費用のめやす
はみ出している箇所が限られている場合。スポット対応の会社に1箇所単位で頼めます。
本体が固定幅の場合。デザインはそのままに、表示の仕組みだけ作り替えます。
10年以上前のサイトは、スマホ対応の改修費と作り直しの費用が近くなることがあります。診断で構成案を見てから判断できます。
※この課題に対応する掲載社534社のうち、料金を公開している222社の実測では、最安プランの中央値は15万円です。要件によって上下するため、診断で条件を絞ってから確認してください。 (費用の実測データ)
次にやること
今のサイトを診断して、構成案を見る →
直すべき点と、既存の素材をどこまで活かせるかが分かります。
この課題に対応できる会社を見る →
534社を掲載しています(掲載料による順位付けはしていません)。
何から手をつけるか相談する →
作り直すべきか、部分修正で足りるかの判断から相談できます。相談のみで完了しても問題ありません。