プログラミング学習に最適なHTMLタグが出題されるタイピングゲーム

小学生のプログラミング学習にオススメのWEB制作に欠かせないHTMLタグが出題されるタイピングゲームです。

HTMLのタグが出題されるタイピングゲーム

HTMLタグタイピング タイピングゲーム

小学生のプログラミング学習にオススメのWEB制作に欠かせないHTMLタグが出題されるタイピングゲームです。ブラインドタッチの練習とWEBプログラミング学習に役立つHTMLコードが出題されるので、遊んでいるうちにタイピングとHTMLを覚えられます!

公開日:
最終更新日:

HTMLタグタイピング 関連ワード #164 #HTMLタグタイピング
ランキング
HTML
ゲーム
WEB制作
仕事に使える
  • Twtterでシェアする
  • はてなブックマーク
  • フェイスブックでシェア
  • ポケットでシェア
  • LINEで友達に送る
  • rss2.0

HTMLタグ タイピングゲーム キーボード必須です

WEB制作に使われるHTML言語のタグが出題されるタイピングゲームです。
ブラインドタッチの練習をしながらWEB制作に欠かせないHTMLが覚えれるという便利なタイピングゲームになっています。

小学生のプログラミング学習の基礎にもオススメのタイピングゲームです!

HTMLタグ タイピングゲーム ルール説明

Startボタンをクリックすると、問題が出題されます。
出題されたタグ(アルファベット)をタイプしたら、タイマーが作動します。(スタートボタンをおしてもタイプしなければ大丈夫)

タイプミス1回につき、ペナルティとして1秒加算します。

かかった時間とペナルティの合計時間によるタイムトライアルでランキングを算出しています。

対応機種

キーボードのない端末ではご利用いただけません。

問題 /

Start
  • MISS:
  • TIME:
  • SCORE:
  • RANK:
  • お名前:
  • コメント:

  • TIME

コンプリートタグ一覧 タイプミスしたタグはグレーになります

タイピングスコア

  • タイプ数:
  • ミス:
  • 正確性:%

HTMLタグタイピング ランキング

順位お名前コメントミスTimeTotal Time達成日
1位ソイエバやっとノーミスで1分切れた♪000:00:5300:00:532020-04-17 21:20:29
2位花っち♪かんたんかんたん♪300:00:5100:00:542020-06-03 20:25:33
3位とっても嬉しい(^^)こころ1000:00:4600:00:562020-05-15 18:45:42
4位もひこやった3位300:00:5800:01:012020-05-18 14:41:17
5位ソイエバ1分切れず……また挑戦します!000:01:0500:01:052020-04-14 00:22:20
6位ソエイバミスなしでいけました!000:01:0700:01:072020-04-11 15:59:30
7位ソイエバ1分切れず……また挑戦します!000:01:1000:01:102020-04-14 00:22:20
8位ソイエバミスしてしまう…200:01:1000:01:122020-04-11 15:50:05
9位ソエイバミスをなくそうと注意しながらやりましたがダメでした…500:01:0800:01:132020-04-11 15:46:19
10位OHANA-ERK自己ベストきました★100:01:1200:01:132020-04-11 21:38:46
11位OHANA-ERK超えられない・・・100:01:1200:01:132020-04-11 21:53:58
12位えふめんお邪魔しました300:01:1500:01:182020-04-11 12:33:53
13位ソイエバ楽しいですね~500:01:1300:01:182020-04-11 15:42:23
14位OHANA-ERKくやしいです!200:01:1700:01:192020-04-11 21:32:21
15位OHANA-ERKもういっちょぉ300:01:1700:01:202020-04-11 21:34:22
16位OHANA-ERKNO-MISS で正解率100%なのに超えられないむしろ落ちた・・強い強すぎる000:01:2000:01:202020-04-12 00:31:16
17位えふめん過去の自分を越えられない。。600:01:1600:01:222020-04-11 19:07:30
18位OAHNA-ERKえーこれでも1位とれないなんて!200:01:2100:01:232020-04-11 21:28:08
19位Knitキーボード壊れてるってしんどい1000:01:1900:01:292020-04-21 10:40:56
20位fuchi@管理人テストプレイ400:01:2800:01:322020-04-10 13:20:02
21位silk5035try 4500:01:2800:01:332020-05-18 14:37:31
22位OAHNA-ERKえーこれでも1位とれないなんて!900:01:3300:01:422020-04-11 21:28:08
23位fuchi@管理人まだ本気だしてないし1400:01:3400:01:482020-04-10 13:31:27
24位silk50532 times try1000:01:4100:01:512020-05-16 14:38:03
25位silk5035so so2100:01:5300:02:142020-05-18 14:34:10
26位silk5035try 42100:01:5300:02:142020-05-18 14:37:31
27位ぱぴこまた来ます!3200:01:5900:02:312020-04-11 16:08:37
28位難しいですねまた挑戦します。700:02:3000:02:372020-05-03 18:16:32
29位Silk5053try 34300:01:5500:02:382020-05-16 20:21:44
30位うれしいなぁウレシノ400:02:3700:02:412020-05-15 18:42:37
31位ぱぴこまた来ます!3800:02:0800:02:462020-04-11 16:08:37
32位YASU案外難しい。。。2900:02:1900:02:482020-05-17 04:53:15
33位ぱぴこまた来ます!4300:02:1600:02:592020-04-11 16:08:37
34位silk5053good typing game5600:02:2300:03:192020-05-16 14:35:15
35位silk50532 times try5600:02:2300:03:192020-05-16 14:38:02
36位トトロまぁまぁかな1100:03:2900:03:402020-05-25 13:30:54
37位DEUCEファアアアアアアア2600:03:1600:03:422020-05-07 21:44:49
38位ぱぴこまた来ます!5900:02:4800:03:472020-04-11 16:08:37
39位かき1900:05:1700:05:362020-05-15 17:16:51
40位かき1900:05:4800:06:072020-05-15 17:10:29

