(お手本)HTML、CSS、WordPressの基礎を学ぼう

目次

HTMLの概念、ホームページを見るということ

スマートフォンやパソコンで、毎日、深く考えることなく、難しく考えることなく、なんとなくホームページを見ていると思います。

これは、スマートフォンやパソコンにすでにインストールされているブラウザと呼ばれる「ホームページ閲覧ソフト(アプリケーション)」を起動して、指定したページのアドレス(URL)にアクセスするというアクションを無意識に実行しているということです。

ブラウザにはさまざまな種類があり、代表的なものは以下になります。

代表的なブラウザ

Google Chrome(グーグルクローム)★

Safari(サファリ)★

Microsoft Edge(マイクロソフトエッジ)★

Mozilla Firefox(モジラ ファイヤーフォックス)★

Internet Explorer(インターネットエクスプローラー)

Opera(オペラ)

上記ブラウザには、パソコン用・スマートフォン用が存在します。

それぞれのブラウザで「一部のHTMLが使えない」「非推奨タグが存在する」など、少しずつの違いがあります(バージョンアップとともにだんだん違いは薄れてきていますが・・・)。

WEBサイト制作者として活動をする際には、ホームページの表示をチェックする際には★が付いたブラウザで確認することをオススメします(なかなか余裕がなくてチェックできていませんが、、、)。

ブラウザの占有率

2022年10月現在、ブラウザの占有率は「Google Chrome」の圧勝です。第二位は「Safari」ですが、Chromeとは大差がついております。

詳しいリサーチ情報は以下のサイトで確認できますので参考にしてください。

[clink url=”https://gs.statcounter.com/”]

HTMLタグを覚える必要性ある?(覚える必要なし!)

英語が苦手でしゃべれなくても、なんとなく理解できる、もしくは、スマートフォンで翻訳できれば、コミュニケーションができるから大丈夫!と思うことができれば、海外旅行に行っても恐れることはありません。

同じように、HTMLもコンピューター言語ですが、HTMLを覚えていなくても、なんとなく理解できる、もしくは、辞書サイトで調べればわかるから大丈夫!と思うことができれば、ホームページ制作は可能です。

ノーコードという環境の発展

「ノーコード」という言葉を、最近、よく聞くようになりました。文字通り、プログラムなどの専門知識を知らなくても、WEBサイトやアプリ制作ができる環境のことを表しています。

これから学ぶWordPressもノーコードの一種と言えます。HTMLの知識がない、CSSとか解らない、何も勉強していないから自信がないと言ってチャレンジしないのはもったいない!

ノーコードの時代到来です。専門知識がなくても、WEBサイト制作できますよ!と言い切れる度胸が必要です。

HTMLはどのように機能しているのか?(概念を知る)

「アドレスをクリックしてホームページを見る」というアクションを分解して流れを知るとHTMLの役割が見えてきます。

ホームページが表示されるまでの流れ

ホームページを作る

ホームページ制作者が、制作者自身のパソコンやタブレットで、人が見て理解できる文章や画像・動画をデザインしレイアウトします。

サーバーにアップロード

次に、出来上がったページの状態をHTMLというコンピューターが理解できる言語で構築し、サーバーに保存(FTPソフトでアップロード)します。

検索する

ホームページを探している閲覧者は、Yahoo!やGoogleなどの検索サイトを利用して目的のホームページを見つけます。街ナカのポスターやチラシ、また、名刺交換した名刺記載の情報からアクセスします。

タイトルをクリック(URLにアクセス)

目的のホームページが検索結果に表示されたら、そのタイトル等をクリックします。タイトルの裏側にはURLと呼ばれるホームページアドレスが隠れており、クリックすることでそのURLを選択し、そのページに遷移します。

もらった名刺などにもURLが記載されています。ブラウザの上部にあるURLバー(アドレスバー、ロケーションバーとも呼びます)に直接、URLを記述し、エンターキーを押します。

クリックされたURL

クリックされたURLは、そのホームページが保存されているサーバーまで回線を通じてアクセス(上り回線)し、サーバーに到達すると、サーバーが支持されたホームページの情報を折り返し、回線を通じてHTMLデータの送信を開始します。

⑥HTMLコードを受信した閲覧者のパソコン(ブラウザ)は、HTMLの指示通りに、正確に文章や画像・動画をレイアウト表示します。

以上が、ホームページを見るという一連の基礎動作となります。

1 2
よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!

この記事を書いた人

ジョシバスタッフです。
やりたいこと、やらなきゃいけないこと、実現したいこと、、、
たくさんあって悩ましい毎日ですが、
ひとつひとつ消化していきますので、
暖かく見守っていただければ幸いです。

コメント

コメントする

目次