• BPnet
  • ビジネス
  • IT
  • テクノロジー
  • 医療
  • 建設・不動産
  • TRENDY
  • WOMAN
  • ショッピング
  • 転職
  • ナショジオ
  • 日経電子版
  • PR

  • PR

  • PR

  • PR

  • PR

ゲームでITを学ぼう

HTMLやCSSを100問特訓!パズルゲーム「Super Markup Man」

高橋 秀和=ITpro 2017/08/10 ITpro
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の場合)

ここから先はITpro会員(無料)の登録が必要です。

次ページ Super Markup Manをインストール
  • 1
  • 2
  • 3

あなたにお薦め

連載新着

連載目次を見る

今のおすすめ記事

ITpro SPECIALPR

What’s New!

経営

アプリケーション/DB/ミドルウエア

クラウド

運用管理

設計/開発

サーバー/ストレージ

クライアント/OA機器

ネットワーク/通信サービス

セキュリティ

もっと見る