will be will be

東京都世田谷区のデザイン・編集事務所、
willsnow-dfl(柳田寛之)のWebサイトです。

ぶら下がりのこと

印刷物の組版の用語に「ぶら下がり(ぶら下げ)」というものがある。行末にかかった約物(カッコや句読点などの、仮名漢字数字以外の記号)を規定の行末位置からはみ出させる処理のこと。

私が最初にCSSを学んだ頃には、このぶら下がりの設定はCSSにはなく、最近になっていろんなサイトを見ても約物が行末からはみ出るどころか、その手前でガタガタしているサイトばかりで(なんでtext-align: justifyを利用しないのだろう…)、そんな設定は相変わらずないのだろうと思っていた。

しかしCSSもチビチビとバージョンアップしているということで、一応、と「CSS ぶら下がり」で検索してみる。すると、どうもウェブ業界の「ぶら下がり」とは行頭の頭出しインデント(リスト表示などで●や■などの頭飾りを1文字分段落のインデント位置から飛び出させる処理)のことを主に指すようで、こちらの表示の設定方法がグーグルの検索首位には並んだ。なるほど、英語でいう「hanging indent」に対応するものを表すということで、印刷物とウェブのタイポグラフィの違いを知る。

さらにしつこく下位の検索結果まで読んでいくと、ようやくこれにあたる設定を見つけることができた。hanging-punctuationというプロパティを利用するようだ(こちらこちらに詳細があります)。しかしこちらのサイトで見ると、目下Safaiで部分対応しているのみらしい。

当サイトのCSSにもこれを早速追記、Safariで反映されるのをテストで確認したのちにCSSをアップロードした。しかし、ややゆる目のhanging-punctuation: allow-endで設定しているのと、行末に句読点が掛かる機会が少ないということもあり、この結果はあまり目立たないようだ。

ぶら下がりのニーズが高いと思われる、一部の電子書籍リーダーでは対応しているという記事もあるので、今後ウェブブラウザでも対応が広がるといいのだが。

※外部リンクはサイト維持と取材費捻出のためにアフィリエイトリンクとなっている場合があります。気になる方はコピペで検索して下さい。

今日のオススメ

Bliss of Landing – Yoshiharu Takeda

確かどこかのレコ屋サイトを見ていて偶然知った武田吉晴という方のAspirationというアルバム。この曲は冒頭のもの。すべての楽器やプログラミングをご自分でやられているそうだが、宅録っぽい音の狭さは全く感じさせない。楽曲そのものはジャズっぽいけど、使っている楽器の音色やゆったりしたリズムも加わって、それにとどまらない面白い音楽になっている。長く聴き続けていきそう。