HTMLとは

HTMLとはHyper Text Markup Language(ハイパーテキスト・マークアップ・ランゲージ)の略で、ホームページ・WEBサイトを作るときに使用する言語です。
プログラミング言語と呼んでいいのか悪いのかは、人によるところです。

WEB制作を行う人にとっては、避けて通れない基礎的な知識になります。

出題されるタグの意味 解説

主観に満ち満ちたタグの解説を表記いたします。
詳しい解説やちゃんとした意味を知りたい方は、HTMLクイックリファレンスさんのサイトがオススメです。

HTML タグ辞典というタグの種類と意味が掲載されている書籍もオススメです。

今すぐ使えるかんたんPLUS+ HTML5&CSS3 完全大事典 (今すぐ使えるかんたんPLUSシリーズ)

今すぐ使えるかんたんPLUS+ HTML5&CSS3 完全大事典 (今すぐ使えるかんたんPLUSシリーズ) プログラミング入門書 【今すぐ使えるかんたんPLUS+ HTML5&CSS3 完全大事典 (今すぐ使えるかんたんPLUSシリーズ)】

1,958円 (Amazon価格)

オンラインの情報は無料でありがたいけど、読みたいときに読める書籍の方が勉強するときには便利だと思います。
目的以外の情報も取得できるので。

基本を示すタグ

htmlこれはHTMLで書かれたページですよ!という宣言
headここに書かれた内容は基本的にページには表示されないけど、タイトルとかCSSの読み込みとかページを作る準備段階のものを読み込んだりする
bodybodyより下に書かれた内容がブラウザに表示されるエリアになる
metaサイトの情報を書いたり、サーチエンジンに渡す情報を書いたりするところ
titleサイトのタイトルを書く!SEO上重要な項目となっています
baseサイト内のリンクの起点となるURLを書く。あんまり使われることはないけど、覚えておくと便利なタグ

cssを示すタグ

styleスタイルシートをHTML内に直接書き込むときに、これはCSSです、とブラウザにわからせるためのタグ

リンクを示すタグ

a別サイトへリンクを張るときに使うタグ

指定を示すタグ

address連絡先などを記述するときに使うタグ。住所以外でもOK。あまり使われない

図を示すタグ

figure画像表示エリアですよ、と明示するタグ。HTML5から新登場
figcaption画像に対するキャプション(説明)を書く。HTML5から新登場
img画像ファイルを読み込むときに使うタグ
map画像ファイルに複数のリンクを設定するときに使うタグ。設定がややこしいのであまり使いたくない
areamapで囲ったエリアの中でリンクを設定するときに使う。ややこしいから使いたくない
canvas図や図形を表示させるエリア。キャンバス。めちゃくちゃ奥が深い。ジャバスクリプトと組み合わせてグラフを表示するときによく使う

表を示すタグ

table表を作る宣言をするタグ
tr表の中の改行をあらわすタグ
td表のセルを示すタグ
th表のセルでかつ見出しとして使うタグ
thead表のヘッダーを定義するタグ。thと組み合わせ使うのが基本
tbody表の中身を示すタグ
tfoot表のフッターを示すタグ

