webcan analyze gcs-tc-school.com
HEALTH & SPORTS · 佐賀県 · PICKED 2026.10.17
グラスコート佐賀テニススクール健康・スポーツのホームページデザイン参考 — テニススクール・オレンジ・丸ゴシック
EDITOR'S NOTE編集部の視点
オレンジの背景に丸く切り抜いたレッスン風景を置き、「テニスで笑顔でつながる輪」と気軽さを伝える。
佐賀県佐賀市金立町のインドアテニススクールのサイト。ファーストビューはオレンジの背景に、丸く切り抜いたレッスン中の写真と、白い丸ゴシックのコピーを置いている。スクールの紹介、手ぶらでの無料体験、4つのコースと料金の目安、スクール生の声、所属コーチ、料金・スケジュール、お知らせ、施設紹介と続き、最後に電話と無料体験レッスンのボタンを並べている。
- 01オレンジの背景に、丸く切り抜いた写真と白い丸ゴシックのコピーを置いた明るいファーストビュー
- 02オレンジとティール（青緑）の2色で、セクションの区切りを大きな曲線で見せている
- 034つのコースを色分けし、それぞれに「¥9,900〜」などの料金の目安を付けている
CONVERSION集客の工夫
ヘッダーに電話と無料体験を常に出す
画面の上に固定したヘッダーに、電話番号と受付時間、オレンジの「無料体験レッスン」ボタンを置いている。どこまで読み進めても、気になったときにすぐ問い合わせられる。
コースごとに料金の目安を出す
一般・ジュニア・GCSアカデミー・ソフトテニスの4コースに、それぞれ「¥7,700〜」「¥22,000〜」といった料金の目安を付けている。トップページで費用感がつかめると、体験の申し込みまでの迷いが減る。
「手ぶらで無料体験」を早めに見せる
スクール紹介のすぐ後に「手ぶらで無料体験」の案内を置き、ラケットやシューズを持っていなくても参加できることを伝えている。始める前の不安を先に取り除いてから、コースの説明に進む順番になっている。
チェック項目は 2026.10.17 に実ブラウザで描画したトップページを自動判定したものです。
COLOR配色
背景は面積、文字は文字数で重み付けして実測した色から、役割ごとに整理しています。
TYPOGRAPHYフォント
- 用途
- 和文見出し・本文
- 使用フォント
- 新丸ゴ（TypeSquare）
- 無料で近いもの
- Zen Maru Gothic
- 用途
- 和文本文の一部
- 使用フォント
- ゴシックMB101（TypeSquare）
- 無料で近いもの
- Noto Sans JP
- 用途
- 英字（小見出し・背景の英字）
- 使用フォント
- Quicksand
- 無料で近いもの
- Quicksand
| 要素 | PC サイズ / 太さ | PC 行間 | SP サイズ / 太さ |
|---|---|---|---|
| h1 | 18px / 400 | 1.00 | 14px / 400 |
| h2 | 48px / 700 | 1.50 | 24px / 700 |
| 本文（p） | 14px / 400 | 1.50 | 14px / 400 |
| ボタン | 16px / 400 | 1.00 | 16px / 400 |
実測値（PC 1440px・SP 375px、2026.10.17 計測）。同じ要素で最も多く使われている指定を表示しています。h1 をロゴや小さな見出しに使っているサイトでは、h1 の値が小さく出ます。
STRUCTUREページ構成（上から順に）
- 01
- 02
- 03
- 04
- 05
- 06
- 07
- 08
- 09
- 10
- 11
- 12
DOWNLOADワイヤーフレームをダウンロード
この構成を、Figmaで編集できるワイヤーに
上のページ構成を、WEBCANのワイヤーフレーム部品で組み直したものです。元サイトの文章・画像・コードは含みません。
Figmaでの使い方
- SVGをダウンロードする
- Figmaのキャンバスにファイルをドラッグ＆ドロップする
- セクションごとにレイヤーが分かれた状態で開くので、順番の入れ替えや文言の差し替えから始める
文字はテキストレイヤーとして入ります（フォントは Noto Sans JP）。
REPRODUCEこのサイトを参考にするときのポイント
- 011色のメインカラーを背景に広く使い、写真を丸く切り抜いて明るさと親しみやすさを出す
- 02固定ヘッダーに電話番号と体験申し込みのボタンを並べ、いつでも問い合わせられるようにする
- 03コースや料金プランは色分けしたカードにし、料金の目安を添える
- 04「手ぶらでOK」など、始める前の不安を取り除く一言を早めに見せる
FAQよくある質問
グラスコート佐賀テニススクールのサイトで使われているフォントは？
和文はモリサワの新丸ゴとゴシックMB101（TypeSquare）、英字は Quicksand です。無料で近づけるなら、和文の見出しは Zen Maru Gothic、本文は Noto Sans JP が使えます。
スポーツスクールのサイトに料金を載せるべきですか？
詳しい料金表は別ページでも、トップページに「¥9,900〜」のような目安を出しておくと、体験に申し込む前の不安が減ります。このサイトもコースごとに目安を出し、詳しい料金・スケジュールは別ページに分けています。
どんな業種の参考になりますか？
テニス・スイミング・ダンスなどのスクールや、フィットネスジム、子ども向けの習い事教室など、体験レッスンから入会につなげたい業種に応用できます。
FROM REFERENCE TO YOUR SITE
このテイストで、
御社の健康・スポーツ施設のサイトを。
「グラスコート佐賀テニススクールのような構成で」とお伝えいただくだけで構いません。無料相談で御社の現状サイトを拝見し、地域と業種に合わせた構成案をお持ちします。
無料相談はこちら