中学生(中学1〜3年)
理科と技術の言葉を、動かして確かめられます。
元素の周期表、電流と電圧とワット、音の波の形、音の大きさ。理科で名前だけ覚えた量を、数を入れて動かせる道具を集めました。
技術で出てくるものもここにあります。n進数、ビット、文字コードと文字化け、パスワードの強さ、CSS で作る影やボタン。画面で結果を見ながら値を変えられるので、何が効いているのかが分かります。
コンピュータの中身に興味が出たら、文字化けの復元から触ってみてください。化けた文字の形から、どの読み違いが起きたかを表にして見せています。
この学年から使える道具(55本)
単位の換算9本
- 単位の書き方貼った文章から Km・3cms・25° C のような書き方を指します。50kg のスペースは誤りと決めつけず、SI文書の規則を並べて選べるようにします
- kW・馬力馬力は3種類あります。仏馬力・英馬力・電気馬力を区別して出します
- 紙の連量・坪量「四六判110kg」のkgは1枚の重さではなく、1000枚ぶんの重さです
- 音の大きさ60dBと60dBを足しても120dBになりません。63dBです。理由と環境基準まで説明します
- エアコンの畳数「めやす◯〜◯畳」は日本電機工業会の JEM-1447 に基づく値で、「おもに◯畳」には規格がありません
- 職場の照度基準事務所か一般の作業場かを選ぶと、法令が定める最低の照度と根拠の条文が出ます。事務所は2区分、工場や倉庫は3区分で、区分の切り方そのものが違います
- 灯油・ガソリンの指定数量灯油やガソリンを置くと指定数量の何倍になるか、混ぜたときの足し算まで条文つきで出します
- モバイルバッテリーのWh定格容量と定格電圧から Wh を出して、100Wh・160Wh の線のどちら側かと、何個まで持てるかを見ます
- アンペア・ワット分電盤の主幹と、部屋ごとの分岐ブレーカーのどちらが先に落ちるか。使う家電のワット数を足して出します
文字とテキスト5本
コードとデータ11本
- URLエンコードASCII 128文字の早見表と変換を1枚に。日本語1文字が %XX 3つになる理由も、バイトを並べて見せます
- 法人番号の計算12桁から法人番号の13桁を出し、13桁は式に合うかを確かめます。チェックデジットは先頭に付く1〜9
- データ量1000で数える10進と1024で数える2進を同時に出すので、1TBが931GBに見える理由が分かります
- n進数2〜36進数。負の数と2の補数(0xFF は 255 か −1 か)にも答えます
- Base64日本語と絵文字に対応。戻せないときは空にせず理由を出します
- Unix時間10桁は秒、13桁はミリ秒。桁から判断して、どう読んだかも出します
- パスワード生成暗号用の乱数で作ります。「記号を必ず1つ」がもう勧められていない理由も説明します
- パスワードの強さ点数だけでなく、弱くしている原因を名前で出します。入力は送信しません
- 統計の計算四分位数は教科書とExcelで答えが違います。どちらの流儀で計算したかを出します
- テキストの差分見た目が同じでも違う文章があります。末尾の空白・全角スペース・改行コードまで見つけます
- MarkdownをHTMLにどの流儀で変換したかを明記します。改行の扱いは流儀で違います
記号としるし3本
CSSを作る9本
- 影(box-shadow)4つの数字が何を指すか。「ぼかし」と「広がり」の違いを動かして確かめられます
- 角丸(border-radius)8つの値を使うと、角を円ではなく楕円にできます。葉っぱの形も作れます
- グラデーション直線・円・円錐の3種類。conicを使うと円グラフがCSSだけで描けます
- Flexboxflex: 1 は3つの値の省略形です。省略形と展開形を並べて出します
- ボタン押せる大きさの決まりが4つあって、数は24・44・48の3通りに割れます
- Gridfr は「余りの分け前」。gap を変えると何が起きるかを並べて見せます
- ローディング枠線の1辺だけ色を変えて回すだけ。画像もJavaScriptも要りません
- タイプライターch は「1文字の幅」ではないので、日本語では崩れます
- ネオンとグリッチどちらも text-shadow の重ねがけ。光らせるほど読みにくくなります
学びの道具1本
お金とくらし3本
ブラウザとデバイス8本
- 対応機能の一覧この一覧の組み合わせ自体が、あなたを見分ける手がかりになります
- 画面の大きさカタログの解像度と違う数が出る理由。掛け算の式ごと出します
- 保存された中身見えるのはこのサイトのぶんだけ。Safariは7日で消します
- さわった場所指かペンかマウスかが分かります。Touchではなく Pointer を使う理由も説明します
- ブラウザの名乗りどのブラウザもMozillaを名乗ります。UAで判定しない作法まで説明します
- Cookieが見えない訳document.cookie は名前と値しか返しません。属性は取れません
- 電池残量が消えた訳WebKitが「指紋の懸念で実装しない」と名指しした機能の話
- つながっているかnavigator.onLine が true でも、ネットに出られるとは限りません
地図と位置2本
動かして見る2本
画像と音2本
中学校で名前が出てくるもの
アンペア・ボルト・ワットは中学の理科で、電流と電圧と電力として出てきます。モバイルバッテリーの mAh と Wh の関係も、この掛け算です。
文字とコンピュータの関係、n進数、情報の扱い方は、中学校の技術・家庭科(技術分野)の「情報の技術」で扱います。ここに置いた道具は、その内容を手を動かして確かめるためのものです。