個人的には、<blockquote> 自体を <figure> で囲ったうえで、<figcaption> で表現するのがしっくりきました。

  1. 前書き
  2. 河童は頭の上の皿によくオムライスを乗せられる
  3. <blockquote> の近くに <cite> で書く
  4. <blockquotee> の内側に <footer> か <cite> で書く
  5. <blockquote> を <figure> で囲って <footer> か <figcaption> で書く
  6. このブログでは

前書き

突然ですが、河童の腹には袋があるという説を聞いたことがありますか?

芥川龍之介 河童
しかも河童は皮膚の下に余程厚い脂肪を持つてゐると見え、この地下の国の温度は比較的低いのにも関らず、(平均華氏五十度前後です。)着物と云ふものを知らずにゐるのです。勿論どの河童も目金をかけたり、巻煙草の箱を携へたり、金入れを持つたりはしてゐるのでせう。しかし河童はカンガルウのやうに腹に袋を持つてゐますから、それ等のものをしまふ時にも格別不便はしないのです。

芥川龍之介の『河童』を読んでいて、あまりにも当然のようにそう書いてあったので、河童ってそういうもんなのかと思ってました。でも、ちょっとググっても、この作品以外で河童の腹に袋があるという説は見かけないような。

作中にしても、べつに河童の腹に袋があるからといって、決定的に何かが左右されたりはしてないはずです。ただ、河童が腹の袋から取り出したハンカチで顔を拭ったりしてるだけです。

なんだろう? もしかして芥川龍之介のオリジナルなんでしょうか。なんか面白いので、個人的には好きな設定です。

河童は頭の上の皿によくオムライスを乗せられる

ブログ書いたりサイト作ったりしてて、HTMLで引用部分を表す <blockquote> 使うたびに疑問だったのですが、これって引用元の情報をどうやって表現すればいいんでしょうか。

<blockquote> には cite という属性がありますが、cite はURLしか指定できないらしいです。ていうか、属性なので目に見えません。大切なものだから目に見えないのかもしれません。

それじゃあ、ネット上以外の文章を引用する場合、HTML的には <blockquote> と引用元の情報を結びつける書き方は無いのだろうかとずっと思ってました。本とかゲームとかどうすんだってずっと思ってました。

と思って探してたら、普通にHTML5の仕様書にサンプルが載ってました。あれー

次のサイト様で日本語訳が読めます。

以下、載ってる例からざっくり抜粋します。河童が青空文庫に載ってない体で見てください。

<blockquote> の近くに <cite> で書く

これで済むならこれでいいですよね。って、これじゃ <blockquote> とそれとの明示的な結びつきを表現できないからモヤモヤしてるんじゃないか。

<p> 突然ですが、河童の腹には袋があるという説を聞いたことがありますか?</p>
<p> これは<cite>芥川龍之介</cite>の『<cite>河童</cite>』に出てくる説です。</p>
<blockquote>
	しかも河童は皮膚の下に余程厚い脂肪を持つてゐると見え、この地下の国の温度は比較的低いのにも関らず、(平均華氏五十度前後です。)着物と云ふものを知らずにゐるのです。勿論どの河童も目金をかけたり、巻煙草の箱を携へたり、金入れを持つたりはしてゐるのでせう。しかし河童はカンガルウのやうに*腹に袋*を持つてゐますから、それ等のものをしまふ時にも格別不便はしないのです。
</blockquote>

<blockquotee> の内側に <footer> か <cite> で書く

<blockquote> の内側っていいの!?と思ったけど、<footer><cite> なら良いらしいです。<cite> は作品名または著者、<footer> は著作権情報などを表せる要素です。

しかし <footer> って名前的に、引用文の前には書きにくいかなあ。普通は前には書かないんだろうけど。

