ホームページ活用
ホームページにアクセスマップを
載せる方法【無料】
お店のホームページに「アクセス」ページは必須です。Googleマップの埋め込みが一般的ですが、デザインの自由度が低く、サイトの雰囲気に合わないことも多いです。この記事では、オリジナルのアクセスマップ画像をホームページに使う方法を解説します。
Googleマップ埋め込みとの違い
🗺️ Googleマップ埋め込み
- インタラクティブで操作できる
- デザインがGoogleのまま
- サイトの表示が重くなる
- Googleのサーバー依存
🖼️ オリジナル地図画像
- デザインを自由にカスタム
- サイトのデザインに統一感
- 表示が軽い・速い
- 商用利用も安心
両方を併用するのがベストです。オリジナル地図画像でデザインを整えつつ、「Googleマップで見る」ボタンを設置することで、ナビを使いたいお客様にも対応できます。
広告 — AdSense 728×90
ホームページへの掲載手順
1. アイマップで地図画像を作成する
imap-site.net で住所を入力して地図を生成し、PNG画像として保存します。サイトのカラーに合わせてスタイルを選択しましょう。
2. 画像をホームページにアップロードする
WordPressの場合はメディアライブラリにアップロード、HTMLサイトの場合はimagesフォルダに入れてimg タグで表示します。
3. Googleマップへのリンクも設置する
地図画像の下に「Googleマップで見る」ボタンを設置すると利便性が高まります。GoogleマップのURLは「共有」から取得できます。
推奨サイズ：ホームページ用は横幅800〜1200px程度が見やすいです。アイマップで生成した画像は高解像度なので、CSSで最大幅を指定してレスポンシブ対応にしましょう。
業種別のスタイル推奨
- カフェ・レストラン：カラーまたはガーリースタイルで温かみのある印象に
- クリニック・歯科：ライトスタイルで清潔感のある印象に
- 美容室・サロン：ガーリーまたはダークスタイルでおしゃれ感を演出
- 不動産・士業：ライトまたはダークスタイルで信頼感のある印象に