ブラウザを使って文字を表示するためのたった1行のHTML文とは

HTMLについて知りたいけれど難しそう。 

アルファベットばっかりで自分にできるか不安。 

そんな人にも簡単に表示できてしまう「たった1行の文」をつくってみましょう。 

そこに少しずつ付け足しをしていきながら数回に分けてHTMLについて解説していきます。 

そもそもHTMLって何? 

HTMLとは、はいぱーてきすとまーくあっぷらんげーじです。 

何言ってるかわかりませんね。 

「HyperText Mrokup Lunguage」の大文字の部分をとった言葉で、日本語でざっくりいうと「ことばをきれいにくっつけちゃうしくみ」です。 

「タグ」と呼ばれるこんなの→【< >、</>】の間に文字や画像の表示や修飾などの情報を追加することで、コンピュータが情報を読めるようにするというものです。 

そして、Googlechromeなどのインターネットを見るためのブラウザソフトウェア上で表示することができます。 

ホームページをつくるときに利用しますが、今はWordPressや無料のブログサイトを使えば簡単にホームページをつくることができるので、これを読んでいる方はホントに趣味かエンジニアを目指そうという人ぐらいだと思っています。 

本当に1行でできるの? 

厳密にいうと難しいですが、できます。 

と、言っても最初は自分のパソコン上のみです。 

さすがにネットワーク上で表示するとなると、それなりにお金がかかります。 

でも、勉強ぐらいならばパソコンやタブレット、OS、メモ帳があればできます。 

もちろん、受講料は無料です( ´∀` )。 

それではさっそく作っていきましょう。 

まず、メモ帳などのテキストソフトを開きます。 

次に、好きな言葉を打ち込んでください。 

思いつかなければ「あ」と打ち込んでください。 

はい、終了です。 

・・・終了です。 

これであなたもHTMLの入力ができました。 

どうやって表示するの? 

「ふざけてる?」 

いいえ、これでも表示ができるのです。 

試しにやってみましょう。 

HTMLを表示するためには、「HTMLファイル」をつくります。 

今、メモ帳を開いていると思います。 

それを保存していきましょう。 

左上に「ファイル」タブがあるので、クリックします。 

その中に「名前を付けて保存」があるのでそれをクリックし、デスクトップを選んでください。 

次に、名前をつけましょう。 

本来であれば「index」とか「top」とかでつけますが、今回は練習なので自分の名前を入れてみてください。 

最後に一番大事なところです。 

名前を入力した場所の下に「ファイルの種類」というのがありますね? 

今は「テキストファイル」という種類で「.text」という拡張子をつけるようになっています。 

これを「HTMLファイル」「.htm」にして保存してください。 

すると、自分の名前の後に「.htm」というファイルができます。 

デスクトップにはブラウザソフトウェアのアイコンで表示されていると思います。 

それではさっそく開いてみましょう! 

怪しいことは一切していない、あなたが自分で作ったたった1行のHTMLです。 

ぽちっとな。 

・・・どうでしょう? 

ブラウザ上で自分の入れた言葉が表示されました! 

やったね! 

まとめ 

これでHTMLの勉強の第一歩を歩みだしました。 

今回のはただ文字を表示しただけですが、さらにいろんな指定ができるようにしていきましょう。 

次回はちょっとやってる感が出るようにもりもり盛り込んでいきます。 

タイトルとURLをコピーしました