(2020/07/05)
スタイルシートを使ふことで、ある程度満足の行くカナモジ文が作成できることが分かったので、参考のために、作成例を紹介します。まづ、見本として、日本国憲法の一文を使用します。
見本
「＜div style="border:solid;">＜/div＞」内で例文を紹介します。「border:solid;」はカナモジ文に直接関係ありませんが、＜div＞領域を明示するために指定してゐます。
- ＜div style="border:solid;">＜/div＞
日本国民は、国家の名誉にかけ、全力をあげてこの崇高な理想と目的を達成することを誓う。
全角片仮名
この文を全角片仮名で書き換へます。分かち書き用の空白も必ず全角で挿入してください。
ニッポンコクミン ハ、 コッカ ノ メイヨ ニ カケ、 ゼンリョク ヲ アゲテ コノ スウコウ ナ リソウ ト モクテキ ヲ タッセイ スル コト ヲ チカウ。
半角片仮名
参考までに、半角片仮名で書き換へたものを紹介します。しかし、濁点・半濁点による透き間が不自然ですし、空白とのバランスも良くありません。半角片仮名のフォントは暫定的な情報伝達用であり、ストレスなく文章読解に没頭できるやうなデザインではありません。
ﾆｯﾎﾟﾝｺｸﾐﾝ ﾊ､ ｺｯｶ ﾉ ﾒｲﾖ ﾆ ｶｹ､ ｾﾞﾝﾘｮｸ ｦ ｱｹﾞﾃ ｺﾉ ｽｳｺｳ ﾅ ﾘｿｳ ﾄ ﾓｸﾃｷ ｦ ﾀｯｾｲ ｽﾙ ｺﾄ ｦ ﾁｶｳ｡
半幅中央
さて、ここで、全角片仮名を含む領域のスタイルに属性を追加します。「transform:scale(0.5,1);」です。なほ、この属性はブロック要素で有効になります。インライン要素に指定しても無視されます。「scale(0.5,1)」の 0.5 が横幅で、1 が縦幅です。横幅を 0.5 にしたことで、＜div＞領域の横幅が半分になり、内部の文字も横幅が半分になります。この値が 1 以上になると、＜div＞領域が、隣の領域にはみ出てしまひますので、原則 1 以下にしてください。
- ＜div style="border:solid;transform:scale(0.5,1)">＜/div＞
ニッポンコクミン ハ、 コッカ ノ メイヨ ニ カケ、 ゼンリョク ヲ アゲテ コノ スウコウ ナ リソウ ト モクテキ ヲ タッセイ スル コト ヲ チカウ。
半幅左寄せ
これで、全角片仮名を美しく半幅にすることができます。ただ、左右の余白が多くて物寂しい印象を受けます。これを解決するには、「transform-origin:left top;」を追加して、＜div＞領域の開始位置を制御できるやうにします。
- ＜div style="border:solid;transform:scale(0.5,1);transform-origin:left top;"＞＜/div＞
ニッポンコクミン ハ、 コッカ ノ メイヨ ニ カケ、 ゼンリョク ヲ アゲテ コノ スウコウ ナ リソウ ト モクテキ ヲ タッセイ スル コト ヲ チカウ。
全幅
開始位置を制御できたのですが、今度は右側半分が余白になり、物寂しさがさらに増してきます。それを解決するために「width:200%;"」を追加します。これで＜div＞領域の横幅が 2倍になります。
- ＜div style="border:solid;transform:scale(0.5,1);transform-origin:left top;width:200%;"＞＜/div＞
ニッポンコクミン ハ、 コッカ ノ メイヨ ニ カケ、 ゼンリョク ヲ アゲテ コノ スウコウ ナ リソウ ト モクテキ ヲ タッセイ スル コト ヲ チカウ。
漢字ルビ
これで、それなりに納得できるカナモジ文が完成しました。しかし、片仮名の羅列だけでは、検索エンジンに拾はれる可能性は高くありません。片仮名に漢字のルビを振ることにします。漢字のルビは検索エンジン用なので、必ずしも、漢字を視認できる大きさである必要はありません。また、同音異義語の多い漢字熟語をルビとして補足できるので、カナモジ文を読解中に解釈で曖昧な部分は、漢字のルビが読解のヒントになります。
ニッポンコクミン ハ、 コッカ ノ メイヨ ニ カケ、 ゼンリョク ヲ アゲテ コノ スウコウ ナ リソウ ト モクテキ ヲ タッセイ スル コト ヲ チカウ。
