「HTML&CSS」の記事一覧

今回はHTMLについてお話しします。これからWebデザインを始める人はもちろん、忘れかけている人も！この機会に基本をしっかり学んでくださいね。 HTMLとは？ HyperText Markup Language（ハイパーテキスト マークアップ ランゲージ、HTML（エイチティーエムエル））は、ハイパーテキストを記述するためのマークアップ言語の1つである。World Wide Web (WWW)において、ウェブページ（1990年代後半頃からはコンテンツという語も利用されている。「中身」という意味の語であり、大層な意味は無い）を表現するために用いられる。ハイパーリンクや画像等のマルチメディアを埋め込むハイパーテキストとしての機能、見出しや段落といったドキュメントの抽象構造、フォントや文字色の指定などの見た目の指定、などといった機能がある。https://ja.wikipedia.org/wiki/HyperText_Markup_Language なんのこっちゃ！って感じですね。簡単に説明すると「ページの要素や構造を指定するための言語」です。わからないって？もっともっと簡単にいうと「Webサイトを作るための特別な言語」です！（伝われ…！） HTMLを見てみる 百閒は一見にしかず！！！兎にも角にもどんなもんか見てみましょう！どのサイトでもいいので、右クリック「ソースの表示」でHTMLを覗いてみましょう。（ショートカット：F12） ↑こんな感じのが表示されたらOK 初見の人は特に！なんだこれ…。ただの暗号にしか見えないですよね。しかしこれ(HTML)をブラウザが読み込むと↓ なんとあのGoogleのページに！このようにブラウザが読める文字（マークアップ言語）にして構造や要素を指定してあげるのがHTMLです。 世界中にあるサイト、もちろんこのサイトもHTMLで作られています。 普通の文字ではダメなの？ 先ほど説明したようにHTMLを使ってWebページは作られています。もちろん、ただ文字を打つだけでもブラウザ上には表示されます。しかし！！なぜわざわざ複雑なタグを使用してかくのか。文書内の各部分に目印をつけて、その部分がどんな要素なのかを明確にすることで、コンピュータがその文書の構造を理解できるようになるのです！英語が共通語のように、コンピュータとの共通語の１つがHTMLなのです。 HTMLの書き方 文章や画像をタグではさむ タグは、開始タグと終了タグで基本的に１セットになっています。このタグにはたくさんの種類があり、どのタグに挟まれるかによってタグの中身の役割が変わります。 このようにHTMLはそれぞれの文章や画像に役割を作りながら書いていきます。役割をきちんと割り当ててあげることで、Googleの検索エンジンにとってもわかりやすいページとなり、結果的に検索上位に表示されやすくなります。いくつもあるサイトから自分のサイトにアクセスしてもらうためには検索結果が大事になります。そのためにもWebデザインの基本の基本、HTMLのタグの書き方はマスターしましょう！ タグは入れ子構造で HTMLでは「入れ子構造」でタグが書かれます。タグの中にタグ、その中にさらにタグ…とのような書き方をします。 開始タグの中に情報を書くことも タグの種類によっては開始タグの中に情報を入れることもあります。この情報のことを「属性」といいます。補足：この属性でclassやidを指定することでcssと組み合わせることができるようになります。 最後に HTMLはタグとその書き方、役割などをざっと覚えておけば大丈夫です！手を動かして慣れろがモットーなので、まずは何度もHTMLを書いてみるといいかもしれません。HTMLですでに頭が混乱しているあなた！安心してください（？）HTMLはWebページの土台にすぎません。。。これからCSSなどもっともっと複雑な言語が登場します！全部完璧に覚えながら進むより、やりながら少しずつ理解する程度で大丈夫！気づいたらスラスラかけるようになります！（断言）この記事ではHTMLがどんなものか理解していればOK!一緒に勉強していきましょう！

「HTML&CSS」の記事一覧

架空サイト作ってみた。【朝ごはん専門店 ohayo】

今更聞けない！HTMLって何？【初心者向け】

Lottachan