らいふしふったー

20代後半の未経験がプログラミングに挑戦していくサイト。

プログラミング

HTMLとCSSについて学ぶ②

投稿日:2017年1月31日 更新日:

Pocket

こんにちは、今日もHTMLを勉強していました信です。

学びはパズルを作るのと似ています。
一つずつピースを集めて手持ちを増やす、今は分からないピースでも沢山集めたら揃えて繋がるものが出てくる。大きくなったらピースは形になっていきどんどん増える。

1ピースは細かい知識や学びみたいなもので、小さな知識を積み重ねることが大切です。

 

ゲシュタルトって聞いたことはありますか。よく見るのはゲシュタル崩壊なんて言います。

ゲシュタルト 【(ドイツ)Gestalt】
《形態・姿などの意》知覚現象や認識活動を説明する概念で、部分の総和としてとらえられない合体構造に備わっている、特有の全体的構造をいう。形態。(出典:「デジタル大辞泉」)

このゲシュタルトを作り出すには、いくつもの要素・パーツが必要になります。
パズルも表現を変えたようなもので、多くの要素で構成されたものはさらに意味を持つようになります。

何を言いたいかというと全体像を知ることも第一ではありますが、それだけを見ていては意味がなく、中にある細い要素を理解することが大切ということです。
小さいことを面倒くさがらず、地味にコツコツ学ぶことで知識は広がって大きなものになります。

知識はインプットとアウトプットの繰り返しに身につき、知識を実際に使うことで技術となります。
そんなことでHTMLを基礎的なことをアウトプットしていきます。

index.html
<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <title>タイトル名</title>
</head>
<body>
</body>
</html>

今回はこのHTML(HTML5)のテンプレートを説明します。

<!DOCTYPE html> これはDoctype宣言するという意味があり、まずこれを書いてhtmlで構成すると指定します。
※Document Type Defintion (DTD)


<html
lang=“ja”>
この文書はHTML文書で日本語という言語を使用する。lang属性=language(言語)

 

<head>ヘッドタグは文書の(メタ)情報などを書きます。
  <meta charset=”UTF-8″> (メタ情報) この文書の文字コードをUTF-8にする。
※この文字コードを指定することで文字化けなどを防ぐことができます。
  <title> この文書(ページ)のタイトル名を書きます。

<body>ボディタグは文書の本文となる部分などを表すものを書きます。


</head> </boby> </html>は終了タグで、入れ子構造(マトリョシカ)のようになっています。

 

テスト

テスト

-プログラミング
-,

執筆者:


comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

関連記事

no image

DIC4回目の授業

no image

Ruby on Railsの初歩

no image

Progateで学ぶ

こんにちは、Progateでプログラミングを学んでいる信です。 半年〜1年くらい前にProgateをやっていて今まで放置していましたが、また改めてスタートしています!   関連

no image

HTMLとCSSについて学ぶ①

こんばんは、HTMLとCSSを少しずつ学んで行こうと思っている信です。 今日は、「DIVE INTO CODE」のDIVERという教材を手に取りました。   関連

no image

おすすめプロラミングサイト