footer
<blockquote>
	しかも河童は皮膚の下に余程厚い脂肪を持つてゐると見え、この地下の国の温度は比較的低いのにも関らず、(平均華氏五十度前後です。)着物と云ふものを知らずにゐるのです。勿論どの河童も目金をかけたり、巻煙草の箱を携へたり、金入れを持つたりはしてゐるのでせう。しかし河童はカンガルウのやうに*腹に袋*を持つてゐますから、それ等のものをしまふ時にも格別不便はしないのです。
	<footer><cite>芥川龍之介 河童</cite></footer>
</blockquote>
citeのみ
<blockquote>
	しかも河童は皮膚の下に余程厚い脂肪を持つてゐると見え、この地下の国の温度は比較的低いのにも関らず、(平均華氏五十度前後です。)着物と云ふものを知らずにゐるのです。勿論どの河童も目金をかけたり、巻煙草の箱を携へたり、金入れを持つたりはしてゐるのでせう。しかし河童はカンガルウのやうに*腹に袋*を持つてゐますから、それ等のものをしまふ時にも格別不便はしないのです。
	- <cite>芥川龍之介 河童</cite>
</blockquote>

<blockquote> を <figure> で囲って <footer> か <figcaption> で書く

画像以外に <figure> を使う発想がまったく無かったんですけど、確かに文法的にはぜんぜん問題ありませんでした。

見慣れてくると、個人的にはこれの <figcaption> のパターンが一番しっくり来るかもです。なんか図表的な使い方をしたいんですよね。

figure + footer
<figure>
	<blockquote>
		しかも河童は皮膚の下に余程厚い脂肪を持つてゐると見え、この地下の国の温度は比較的低いのにも関らず、(平均華氏五十度前後です。)着物と云ふものを知らずにゐるのです。勿論どの河童も目金をかけたり、巻煙草の箱を携へたり、金入れを持つたりはしてゐるのでせう。しかし河童はカンガルウのやうに*腹に袋*を持つてゐますから、それ等のものをしまふ時にも格別不便はしないのです。
	</blockquote>
	<footer><cite>芥川龍之介 河童</cite></footer>
</figure>
figure + figcaption
<figure>
	<blockquote>
		しかも河童は皮膚の下に余程厚い脂肪を持つてゐると見え、この地下の国の温度は比較的低いのにも関らず、(平均華氏五十度前後です。)着物と云ふものを知らずにゐるのです。勿論どの河童も目金をかけたり、巻煙草の箱を携へたり、金入れを持つたりはしてゐるのでせう。しかし河童はカンガルウのやうに*腹に袋*を持つてゐますから、それ等のものをしまふ時にも格別不便はしないのです。
	</blockquote>
	<figcaption><cite>芥川龍之介 河童</cite></figcaption>
</figure>

このブログでは

というわけで、記事冒頭の引用部のHTMLは以下のようになりました。

<figure class="quote">
	<figcaption><a href="https://www.aozora.gr.jp/cards/000879/files/45761_39095.html" target="blank"><cite>芥川龍之介 河童</cite></a></figcaption>
	<blockquote cite="https://www.aozora.gr.jp/cards/000879/files/45761_39095.html">
		しかも河童は皮膚の下に余程厚い脂肪を持つてゐると見え、この地下の国の温度は比較的低いのにも関らず、(平均華氏五十度前後です。)着物と云ふものを知らずにゐるのです。勿論どの河童も目金をかけたり、巻煙草の箱を携へたり、金入れを持つたりはしてゐるのでせう。しかし河童はカンガルウのやうに<em>腹に袋</em>を持つてゐますから、それ等のものをしまふ時にも格別不便はしないのです。
	</blockquote>
</figure>

いや、やっぱり引用元が上に書いてあるのってどうなんだ?? あんまり普通じゃないような……。

あと、なんとなく私は <a><cite> の外側に書きたい派です。<a> は作品名じゃないからです。<code> とか <time> をリンクにする場合も同じです。伝わるかこのニュアンス。