トップページ textエディタ HTMLエディタ テンプレート サーバーの準備 FTPソフト
 
スマホ対応ホームページは、なぜ必要なのか?

多くの人がスマホを持つ現在、ホームページをスマホで見るという機会が多くなっています。 パソコンはなくても、スマホでネットを見るという人は多いはず。

店舗がある飲食店、美容室、整体、接骨院、鍼灸院・・・
緊急性が求められる病院や鍵を無くしたなどのトラブル系の業者・・・

これらは、緊急性と手軽さからほとんどスマホなどから検索して探すことが多いですね。
ホームページ作成依頼のお客様からも「スマホ対応で・・・」という希望が当たり前のようになっています。
そこで、ここではスマホ対応のホームページ作成の手順をお話しますね。
 

 スマホサイトを作成する時の注意点

スマホサイトは、パソコン用のサイトでもそのまま閲覧できますが、パソコンと違ってサイズが小さいために読みにくい、タップしにくいなどの問題点があります。

今あるホームページを、自動でスマホ変換(レスポンシブ方式)などの方法もありますが、 見やすさ、使いやすさを優先するなら、「スマホ専用のレイアウト」を作成する方がお勧めです。

 

 専用テンプレート

スマホサイトは、サイドバーを下に置くなど、レイアウトはシンプルなものが閲覧しやすいです。ボタンも押しやすく、分かりやすくすることが大事ですね。 かといって、パソコン用サイトと違ったイメージになってもよくないので、イメージカラーを変えないなど、工夫して作り替える必要があります。

先ずは、ホームページと同じようにスマホ向けの有料、無料テンプレートを利用するといいと思います。
 

 作成してみる

デザインが決まれば、基本はパソコン用と同じなので、文章、画像をスマホサイトにも同じように作成していきます。 スマホは、解像度が高いので、パソコンのホームページの画像をそのまま使うと画像が荒れて見えたりしますので、工夫が必要です。

各ページのヘッド部分に「検索エンジンにヒットしないようにするパーツ」を入れます。 一つのフォルダーにスマホサイトのデータを入れ、フォルダー名を「sp」とし、レンタルサーバにアップしてあるパソコン用のホームページに入れます。 また、そのパソコン用サイトファイルの中に、訪問者の端末に合わせて自動的に「sp」を表示させる「.htaccess」というファイルを入れます。 これは、対応してないサーバもありますので、注意してください。

※「.htaccess」とは、アクセス制限・ユーザー認証・リダイレクト(自動転送)・エラーページのカスタマイズなど、 様々な特殊設定ができるファイルです。

※macユーザーは、パソコン上では「.htaccess」が「不過視」になっているために見えません。 サーバにアップするまでは「0.htaccess」として、アップしてからファイル名を「.htaccess」に戻してましたが問題ありませんでした。
 

 確認する

サイトの確認は、モバイル フレンドリー テスト で、出来ますから確認してみてください。



Copyright © 2015 ホームページ作成お助け情報まとめ All rights reserved.
by 無料ホームページ制作講座