<?xml version="1.0" encoding="utf-8" standalone="yes"?><rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom"><channel><title>デジタル・ヒューマニティーズ |</title><link>https://clementgodbarge.com/ja/category/%E3%83%86%E3%82%B7%E3%82%BF%E3%83%AB%E3%83%92%E3%83%A5%E3%83%BC%E3%83%9E%E3%83%8B%E3%83%86%E3%82%A3%E3%83%BC%E3%82%B9/</link><atom:link href="https://clementgodbarge.com/ja/category/%E3%83%86%E3%82%B7%E3%82%BF%E3%83%AB%E3%83%92%E3%83%A5%E3%83%BC%E3%83%9E%E3%83%8B%E3%83%86%E3%82%A3%E3%83%BC%E3%82%B9/index.xml" rel="self" type="application/rss+xml"/><description>デジタル・ヒューマニティーズ</description><generator>HugoBlox Kit (https://hugoblox.com)</generator><language>ja-jp</language><lastBuildDate>Tue, 05 May 2026 00:00:00 +0000</lastBuildDate><image><url>https://clementgodbarge.com/media/icon_hu_64a6c3bec25b3d7b.png</url><title>デジタル・ヒューマニティーズ</title><link>https://clementgodbarge.com/ja/category/%E3%83%86%E3%82%B7%E3%82%BF%E3%83%AB%E3%83%92%E3%83%A5%E3%83%BC%E3%83%9E%E3%83%8B%E3%83%86%E3%82%A3%E3%83%BC%E3%82%B9/</link></image><item><title>tei-mcp v0.3：原文を書き換えずにTEIを付ける</title><link>https://clementgodbarge.com/ja/post/tei-mcp-span-locked/</link><pubDate>Tue, 05 May 2026 00:00:00 +0000</pubDate><guid>https://clementgodbarge.com/ja/post/tei-mcp-span-locked/</guid><description>&lt;p&gt;
とき、目標はAIアシスタントにTEIマークアップをでっち上げさせないことでした。スキーマによるグラウンディングで、問題の一部は片づきました。P5仕様をツール経由で直接引けるようになれば、モデルは要素の意味や受け入れる属性を当て推量しなくて済む。出力は検証を通ります。&lt;/p&gt;
&lt;p&gt;しかしTEIエンコーディングにおけるハルシネーションには二つの顔があり、スキーマが捉えるのはその一つだけです。仕様に照らした検証が教えてくれるのは、&lt;em&gt;マークアップ&lt;/em&gt;が整っていることまで。そのマークアップが包む&lt;em&gt;テキスト&lt;/em&gt;については何も語りません。そして害の大きいハルシネーションが潜んでいるのは、まさにそこ――テキストそのもの――なのです。v0.3の目玉であるスパン固定合成は、これを防ぐためだけに設計されました。&lt;/p&gt;
&lt;details class="print:hidden xl:hidden" &gt;
&lt;summary&gt;目次&lt;/summary&gt;
&lt;div class="text-sm"&gt;
&lt;nav id="TableOfContents"&gt;
&lt;ul&gt;
&lt;li&gt;&lt;a href="#スキーマが捉えられないハルシネーション"&gt;スキーマが捉えられないハルシネーション&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="#スパン固定合成"&gt;スパン固定合成&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="#これは何で何でないか"&gt;これは何で、何でないか&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="#teiの外でも大事な理由"&gt;TEIの外でも大事な理由&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="#アップデートの入手"&gt;アップデートの入手&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
&lt;/nav&gt;
&lt;/div&gt;
&lt;/details&gt;
&lt;h2 id="スキーマが捉えられないハルシネーション"&gt;スキーマが捉えられないハルシネーション&lt;/h2&gt;
&lt;p&gt;モデルに16世紀のフランス語書簡をエンコードさせると、見たところ非の打ちどころのないTEI文書が返ってくることがよくあります。ヘッダーは埋まり、&lt;code&gt;&amp;lt;persName&amp;gt;&lt;/code&gt;タグは正しい位置にあり、&lt;code&gt;&amp;lt;dateline&amp;gt;&lt;/code&gt;も整っている。&lt;code&gt;validate_document&lt;/code&gt;にかければ通ります。&lt;/p&gt;
&lt;p&gt;そこで本文を原文と突き合わせてみてください。&lt;/p&gt;
&lt;p&gt;&lt;code&gt;mesme&lt;/code&gt;が&lt;code&gt;même&lt;/code&gt;になっています。コンマが一つ移動している。&lt;code&gt;luy&lt;/code&gt;はいつの間にか&lt;code&gt;lui&lt;/code&gt;に現代化されている。写本で読みにくかった節は、もっと読みやすいものに「訂正」されている。どれも頼んだ覚えのない変更です。どれにも印はつきません。文書はスキーマ上は妥当で、しかしひっそりと間違っている。&lt;/p&gt;
&lt;p&gt;エンコードされたテキストがそのまま恒久的な記録となり、後続の読者、検索インデックス、引用のよりどころになるアーカイブのワークフローにとって、これこそもっとも重大な故障の型です。壊れたタグは腹立たしい。しかし5年間誰も気づかない現代化された綴りは、汚損なのです。&lt;/p&gt;
&lt;h2 id="スパン固定合成"&gt;スパン固定合成&lt;/h2&gt;
&lt;p&gt;新リリース（v0.3）は、まさにこの故障の型を狙い撃ちにしたハルシネーション防止の仕組みを搭載しています。設計目標は、本文のハルシネーションを単に起こりにくくするのではなく、構造上ありえなくすることです。&lt;/p&gt;
&lt;p&gt;考え方は単純です。&lt;strong&gt;モデルは本文を一文字も打たない&lt;/strong&gt;。&lt;/p&gt;
&lt;p&gt;代わりに、ワークフローはこう進みます。&lt;/p&gt;
&lt;ol&gt;
&lt;li&gt;モデルは&lt;code&gt;get_source(&amp;quot;letter_001&amp;quot;)&lt;/code&gt;を呼び、原文のプレーンテキストを不変の文字列として受け取ります。&lt;/li&gt;
&lt;li&gt;付けたいタグごとに&lt;code&gt;tag_span(&amp;quot;letter_001&amp;quot;, start, end, element_path, attrs)&lt;/code&gt;を呼び、原文上の文字範囲にTEI要素を登録します。&lt;/li&gt;
&lt;li&gt;終わったら&lt;code&gt;compose(&amp;quot;letter_001&amp;quot;)&lt;/code&gt;を呼びます。サーバーは記録されたタグを元のプレーンテキストに織り込んで最終的なTEIを描画し、そのうえで、描画された文書の平文の内容が原文と等しいことを&lt;em&gt;バイト単位で&lt;/em&gt;検証します。&lt;/li&gt;
&lt;/ol&gt;
&lt;p&gt;バイトが一致すれば、文書が返ってきます。一致しなければ――モデルのタグがどういうわけか、原文と1文字でも違う本文を含意していれば――&lt;code&gt;compose()&lt;/code&gt;は汚損した文書を返す代わりに例外を投げます。&lt;/p&gt;
&lt;p&gt;このワークフローには、モデルが原文と本文の異なるTEI文書を生み出す経路が存在しません。この不変条件は機械的なもので、モデルの振る舞い頼みではありません。モデルがハルシネーションを起こさないと信じる必要はない。信じるべきは、二つのバイト列の&lt;code&gt;==&lt;/code&gt;比較だけです。&lt;/p&gt;
&lt;h2 id="これは何で何でないか"&gt;これは何で、何でないか&lt;/h2&gt;
&lt;p&gt;スパン固定合成はスキーマ・グラウンディングを&lt;strong&gt;補う&lt;/strong&gt;ものであって、置き換えるものではありません。スキーマ・グラウンディングのツール群（&lt;code&gt;validate_document&lt;/code&gt;、&lt;code&gt;lookup_element&lt;/code&gt;、&lt;code&gt;valid_children&lt;/code&gt;、そして元の16個の残り）は、モデルが&lt;em&gt;妥当な&lt;/em&gt;TEIを作る助けになります。スパン固定合成は、そのTEIの中の本文が原文に&lt;em&gt;忠実である&lt;/em&gt;ことを保証します。実運用に耐えるエンコーディングのワークフローは両方の軸を満たさなければならず、いまや両方が一つのサーバーで賄えます。&lt;/p&gt;
&lt;p&gt;万能薬でもありません。&lt;code&gt;compose()&lt;/code&gt;はまだ、登録されたタグが読み込み済みのODDカスタマイズのもとで許されるかどうかを確認しません。これは次の課題です。記録されたタグはプロセスのメモリ上にあり、再起動すると消えます。また原文ファイルは、サーバーが動く場所から読める必要があります。いずれも対処可能ですし、中核の不変条件を揺るがすものではありません。&lt;/p&gt;
&lt;h2 id="teiの外でも大事な理由"&gt;TEIの外でも大事な理由&lt;/h2&gt;
&lt;p&gt;このパターンは一般化できます。モデルにテキストの注釈付け、変換、ラッピングを頼むとき――そして、モデルがテキストを「改善」する力よりも元のテキストの完全性のほうが大事なときはいつでも――同じ形の解決策が使えます。モデルにテキストを打ち直させてはいけません。テキストに対する指示を出させ、決定論的なコンポーザーに、等価性の不変条件のもとでそれを適用させるのです。&lt;/p&gt;
&lt;p&gt;とりわけデジタル版にとって、これは責任をもってモデルに任せられる仕事の範囲を変えます。エンコーディングは突如として、出力をいちいち原文と手作業で突き合わせなくても委ねられる仕事になる。退屈な道は機械が引き受け、編集者は綴りではなくマークアップを点検すればよいのです。&lt;/p&gt;
&lt;h2 id="アップデートの入手"&gt;アップデートの入手&lt;/h2&gt;
&lt;p&gt;すでにtei-mcpを入れている場合：&lt;/p&gt;
&lt;div class="highlight"&gt;&lt;pre tabindex="0" class="chroma"&gt;&lt;code class="language-bash" data-lang="bash"&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt;uvx tei-mcp@latest
&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;新規なら：&lt;/p&gt;
&lt;div class="highlight"&gt;&lt;pre tabindex="0" class="chroma"&gt;&lt;code class="language-bash" data-lang="bash"&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt;pip install tei-mcp
&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;スパン固定合成を使うには、原文プレーンテキストのディレクトリをサーバーに指定します。&lt;/p&gt;
&lt;div class="highlight"&gt;&lt;pre tabindex="0" class="chroma"&gt;&lt;code class="language-bash" data-lang="bash"&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt;&lt;span class="nb"&gt;export&lt;/span&gt; &lt;span class="nv"&gt;TEI_MCP_SPAN_SOURCE_ROOT&lt;/span&gt;&lt;span class="o"&gt;=&lt;/span&gt;/path/to/sources
&lt;/span&gt;&lt;/span&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt;uvx tei-mcp
&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;各ファイルのステム（拡張子を除いた名前）が文書IDになります（&lt;code&gt;letter_001.txt&lt;/code&gt; →
&lt;code&gt;letter_001&lt;/code&gt;）。&lt;/p&gt;
&lt;p&gt;ソースコード、完全なドキュメント、不変条件の設計ノート：
&lt;/p&gt;</description></item><item><title>もう一つのデジタル版のかたち</title><link>https://clementgodbarge.com/ja/post/cavriana-edition/</link><pubDate>Tue, 24 Mar 2026 00:00:00 +0000</pubDate><guid>https://clementgodbarge.com/ja/post/cavriana-edition/</guid><description>&lt;p&gt;一次史料の大半は、公刊されないまま眠っています。それを何とかするために私たちが頼ってきたモデル――助成金頼みのデジタル版――は、高くつき、中央集権的で、壊れやすく、とても大規模には通用しません。私はこのほど、Cavrianaの書簡の校訂版をなぜ別のやり方で構築しているのかを説明した
を公開しました。最小限のインフラで有機的に育ち、保守は自動化され、協働に開かれ、助成金など要らないほど安上がりな、デジタル化された一次史料。それは、制度の後ろ盾があろうとなかろうと機能する、そういうデジタル・ヒューマニティーズを擁護する議論です。&lt;/p&gt;</description></item><item><title>tei-mcp：AIエージェントのためのTEI P5</title><link>https://clementgodbarge.com/ja/post/tei-mcp/</link><pubDate>Sun, 15 Mar 2026 00:00:00 +0000</pubDate><guid>https://clementgodbarge.com/ja/post/tei-mcp/</guid><description>&lt;p&gt;AIコーディングアシスタントにTEI XMLを書かせたことがある人なら、間違いの多さに気づいているはずです。要素があってはならない場所に現れる。属性が捏造される。入れ子の規則が無視される。モデルはTEIがどんなものかを大まかには知っていますが、仕様についての確かな知識は持ち合わせていないのです。&lt;/p&gt;
&lt;p&gt;tei-mcpは、AIエージェントにTEI P5ガイドラインをツール経由で直接引かせることで、この問題を解決します。&lt;/p&gt;
&lt;details class="print:hidden xl:hidden" &gt;
&lt;summary&gt;目次&lt;/summary&gt;
&lt;div class="text-sm"&gt;
&lt;nav id="TableOfContents"&gt;
&lt;ul&gt;
&lt;li&gt;&lt;a href="#mcpとは"&gt;MCPとは&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="#tei-mcpにできること"&gt;tei-mcpにできること&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="#なぜ大事か"&gt;なぜ大事か&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="#使いはじめる"&gt;使いはじめる&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
&lt;/nav&gt;
&lt;/div&gt;
&lt;/details&gt;
&lt;h2 id="mcpとは"&gt;MCPとは&lt;/h2&gt;
&lt;p&gt;
（MCP）は、AIアプリケーションを外部のデータソースやツールにつなぐためのオープン標準です。AI用のUSBポートと考えてください。Claude、Cursor、Windsurfをはじめ互換性のあるクライアントなら何でも、単一のプロトコルで専門的なサービスに差し込めます。&lt;/p&gt;
&lt;p&gt;MCPサーバーは、AIが会話の途中で呼び出せる&lt;em&gt;ツール&lt;/em&gt;を公開します。記憶した訓練データに頼る代わりに、モデルは生きた、権威ある情報源に問い合わせられるのです。&lt;/p&gt;
&lt;h2 id="tei-mcpにできること"&gt;tei-mcpにできること&lt;/h2&gt;
&lt;p&gt;tei-mcpはTEI P5のODD仕様を解析し、編集者やエンコーダーがよく抱く疑問に答える16のツールを公開します。&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;&lt;strong&gt;この要素は何か？&lt;/strong&gt; 要素、クラス、マクロ、モジュールを名前で引けます。大文字小文字は区別せず、綴り間違いには候補を提示します。&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;どんな属性を取るか？&lt;/strong&gt; クラス階層全体をたどって属性を解決します――まずローカルの属性、次に継承された属性を順に。&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;中に何を入れられるか？&lt;/strong&gt; 内容モデルを構造化された木に展開するか、有効な子要素の一覧を平坦に取り出します。&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;この要素はここに置けるか？&lt;/strong&gt; 親子の入れ子を確認するか、要素階層全体を通じた到達可能性を追跡します。&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;この文書は妥当か？&lt;/strong&gt; TEI XMLファイルを仕様に照らして検証します。内容モデル、属性値、閉じた値リスト、参照の整合性、非推奨警告まで。&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;自分のプロジェクトのスキーマは？&lt;/strong&gt; ODDカスタマイズファイルを読み込めば、上のすべてをプロジェクト固有のTEIサブセットに絞り込めます。&lt;/li&gt;
&lt;/ul&gt;
&lt;h2 id="なぜ大事か"&gt;なぜ大事か&lt;/h2&gt;
&lt;p&gt;TEIエンコーディングでは、ガイドラインを絶えず引く必要があります。熟練したエンコーダーはよく使うパターンを体で覚えていますが、それでもなじみの薄い要素や込み入った内容モデルとなれば仕様を確かめます。そうした身についた知識を持たないAIアシスタントの場合、問題はもっと深刻です。もっともらしく見えて誤ったマークアップをでっち上げてしまうのです。&lt;/p&gt;
&lt;p&gt;tei-mcpがあれば、AIは当て推量をしなくて済みます。山括弧を一つ打つ前に、仕様で答えを引けるからです。結果として得られるのは、TEI P5に――あるいはプロジェクトのODDカスタマイズに――準拠したマークアップです。&lt;/p&gt;
&lt;h2 id="使いはじめる"&gt;使いはじめる&lt;/h2&gt;
&lt;p&gt;PyPIからインストールします。&lt;/p&gt;
&lt;div class="highlight"&gt;&lt;pre tabindex="0" class="chroma"&gt;&lt;code class="language-bash" data-lang="bash"&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt;pip install tei-mcp
&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;次に、MCPクライアントの設定に追加します。&lt;/p&gt;
&lt;div class="highlight"&gt;&lt;pre tabindex="0" class="chroma"&gt;&lt;code class="language-json" data-lang="json"&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt;&lt;span class="p"&gt;{&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt; &lt;span class="nt"&gt;&amp;#34;mcpServers&amp;#34;&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt; &lt;span class="nt"&gt;&amp;#34;tei&amp;#34;&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt; &lt;span class="nt"&gt;&amp;#34;command&amp;#34;&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="s2"&gt;&amp;#34;uvx&amp;#34;&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt; &lt;span class="nt"&gt;&amp;#34;args&amp;#34;&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="s2"&gt;&amp;#34;tei-mcp&amp;#34;&lt;/span&gt;&lt;span class="p"&gt;]&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt; &lt;span class="p"&gt;}&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt; &lt;span class="p"&gt;}&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt;&lt;span class="p"&gt;}&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;サーバーは初回起動時にTEI仕様をダウンロードし、MCP互換のクライアントならどれとでも動きます。&lt;/p&gt;
&lt;p&gt;ソースコードと完全なドキュメント：
&lt;/p&gt;</description></item><item><title>ITA2電信エミュレータで二進法を教える</title><link>https://clementgodbarge.com/ja/post/baudot/</link><pubDate>Thu, 13 Feb 2025 00:00:00 +0000</pubDate><guid>https://clementgodbarge.com/ja/post/baudot/</guid><description>&lt;h2 id="抽象的な概念を手に取れるものに"&gt;抽象的な概念を手に取れるものに&lt;/h2&gt;
&lt;p&gt;このITA2エミュレータは、教室でそのまま使える教材です。符号化という抽象的な概念を目に見え、手で触れられるものにして、コンピューティングと電気通信の要をなす考え方――文字がどうやって1と0の列になるのか、という二進表現――へと学生を導きます。
ふだんは黒板の上で抽象的に教えてしまいがちなところですが、テープに実際の穴が穿たれていくのを目にすれば、物理的な仕組みがデジタル情報を担えるのだということが腑に落ちるのです。
&lt;div class="baudot-emulator"&gt;
&lt;h2&gt;ITA2 (Baudot-Murray) Telegraph Type Emulator&lt;/h2&gt;
&lt;p&gt;Type a word in the input below to see its representation on the ITA2 tape.&lt;/p&gt;
&lt;div class="baudot-controls"&gt;
&lt;label for="baudot-input"&gt;Type word:&lt;/label&gt;
&lt;input id="baudot-input" class="text-input" size="50" maxlength="50" /&gt;
&lt;button type="button" id="baudot-ltr-button" class="control-button active"&gt;LTR&lt;/button&gt;
&lt;button type="button" id="baudot-fig-button" class="control-button"&gt;FIG&lt;/button&gt;
&lt;/div&gt;
&lt;div class="tape-outer-container"&gt;
&lt;div class="tape-container"&gt;
&lt;table&gt;
&lt;tbody id="baudot-tape"&gt;&lt;/tbody&gt;
&lt;/table&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;style&gt;
.baudot-emulator {
--light-color: #f3f4f6;
--dark-color: #1f2937;
--light-alt-color: #e5e7eb;
--dark-alt-color: #374151;
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen-Sans, Ubuntu, Cantarell, 'Helvetica Neue', sans-serif;
max-width: 100%;
margin: 2rem 0;
padding: 0;
box-sizing: border-box;
}
.baudot-emulator {
--tape-bg: var(--light-color);
--hole-bg: var(--light-color);
--hole-border: #d1d5db;
--punched-bg: var(--dark-color);
--punched-border: var(--dark-color);
--sprocket-bg: var(--light-color);
--sprocket-border: #9ca3af;
--button-bg: var(--light-color);
--button-bg-active: #d1d5db;
--button-text: var(--dark-color);
--button-border: #d1d5db;
--input-bg: white;
--input-border: #d1d5db;
--input-text: var(--dark-color);
--line-number: #6b7280;
}
html.dark .baudot-emulator,
html[data-theme='dark'] .baudot-emulator,
body.dark .baudot-emulator {
--tape-bg: var(--dark-alt-color);
--hole-bg: var(--dark-alt-color);
--hole-border: #4b5563;
--punched-bg: var(--light-color);
--punched-border: var(--light-color);
--sprocket-bg: var(--dark-alt-color);
--sprocket-border: #9ca3af;
--button-bg: var(--dark-alt-color);
--button-bg-active: #4b5563;
--button-text: var(--light-color);
--button-border: #4b5563;
--input-bg: var(--dark-alt-color);
--input-border: #4b5563;
--input-text: var(--light-color);
--line-number: #9ca3af;
}
.baudot-controls {
margin-bottom: 1.5rem;
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 0.5rem;
}
.baudot-emulator .text-input {
flex: 1;
min-width: 200px;
padding: 0.5rem;
font-size: 1rem;
border: 1px solid var(--input-border);
border-radius: 4px;
background: var(--input-bg);
color: var(--input-text);
}
.baudot-emulator .control-button {
padding: 0.5rem 1rem;
background: var(--button-bg);
color: var(--button-text);
border: 1px solid var(--button-border);
border-radius: 4px;
cursor: pointer;
font-size: 0.9rem;
}
.baudot-emulator .control-button.active {
background: var(--button-bg-active);
font-weight: bold;
}
.tape-outer-container {
padding: 0;
margin-bottom: 1.5rem;
border-radius: 4px;
overflow: hidden;
}
.tape-container {
width: 100%;
overflow-x: auto;
background: var(--tape-bg);
padding: 1rem 0.5rem;
}
.baudot-emulator table {
border-collapse: collapse;
width: 100%;
table-layout: fixed;
border: none;
}
.baudot-emulator tr {
height: 24px;
border: none;
}
.baudot-emulator td {
border: none;
padding: 0;
}
.baudot-emulator .line-number {
width: 20px;
text-align: center;
color: var(--line-number);
font-size: 0.8rem;
padding: 0 8px 0 0;
font-weight: bold;
}
.baudot-emulator .cell {
position: relative;
width: 20px;
height: 20px;
}
.baudot-emulator .cell-content {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 12px;
height: 12px;
border-radius: 50%;
background: var(--hole-bg);
border: 1px solid var(--hole-border);
}
.baudot-emulator .punched .cell-content {
background: var(--punched-bg);
border: 1px solid var(--punched-border);
}
.baudot-emulator .sprocket-hole {
position: absolute;
left: 50%;
top: 100%;
transform: translate(-50%, -50%);
width: 4px;
height: 4px;
border-radius: 50%;
background: var(--sprocket-bg);
border: 1px solid var(--sprocket-border);
z-index: 2;
}
&lt;/style&gt;
&lt;script&gt;
document.addEventListener('DOMContentLoaded', function() {
initBaudotEmulator();
});
function initBaudotEmulator() {
if (!document.getElementById('baudot-input')) return;
const textInput = document.getElementById('baudot-input');
const tape = document.getElementById('baudot-tape');
const ltrButton = document.getElementById('baudot-ltr-button');
const figButton = document.getElementById('baudot-fig-button');
const ita2Code = {
'A': '00011', 'B': '11001', 'C': '01110', 'D': '01001', 'E': '00001',
'F': '01101', 'G': '11010', 'H': '10100', 'I': '00110', 'J': '01011',
'K': '01111', 'L': '10010', 'M': '11100', 'N': '01100', 'O': '11000',
'P': '10110', 'Q': '10111', 'R': '01010', 'S': '00101', 'T': '10000',
'U': '00111', 'V': '11110', 'W': '10011', 'X': '11101', 'Y': '10101',
'Z': '10001',
'1': '00011', '2': '11001', '3': '01110', '4': '01001', '5': '00001',
'6': '01101', '7': '11010', '8': '10100', '9': '01011', '0': '11000',
'-': '00011', '?': '00100', ':': '01010', '(': '11000', ')': '11101',
'.': '01000', ',': '00010', "'": '10001', '=': '01111', '/': '10011',
'+': '11011', ' ': '00100',
'FIG': '11011', 'LTR': '11111',
};
function generateTape() {
let rows = '';
for (let row = 0; row &lt; 5; row++) {
rows += '&lt;tr&gt;';
rows += `&lt;td class="line-number"&gt;${row + 1}&lt;/td&gt;`;
for (let col = 0; col &lt; 50; col++) {
rows += `&lt;td id="baudot_${row}_${col}" class="cell unpunched"&gt;
&lt;div class="cell-content"&gt;&lt;/div&gt;
${row === 2 ? '&lt;div class="sprocket-hole"&gt;&lt;/div&gt;' : ''}
&lt;/td&gt;`;
}
rows += '&lt;/tr&gt;';
}
tape.innerHTML = rows;
}
function updateITA2Code(word) {
clearTape();
word = word.toUpperCase();
let tapePosition = 0;
let currentCharType = 'LTR';
ltrButton.classList.add('active');
figButton.classList.remove('active');
for (let i = 0; i &lt; word.length; i++) {
const char = word[i];
let code = ita2Code[char] || ita2Code[' '];
let requiredCharType = /[A-Z ]/.test(char) ? 'LTR' : 'FIG';
if (requiredCharType !== currentCharType) {
const shiftCode = requiredCharType === 'LTR' ? ita2Code['LTR'] : ita2Code['FIG'];
punchTape(shiftCode, tapePosition++);
currentCharType = requiredCharType;
ltrButton.classList.toggle('active', currentCharType === 'LTR');
figButton.classList.toggle('active', currentCharType === 'FIG');
}
punchTape(code, tapePosition++);
}
}
function punchTape(code, tapePosition) {
if (tapePosition &gt;= 50) return;
for (let bit = 0; bit &lt; 5; bit++) {
const cell = document.getElementById(`baudot_${bit}_${tapePosition}`);
if (cell) {
cell.className = code[bit] === '1' ? 'cell punched' : 'cell unpunched';
}
}
}
function clearTape() {
for (let i = 0; i &lt; 50; i++) {
for (let bit = 0; bit &lt; 5; bit++) {
const cell = document.getElementById(`baudot_${bit}_${i}`);
if (cell) {
cell.className = 'cell unpunched';
}
}
}
}
generateTape();
textInput.addEventListener('input', function() {
updateITA2Code(this.value);
});
ltrButton.addEventListener('click', function() {
this.classList.add('active');
figButton.classList.remove('active');
if (textInput.value) {
updateITA2Code(textInput.value);
}
});
figButton.addEventListener('click', function() {
this.classList.add('active');
ltrButton.classList.remove('active');
if (textInput.value) {
updateITA2Code(textInput.value);
}
});
if (textInput.value) {
updateITA2Code(textInput.value);
}
}
&lt;/script&gt;
&lt;/div&gt;
&lt;/p&gt;
&lt;h2 id="歴史的背景電信からコンピュータへ"&gt;歴史的背景――電信からコンピュータへ&lt;/h2&gt;
&lt;p&gt;ITA2（国際電信アルファベット第2号）、通称ボードー・マレー符号は、エミール・ボードーが1870年代に考案した電信符号を改良して、1920年代に生まれました。こうした初期の電気通信の仕組みは、のちのコンピューティングの発展に直接つながっています。&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;5ビットの符号化方式は、文字符号化のごく初期の例です&lt;/li&gt;
&lt;li&gt;5ビットでは32通りしか表せないという制約から、LETTERS／FIGURESシフトという妙手が生まれました&lt;/li&gt;
&lt;li&gt;この方式は20世紀に入ってからも長らく、テレタイプに使われ続けました&lt;/li&gt;
&lt;/ul&gt;
&lt;h2 id="遊びながら状態機械を学ぶ"&gt;遊びながら状態機械を学ぶ&lt;/h2&gt;
&lt;p&gt;LETTERS／FIGURESのシフト機構は、状態機械（ステートマシン）の考え方を無理なく導入してくれます。いじっているうちに、同じパターンがモード次第で別の文字を表すことに、学生は自分で気づきます。状態に依存する符号化をこうして身体で覚えておくことが、のちのより複雑な概念への地ならしになるのです。
たとえば、ビットパターン&lt;code&gt;00011&lt;/code&gt;が表すのは次のとおりです。&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;LETTERSモードなら文字「A」&lt;/li&gt;
&lt;li&gt;FIGURESモードなら数字「1」
状態によって読みが二通りに分かれる――この仕組みこそ、コンピュータがデータを扱う根幹にあるものです。&lt;/li&gt;
&lt;/ul&gt;
&lt;h2 id="授業での使い方"&gt;授業での使い方&lt;/h2&gt;
&lt;p&gt;ITA2エミュレータを授業に組み込むアイデアを、いくつか挙げておきます。&lt;/p&gt;
&lt;ol&gt;
&lt;li&gt;&lt;strong&gt;暗号解読チャレンジ&lt;/strong&gt;：ITA2のパターンで符号化したメッセージを学生に解読させる&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;効率のよい符号化&lt;/strong&gt;：帯域を節約するうえでシフト機構がなぜ大事だったのかを議論する&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;符号化の進化&lt;/strong&gt;：ITA2の5ビット符号をASCII（7ビット）やUnicodeと比べる&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;フィジカル・コンピューティング&lt;/strong&gt;：この歴史的な仕組みを、Arduinoのような現代のマイクロコントローラに結びつける&lt;/li&gt;
&lt;/ol&gt;
&lt;h2 id="アクセシビリティの面から"&gt;アクセシビリティの面から&lt;/h2&gt;
&lt;p&gt;歴史的な面白さは別にしても、このアプローチは学び方の異なる学生それぞれに手がかりを与えます。&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;目で学ぶ学生には、パターンが見える&lt;/li&gt;
&lt;li&gt;手を動かして学ぶ学生は、符号化の過程に直接触れられる&lt;/li&gt;
&lt;li&gt;概念で考える学生は、情報理論の数学的な側面へ進める&lt;/li&gt;
&lt;/ul&gt;
&lt;h2 id="実装について"&gt;実装について&lt;/h2&gt;
&lt;p&gt;エミュレータはJavaScriptで書かれており、ウェブベースの学習プラットフォームなら何であれ簡単に組み込めます。コードはモジュール化してあるので、授業の場面に応じて自由に手を加えられます。
ソースコードの閲覧と試用はこちらから：
&lt;/p&gt;</description></item></channel></rss>