[HTMLタグ]Webサービス・ブログ超初心者が学習のきっかけに知っておくべき5選




スマホやパソコンをやっていると自分もWebサービスやブログを始めたいという人は結構多いと思います。

ですが、プログラミングを知らない人にとってわからないものが多すぎます。

私も初心者時代は何をすればよいのか全く分からず諦めてしまう時期もありました。

どれくらいまで必要なのかも良くわからないので本当に大変です。

そこで、ほんの少しだけの知識で悩みを解決するタグを紹介します。

 

HTMLとは何か

Webに文章を記述するコンピュータ言語ですが、ざっくりいうとWebサイトのほとんどはHTMLで書かれていてWebを構成している要素です。

正式名称:HyperText Markup Language

HTML image

HTMLの使い方

ブログの場合、ビジュアルからテキストに切り替えて、保存後ビジュアルに戻すとHTMLが反映されます。

通常のHTMLの場合、テキストドキュメントを開きます、最後に「名前をつけて保存」で名前欄の最後に.htmlと入力して保存。その後テキストドキュメントだったものをクリックすればHTMLが反映した画面に変わります。

例えば 練習.html です。
*テキストドキュメント:デスクトップ画面で右クリック→新規作成→テキストドキュメント

 

改行するために必要なタグ<p>

改行は人に文章を効果的に見せるためは欠かせませんがブログをやっているとうまくいかないことが結構あります。
そんなときに役に立つのが<p>タグ

[html]<p></p>[/html]

pとpの間に文字を入力すると改行が出来ます。

例文

例文

文字のサイズを変えるタグfont-size

文字を大きく見せたいと思ったときに必要なタグです。

[html] <span style="font-size: 30px;"></span>
[/html]

ここでは30pxとしてますが30を自分の好きな大きさに指定すればOKです。

<span style=”font-size: 20px;”>サイズを変えたい文字</span>

引用のするときのタグ<blockquote>

人の文章を引用して話を進めてるためのタグです。

[html] <blockquote></blockquote>
[/html]

読み手に引用であることを伝える意味もありますが、Googleなどの検索エンジンにも引用であることを知らせます。

引用

 

文章を強調するタグ<strong>

文章を邪魔しないで文字を太くするタグです。

[html] <strong></strong>
[/html]

文章を書いているときに重要な部分などに使うと目を引きますよ。

 

重要

文字に色をつけるタグcolor

文字を様々な色に変更することが出来るタグです。

[html] <span style="color: Green"></span>
[/html]

色文字は読みにくくなるのであまりお勧めはしませんが、フォントサイズを大きくして更に色をつけると印象深くなります。
なので、フォントを大きくして色をつけるするタグを書いておきます。

[html] <span style="font-size: 20px; color: Green;"></span>
[/html]

実はspan style=の後に””内に入力するだけで簡単にできます。

(!?)

*配色は英語で入力することが出来ますが、主流はコードを入れる方法です。やり方はGreenの部分を色の名称(blue)やコード(#c0c0c0)等にコピペするだけです。
*コピー Ctrl+C
*ペースト Ctrl+V

配色については次のサイトがおすすめです。

和色大百科

たくさんの色があって分類化もされているので意外な色が発見できますよ

まとめ

いかがだったでしょうか。

この5つがあれば無機質だった文字をかっこよく見せることができますよ。
もっと勉強をしたくなったという人は次のサイトをおすすめします。

HTML入門 ドットインストール

ドットインストールは動画で学べる上に1講義3分以内なので必要な知識が的確にまとめられています。
私はここで基本的な知識を学びました。ぜひ、活用してみてください。

ではまた、