|   | ☜  31  32  33  34  35  |

ルビ (ふりがな) を振る

ルビとは、漢字の上に振られる読み仮名のことです。ホームページ・ビルダーでルビを振る方法を紹介します

ビルダーでルビを振る

  • XHTMLソース:
    • <p>
    •  <ruby>
    •    <rb>ルビ</rb><rp>(</rp><rt>るび</rt><rp>)</rp>
    •  </ruby>
    • とは、
    •  <ruby>
    •    <rb>漢字</rb><rp>(</rp><rt>かんじ</rt><rp>)</rp>
    •  </ruby>
    •  <ruby>
    •    <rb></rb><rp>(</rp><rt>うえ</rt><rp>)</rp>
    •  </ruby>
    •  <ruby>
    •    <rb></rb><rp>(</rp><rt></rt><rp>)</rp>
    •  </ruby>
    • られる
    •  <ruby>
    •    <rb></rb><rp>(</rp><rt></rt><rp>)</rp>
    •  </ruby>
    •  <ruby>
    •    <rb>仮名</rb><rp>(</rp><rt>がな</rt><rp>)</rp>
    •  </ruby>
    • のことです。</p>

ホームページ・ビルダーでルビ (ふりがな) を設定する方法です。

① ルビを振る文字列をドラッグで選択します。

② メニューバーから [書式 - 文字飾り - ルビ] を選択します。

③ [ルビ] にふりがなを入力します。

④ [OK] ボタンをクリックします。

⑤ プレビュー画面でルビを確認します。

これを表示するマークアップは右のXHTMLソースとなっています。

ページトップへ

ルビを振るのに使うタグ

<ruby> タグ

<rb> タグ

<rt>タグ

<RP>タグ

ページトップへ

ルビのスタイルの設定

ルビのスタイル設定ルビのスタイル、すなわちルビの位置や配置がどのように設定できるかを、「スタイルの設定」ダイアログで見る。

[ルビの位置] ruby-position ルビの位置を指定することができます。

[ルビの配置] ruby-align ルビの配置場所を以下から選択します。

[ルビの表示領域] ruby-overhang ルビの表示領域を以下から選択します。

ページトップへ

Word でルビを振った Doc 文書を HTML 文書にコピーする

ルビを振る作業は、ワードで行うと、まとめて簡単に行うことができます。そこでワードで振ったルビ付のテキストを HTML に取り込むことを考えました。

① ワードでルビを振った文書を作成します。

ワードアイコン閲覧上の注意: 左の docx アイコンをクリックすると、ファイルの拡張子が zip になることがあります。その場合は、「保存」 を選択します。保存が完了したら、解凍しないままでそのファイルを右クリックし、「名前の変更」を選択し、拡張子の zip を docx に変更します。

「名前の変更」 ダイアログボックスが表示され、「拡張子を変更すると、ファイルが使えなくなる可能性があります。変更しますか?」 と出ますので、「はい」 をクリックします。

拡張子を変更したファイルを開くと、Word で表示されます。

注意アイコン

docx ファイルをダウンロードしようとすると、拡張子が勝手に zip に変更されてしまう。

docx のファイルの実体は、テキストファイルではなく zip 形式です。zip は複数のフォルダやファイルを一つにまとめて全体のサイズを小さくするファイル形式です。

.docx は文書や画像、動画といった複数のファイルをまとめて内包し、 それを zip 形式で圧縮する形で保存しています。そのフォルダの拡張子を docx としているだけなのです。docx としておけばその zip ファイルを Word で開き編集できることを意味しています。

このようなことなので、特定な条件下で、ブラウザが勘違いしてしまうようです。対処は上に記述したとおり、名前の変更でファイルの拡張子を変更することです。

名前を付けて保存でHTML形式を選択する

② ルビを振ったワード文書を、「Web ページ (フィルター後)」 で、名前を付けて保存します。

HTML 形式で保存する場合には 「Web ページ (*.htm, *.html)」 または 「Web ページ (フィルター後) (*.htm; *html)」 のどちらかを選択します。どちらの形式も HTML 形式で文書を保存しますが、フィルターを行った場合には Word 固有の情報を除去した後で HTML 形式で保存します。その為、フィルターを行うと一部の情報が抜け落ちる場合があります。

保存後にあらためて Word で編集を行う場合はフィルタを行わずに保存し、最終的に HTML 文書としてだけ利用する場合にはHTML 形式としては不必要な情報をフィルターして保存します。

用語解説アイコン

単一ファイル Web ページ (MHTML) とは

インライン グラフィックス、アプレット、リンクされた文書、文書内で参照されるその他のアイテムを MHTML 形式で単一のファイルに保存した HTML 文書。

③ ホームページ・ビルダーで HTML ページを開き、ルビ付き文書を挿入する該当場所で、クリックします。

④ 「挿入」 から 「ファイル」 で 「その他ファイル」 をクリックし、挿入するファイルを指定し、「開く」 をクリックします。

ファイルの挿入ダイアログボックス

⑤ 「ファイルの挿入」 ダイアログボックスが表示されるので、ファイルを挿入する方法で、「HTML ファイルの挿入(ページ内部品のみ)」 にチェックを入れます。

ファイルを挿入する方法を指定します。

[1つのベタ書き段落を作成]

[改行位置を保持]

[空行を境に標準段落に分割]

[コンマ区切りのデータを表に変換]

[タブ区切りのデータを表に変換]

[HTML ファイルの挿入 (文書のみ)]

[HTML ファイルの挿入 (ページ内部品のみ)]

[HTML ファイルの挿入 (ヘッダー/ページ内部品)]

⑥ 「OK」 をクリックします。

ルビを振った文字が挿入されます(下記)。

赤い(あかい)蘇鉄(そてつ)の ()熟れる(うれる)(ころ)

加那(かな)年頃(としごろ) 加那(かな)年頃(としごろ)

大島育ち(おおしまそだち)

 

黒潮(くるしゅ)黒髪(くるかみ) (うな)(ぐみ)ぬかなしゃ

想い(おもい)()(むね)に 想い(おもい)()(むね)

織る(おる)(しま)(つむぎ)

 

(あさ)北風(にしかぜ) ()南風(みなみかぜ)

(おき)(たち)(がみ) (おき)(たち)(がみ)

また片瀬波(かたせなみ)

 

夜業(よなべ)おさおさ 織る(おる)(おさ)(おと)

せめて(かよ)わそ せめて(かよ)わそ

この(むね)添えて(そえて)

ページトップへ

|   | ☜  31  32  33  34  35  |