フォームを示すタグ

textareaフォーム送信の際に長文を送ってもらう時に使う入力ボックス
formフォーム送信を行うためのタグ
inputフォーム送信の送信方法を定義するタグ。radioやcheckboxという属性を指定して使う
select縦に並べた選択肢を使う時に使うタグ
buttonフォームの送信用ボタンを作るタグ。フォーム以外でも使用可能
labelフォームの要素のタグとテキストを関連付けるときによく使うタグ

文章構造を示すタグ

h文章構造の見出しを指定するタグ。h1~h6まで見出しレベルに合わせて使う
p文章の段落を意味するタグ。paragraphの意
br改行をさせるタグ
hr横罫線を引く
strongこちらも文章の強調表示になるが、SEO的にも強調の意味になる
emテキストを強調表示するときに使う
small文字を縮小するタグ。個人的にhタグの中でよく使う
blockquote引用であることを明示するためのタグ
cite名称や書籍名などの短い引用を示すタグ。Citationの略
rubyルビを振るためのタグ。漢字以外でも使用可能
rtルビを振るタグで、振るルビ(読み方)を指定するタグ
rpルビを振るタグで、カッコなどを指定するタグ
sup上付きの小文字として表示するタグ。二乗とかそういうときに使う
sub下付きの小文字として表示するタグ。H2Oの2を表示するときとかに使う
preHTMLの中でタグを打つとレンダリングされてしまうので、HTMLのコード例を載せるときなどに使うと、タグのまま表示してくれる
codeプログラムコードであることを明示するタグ
span意味をもたないタグ。意味がないことに意義があって、部分的に装飾したいときや、JQueryで何かを代入するときなどに使う

読み込みを示すタグ

link主にCSSを読み込むときに使うタグ
script主にHTMLでJavaScript(Jquery含む)を使用するときに使うタグ
noscriptscriptタグが読み込めないときに代替表示させる内容を書くタグ

リストを示すタグ

olリストタグで順番の意味を持っているときに使うタグ。ordered listの略
ulリストタグで順番とか関係ないリストを作るときに使うタグ。Unordered Listの略
liリストの内容を記入するタグ。olでもulでもこれを使う
dl定義リストを明示するタグ。dtとddとセットで使う
dt定義リストの定義語を明示するタグ
dd定義リストの定義語の説明を記入するタグ

レイアウトを示すタグ

main文章のメインコンテンツを表すタグ
article内容が単体で完結するセクションを示すタグ
sectionセクションを示すタグ
aside余談や補足情報などを明示するタグ
div意味を持たないレイアウト用のタグ。汎用性が高く何かあったらdivが良く使われる。但し乱用して使いすぎると素人と言われる
navナビゲーションを明示するレイアウトタグ
headerヘッダーを明示するタグ。headタグとは意味が全然違うので注意
footerフッターを明示するタグ

ここに掲載していないタグもありますが、非推奨だったり、廃止予定のタグ、などは省いています。
出題されるタグを覚えれば、大抵のWEBページは制作可能です。

HTMLタグタイピングの後にはこちらがオススメです!

アジアエリアの国旗

アジアエリアの国旗

アジア大陸で使われている国旗クイズです! おなじみの日の丸の国旗や糸車をあしらったあの国などが出題されます!

チューリップ

チューリップ

キレイなチューリップ畑の写真のどこかの一部がゆっくりと変化しますので、変化したと思う箇所をクリックで答えてください。

30秒間暗算 掛け算

30秒間暗算 掛け算

30秒間でどれだけの問題を解けるか!掛け算編です。脳トレにも!繰り返しやることで計算スピードがどんどん速くなります。

What if(Cool104)

What if(Cool104)

ゲームセンターでおなじみのCool104がアプリもインストールも不要で無料で遊べます。ランキング登録も可能です!

難読漢字ランキング

難読漢字ランキング

難読漢字クイズの正答率のワースト順に並べた難読漢字ランキングです。 読み方が難しい漢字を100文字以上集めました

同じ漢字に挟まれた漢字クイズ

同じ漢字に挟まれた漢字クイズ

漢字の偏(へん)と旁(つくり)がほぼ同じ漢字で作られた、同じ漢字で挟まれた難読漢字クイズです!

人にまつわることわざクイズ

人にまつわることわざクイズ

一部分が人にまつわるかけたことわざを出題するので、[ ]に入る正しい言葉を選んでください。回答ページにことわざの解説もあります。

タイピングゲーム関連・オススメ商品 amazon