Webサイトづくりの基本の「き」を初心者向けに紹介します!Webサイトを作る時の基本とは??どんなところを気をつければいいの??について、イメージを紹介したいと思います!
初心者の…「し」!
初心者の中の初心者🔰か…
この説明、わかるといいね…
Webサイトは、Webページがたくさんまとまったものです。サイトには、記事ページやプロフィールページ、トップページなどがあり、それぞれがリンクやサイトマップによってつながっている状態がWebサイトとなっています。
Webサイト作りの基本
よいWebサイトとは
良いWebサイトとは、極論を言えば優良な記事(コンテンツ)を、それを必要とする人に的確に素早く表示できるもの!これに尽きます。
具体的には、以下の項目になります。
リンクが整理されている
訪問者が迷わないWebページとは、コンテンツの内容が整理されていて、それぞれの記事がリンクで分かりやすく構成されていることです。
記事内で出てきた話題について関連する記事をリンクする、次読む記事を表示させる、トピックスごとにサイト内で検索できるようにするなどで、サイトを訪問してくれた人が読みたいページをすぐに探すことができるように、サイト内を整理し、見やすくなるように心がけましょう。
各ページに重複がない
Webサイトの中で記事内容などが重複しないようにすることも大事です。同じような内容のページがあると、訪問者はどちらを読めばよいのか迷ってしまいます。
また、Googleでの検索性能も低下するとともに、複数のWebページに評価が分散することになるため、Googleからの評価も下がってしまいます。
Webサイト内の重複コンテンツはGoogle Search Consoleで確認することができます。
Google Search Consoleにログイン⇒セキュリティと手動による対策⇒手動による対策をクリック
この段階で、重複コンテンツと判断されるページがあれば、「重複しています」と表示されます。特に指摘がなければ「問題は検出されませんでした」と表示されます。
サイト全体がサクサク動く
Webサイトを訪問してきたとき、表示速度が遅いとイライラしたり、最悪の場合見るのをやめてしまうこともあり得ます。優良な情報があっても、それを見てもらえなければGoogleからの評価も下がってしまいます。
表示速度を改善するための対応は、以下となります。
記事自体のコンテンツ量や、ファイルサイズの大きな画像や動画が記事内で使われていると、記事の読み込み速度低下につながります。
記事のファイルサイズの最適化
対策としては、記事内の文字数を増やしすぎない、画像のピクセル数を減らすなどで対応します。
記事内に使用する画像は、美術展などで展示するような精細な画像は通常使用しません。
ダウンロード素材等目的があって高画質のものを使用する以外は、記事として読みやすい程度の画像で十分です。アイキャッチ画像などは、横800~1200px程度で十分表示されますので参考にしてください。
画像の保存形式でも多少の差があり、JPEG形式やPNG形式などがあります。グラデーションなど色彩が多用されている画像の場合はJPEGを使用し、それ以外はPNG形式にすることでファイルサイズの最適化につながります。
こちらの詳細は別記事で紹介します。
記事の読み込みを高速化
ブラウザ検索では、Webページの表示速度が遅いと、訪問者に見てもらえないこともあるとお伝えしました。
Googleでも、ページの表示速度が早い事がユーザー(ブラウザ検索する人)にとって重要なポイントと述べています。
つまり、ページ表示速度は検索順位に影響します。
記事を表示する一般的な方法は、ページが読まれる前にページ内のすべての記事や画像をロードします。この方法だと、表示に時間がかかる場合があります。
一方、実際に表示させたいのは、訪問者が目にする画面に表示されている部分だけなので、その部分だけをロードすることで記事の読み込み速度を改善することが出来ます。
遅延ロードと呼ばれるこの設定は、別記事で紹介します。
訪問者に最適な、優良な記事内容
Webサイトを検索して訪問する人は、Webサイト(ページ)内の関連するキーワードを頼りに訪問してきます。そのため、記事本文やタイトルには、訪問者が検索しやすいような文字を入れる必要があります。
極端な例だと、「猫」についての話題なのにタイトルにも本文にも「猫」の文字が使われておらず、画像のみで猫が表現されている場合です。
もふもふでゴロゴロしてにゃーって鳴くなまもの…
猫って何となくわかるけどね…
検索は文字に対して行われるため、この場合、検索する方はこのページにたどり着くことは難しくなるため、来てほしいターゲットの訪問者に対してよい情報を提供できないことになります。
Webページの中で重要なキーワードは、必ず「文字」で記事の中に入れ込んでください。
Googleが理解しやすいWebサイト作りとは
Webサイト内で、適切にリンクを張ることが重要です。リンクの貼られていないページはそもそもGoogleから認識されません。適切な「最近の記事一覧」「人気記事」「記事内の関連記事」などでリンクを張りましょう。
専門的なところになると、W3C(ダブリュサンシー)基準に沿ったサイト作りを目指すことになります。
また、HTMLやCSSなどのWebサイトを制作する上で使う基盤(Webサイトを構成する言語)を正しく使用することも大事となります。この辺も専門的となりますので、HTMLやCSSを編集できるくらいのスキルのある方のみチャレンジしてみてください。
私にはもう少し時間と技術が必要なようです!
ただし、HTMLやCSSなどの変更は、1文字でも誤字・脱字、スペース等を間違うとサイト自体が機能しなくなりますので注意してください。
私などは、サイトのカスタマイズはちょっとハードルが高いので、Wordpressの「Cocoon」テーマをそのまま使用しています。
まとめ
Webサイトづくりの基本である、良いWebサイトとは?についてイメージできましたか??
優良な記事(コンテンツ)を、それを必要とする人に的確に素早く表示させること!
そのためには、以下が重要でした!
参考にしてみてください!