【第1回】スマートフォンサイト作成講座・無料でこんなことが学べます

【第1回】スマートフォンサイト作成・無料講座 スマホサイト作成講座
記事内にプロモーションが含まれています。

【第1回】スマートフォンサイト作成講座ということで、まずはスマホサイトを作成する際に押さえておきたいポイントや注意点についてお話していきます。

マサムネ
マサムネ

本講座は初心者の方向けの無料講座です。スマホサイトを作る上での基本的なことが学べます。ステップごとに解説していきますので、よろしければご参考にしてください。

スポンサーリンク

本講座で学べること

本講座では、全体を通して以下のようなことを学ぶことができます。

  • スマートフォンサイトを作成する時に注意すべきこと
  • スマホサイトを作成する際に押さえておきたい、レスポンシブデザインについて
  • レスポンシブデザイン対応のスマホサイトの作り方
  • レスポンシブデザインに欠かせない、メディアクエリーについて
  • サイト運営に欠かせないSEOの基礎について(おまけ)

初心者向けの無料講座となりますので、実際にスマホサイト作成時には、主にコピペできるような形で解説していきたいと思います。

こんな人におすすめ

  • スマホサイトを自分で作ってみたい
  • HTMLもあまりわからないので、コピペで作成したい
  • 簡単なものでいいので、シンプルなデザインのサイトを作りたい
  • スマホでみやすいサイトを作成したい

など。

スマートフォンサイトとは?

第1回ということなので、まずは基礎をしっかり固めていきましょう。
ということで、ここでお伝えするスマートフォンサイトとは、スマートフォンから閲覧できるWEBサイト(ホームページ)のことをいいます。

ここで気をつけたいのは「スマートフォン閲覧用に最適化されているか?」という点です。
最適化とは主に以下のようなことをいいます。

  • わかりやすい
  • 読みやすい
  • 表示しやすい

など。

たまにスマートフォンからサイトを開くと「PC用のページが表示される場合」がありますが、画像や文字も見づらく、ボタンなども押しづらいため間違って押してしまい、関係のないページを開いてしまう、、そんな経験はありませんか?

マサムネ
マサムネ

最近は減ってきているかもしれませんが、未だにスマートフォン用に最適化されておらず、PC用のページが表示されてしまうようなサイトも存在します。
ユーザーからするととっても使いづらいですよね。

 

使いづらいという印象をユーザーに与えてしまうと、当然そのサイトに対して不満や不安を持たれてしまうので、再度訪問してくれる可能性は少なくなるわけです。

本講座では、最終的にシンプルではありますが「わかりやすく読みやすいスマートフォンサイト」を作れるところまで解説していきます。

最適化されたスマートフォンサイトの必要性

昨今、当たり前のようにスマートフォンを持ち歩き、いつでもどこでもインターネットを通してWEBサイトにアクセスするユーザーが増えてきました。

デザインが最適化されたスマホサイト

何をするにもネットを使って検索し、必要な情報を手にする人が多くなりましたよね。
私もその一人ですし、私の周りの人達も同様です。
それはやはり簡単にすばやく必要な情報を手に入れたいからです。
(日々皆さんやることが沢山あって忙しいわけですね)

マサムネ
マサムネ

そこで、必要となってくるのがしっかりと最適化されているスマートフォンサイトです。
わかりやすく読みやすい作りにしていれば、ユーザーはストレスなく欲しい情報を得ることができます。

逆に最適化されていないページ(スマホ閲覧時にPCページが表示されてしまう等)は、わかりづらく読みにくいので、ユーザーからは敬遠されがちになり、そのままにしておくとせっかく作ったホームページもずっと見られないものになってしまいかねません。

サイトの見え方について

WEBサイト(ホームページ)を閲覧する際に、気にかけておきたいのがOSとブラウザの種類についてです。

例えば、パソコンにWindows、MacなどのOSがあるように、スマートフォンでも主に以下のようなOSがあります。

  • iOS
  • Android

iOSはiPhone、Androidはそれ以外の機種、といったイメージになります。

 

また、ブラウザに関しては、

  • Safari
  • Google Chrome

など、ユーザーの環境によって複数種類があります。

ブラウザについての詳しい内容は以下のページもご参考にしてください。

 

実は、WEBサイトというのは厄介なもので、OSやブラウザによって見え方が若干異なることがあります。
これはそれぞれの仕様なので致し方ない部分でもありますが、念頭に置くようにしましょう。

マサムネ
マサムネ

見え方が若干異なるといっても、しっかりと作成すれば普通に閲覧する分にはなんら問題ありません。

レスポンシブデザインで運用をスムーズにしよう

レスポンシブデザインとは、簡単にいうと「PCとスマホのページ両方を、ひとつのデータで閲覧しやすいように作成するデザイン方法」です。

もともと、PCサイトとスマホサイトは別々で作る必要がありました。
そのため、PCサイトのこのページのこの部分を編集したら、スマホサイトでも同じように編集する、といった運用コストがかかっていました。

しかし、レスポンシブデザインを取り入れることで、編集作業等が1/2になるため運用コストが抑えられ、比較的スムーズにサイト運営をしていくことが可能です。

マサムネ
マサムネ

本講座(スマートフォンサイト作成)では、「レスポンシブデザイン」にて作っていきますので、スマホだけでなく、PCページも一緒に作成いただけます。

第2回の講座について

次回の「【第2回】スマートフォンサイト作成講座」では、WEBサイトを作成するための下準備をしていきます。

何をするにも下準備は欠かせませんよね。
しっかりと準備を整えることで、WEBサイト作成もスムーズにおこなうことができます。

それでは、また次回の講座でお待ちしています。

タイトルとURLをコピーしました