<p class="thumb"><img src="http://web-marketing.zako.org/wp-content/uploads/2009/09/Towson-University.jpg" alt="タウソン大学のキャンパスマップが分かりやすい" title="タウソン大学のキャンパスマップが分かりやすい" width="514" height="204" class="alignnone size-full wp-image-8756" /></p><p>もはや施設案内図やアクセスマップをウェブ上で表示するのに、Googleマップを使うのが当たり前になりつつありますよね。</p><p>今回はそのGoogle Maps APIをうまく活用した分かりやすい施設案内マップをご紹介します。</p><!--more--><h3 class="header-label">タウソン大学のキャンパスマップが分かりやすい</h3><p>「<a class="web-site-link" href="http://www.towson.edu/main/maps/index.asp" onclick="window.open('http://www.towson.edu/main/maps/index.asp'); return false;">Towson University Campus Map</a>」は、<strong>Google Maps API を活用した、大学のサイトに設置された学校内の施設案内図。</strong></p><p>ピンをうまくグループ分けに活用しており、とても分かりやすいものになっています。</p><h4 class="tips">タウソン大学のキャンパスマップ</h4>[caption id="attachment_8935" align="alignnone" width="512" caption="↑これがGoogleマップで作られたキャンパス内の案内図。施設の種別によって表示を絞り込めるのも便利です。"]<img src="http://web-marketing.zako.org/wp-content/uploads/2009/09/Towson-University1.jpg" alt="これがGoogleマップで作られたキャンパス内の案内図。施設の種別によって表示を絞り込めるのも便利です。" title="タウソン大学のキャンパス案内図" width="512" height="311" class="size-full wp-image-8935" />[/caption][caption id="attachment_8936" align="alignnone" width="512" caption="↑施設の様々な詳細情報ともリンクしています。助かるだろうな。"]<img src="http://web-marketing.zako.org/wp-content/uploads/2009/09/Towson-University2.jpg" alt="施設の様々な詳細情報ともリンクしています。助かるだろうな。" title="施設の詳細情報もマップに表示。" width="512" height="275" class="size-full wp-image-8936" />[/caption]<p>興味のある方は<a class="web-site-link" href="http://www.towson.edu/main/maps/index.asp" onclick="window.open('http://www.towson.edu/main/maps/index.asp'); return false;">Maps - Towson University</a>へどうぞ。</p><p>まだまだ見栄えの良い画像のマップをサイト上に表示しているケースがほとんどですけれど、Googleマップをうまく活用するだけでも、離脱率の軽減、滞在時間向上やユーザビリティを格段に改善することが可能でしょうね。</p><p>そういった意味でも、非常に参考になる一例になるのでは？</p><p>Via：<a class="website-link" href="http://delicious.com/url/bc558d9915aff037aa4006aff0a8f3c1" onclick="window.open('http://delicious.com/url/bc558d9915aff037aa4006aff0a8f3c1'); return false;">delicious</a></p>