HTMLとCSSが学べるアクションパズルゲーム「Super Markup Man」 
HTMLとCSSが学べるアクションパズルゲーム「Super Markup Man」 
(出所:Roppy Chop Studios、以下同じ)
[画像のクリックで拡大表示]

 デタラメに書かれたWebページを、正しい状態に直していくアクションパズルゲームが「Super Markup Man」だ。Webページを記述する「HTML」や「CSS」を模したブロックを、プレイヤーが持ち運んで並び替える。徐々に複雑になる問題を解いていくと、基本的な構文が身に付く作りになっている。

タグを正しい順番に並び替えるのが目的。レベルが上がるにつれてタグの種類が増えていく。
タグを正しい順番に並び替えるのが目的。レベルが上がるにつれてタグの種類が増えていく。
[画像のクリックで拡大表示]

 問題数は、HTMLが50問、CSSが50問の計100問。対象ユーザーが「楽しくHTML/CSSを学びたい」という入門者層なため、難易度の上がり方はゆっくりだ。最初はテキストの装飾や改行で20レベルほど進み、そこでようやく画像タグが現れる。

 ただシンプルなタグを並び替える作業を繰り返すと、嫌でも頭に入ってくる。似たような問題を繰り返し解くという構成は、初学者の勉強法として有効な面はあるだろう。

5秒で分かる「Super Markup Man」
製品名Super Markup Man
ジャンルアクションパズル
概要Webの構造を記述する「HTML」のタグを正しい順番に並び替える。HTML編をクリアするとCSS編も学べる
学べるポイントHTMLタグの構造
CSSと見た目の関係
税込み価格398円(Steamの場合)