{一日一文}{継続出来る}{後悔はなかった}{書いてしまった}{何について}{設けない}{導入していく}{様子を見ながら}{漸進的に}{意識した}...=}(72)

{希哲16年4月28日の日記 K#F85E/A-E74C-B4BC}

第四次宣伝攻勢開始前日なので,輪郭選り手抜控機能整備くらいは終わらせてしまいたかったが,事務的な用事もあり時間的に中途半端だったため,久しぶりの一日一文書きながら宣伝攻勢方針についてまとめた

文章書いたように,第四次宣伝攻勢は「新生デライト開発実況」という趣向行くことにした。

従来通り朝昼晩1時間ずつ目安とした宣伝加えて一日一文再開することにした。これまでの一日一文は“未来人”の読者想定したかなり長期的視野書いていたため,短期的な成果求めている時にはどうしても後回しになり,継続出来なかった。そこで,ここからはいったん一般読者意識した書き方改め希哲館訳語などは様子を見ながら漸進的に導入していくことにした。デライト宣伝兼ねられるものなら継続出来るだろう。

また,一日一文にはあえて時間制限設けないことにした。何についてどれだけ書くべきかは状況次第だ。この日も,最初は1時間程度で書こう思っていたものの,久しぶりに深夜まで熱中して長文書いてしまった。ただ,大きな意義感じられ後悔はなかった

29日振り返り日記

{希哲16年4月7日の開発}{希哲16年4月7日の進捗}{ページ遷移無し}{停止する}{フォームの送信}{`-webkit-tap-highlight-color`}{妙な効果}{タップ時}{用意されている}{`-webkit-text-size-adjust`}...=}(75)

{希哲16年4月7日14歩 K#F85E/A-E74C-D3A9}

進捗時限記録中略

細かい装体調整など。

iOS上のSafariで,横方向での閲覧時に引き入れ輪郭が不自然に大きく表示される」という不具合報告があったが,確かに手元iPhone同様現象があり,気になっていたデライトの不具合にしては不可解なのでもしかしたら舞覧稀なバグなのかと思ったが,再現性があるらしいことが分かったため調査した。

結局諸場舞覧自動拡大機能であり,text-size-adjust-webkit-text-size-adjust)という制御用CSS プロパティまで用意されていることが分かった。以下のようにして解決

-webkit-text-size-adjust: 100%;
text-size-adjust: 100%;

もう一つ諸場舞覧気になっていたことに,輪結ボタンタップ時妙な効果入るというのがあったので,ついでに調べてみると,これも諸場舞覧特有機能で,-webkit-tap-highlight-color不可視出来た


スマホ弄っているうちに,iOSSafari全知検索ボタン動き付け止まっていることに気付いた

これはフォームの送信などで描画処理停止する Safari 特有仕様であることが分かったSafari の問題といえばそうだが,実用上の問題はなく,まともな解決策無さそうなので放っておくことにした。

全知検索整備方針定まったことだし,そろそろページ遷移無し輪郭一覧更新出来るようにしてもいい頃だろう。

=}
{踏み切れた}{`radial-gradient()`}{作れた}{理想的な陰影}{簡単なようで}{実験していた}{画段}{色々な場面}{稀に起こる}{外していた}...=}(203)

{希哲16年3月28日の開発 K#F85E/A-E74C-5B9D}

KNEST 隠し実装の再開金風といった出来事中断していた昨年9月以来,初めての Aejs出振るい終えた最初微調整程度でとりあえず出振るい目指すつもりだったが,あっという間下見機能陰影付きスクロール形になり,一応の新輪郭選り手」が出来た

外観操作性ともに洗練された新輪郭選り手日々の描出がより快適になることはもちろん下見機能手定め領当て調整大幅に効率化することによりデラング整備加速するだろう。そもそも Aejs出振るい出来なかったことで前縁関して出来ること限られていたため,その障害無くなったことが大きい

新輪郭選り手

今回出振るい以前を「旧輪郭選り手」,以後を「新輪郭選り手」と仮に呼んでいる

新輪郭選り手では,@oln.bld詰め込んでいた選り手関連機能@oln.edr_dln.bld@oln.edr_knm.bld整理し,複雑な機能見通し良く管理出来るようになった。これにより,保守性もちろん全体として見触れ大きく改善した。

まず,これまで知名選り手角丸長方形で,描写選り手吹き描き合わせた眼形表示していたが,両方開いている場合は「合体選り手」として眼形になるようにした画面撮り新規描出フォーム再描出フォーム旧輪郭選り手では単独開いた場合外観変わらず調和感欠けていた画面撮り新規描出フォーム再描出フォーム挙動もより連動的になり,自然になった。

描写選り手右脇適当に付けていた取り消しボタンも,合体選り手では知名選り手描写選り手同時に閉じる機能分かりやすくなり,見た目洗練された

描出ボタン22日9歩方針まとめ目障りにならないデザイン保ちつつ初心者にも分かりやすいものに出来た

挙動面では,違了処理整備若干表示タイミングなどに出来ていたぎこちなさ解消出来た外していた選り手溶暗溶明動き付け復活させ,滑らか見えるようになった。

まだ様子見必要だが,違了処理整備のあたりから出来ていた不具合解消期待出来る。特に描写選り手二重いたり,デラング記法消去して再描出してしまう不具合稀に起こるのが気になっていた

今回目玉となった下見機能は,思わぬ形あっさりまとまった感触く,色々な場面活躍してくれるだろう。

陰影付きスクロール

26日14歩出来た陰影付きスクロール同時に出振るいした画面撮り下見機能にも有用気付いたことで実装踏み切れた

背景色溶暗していく「溶暗付きスクロール」として考え始めたのは昨年3月11日9歩だったが,空行続くこともあり閲覧性必要な描写部には不向き気付いてからは,薄い陰影付ける方向実験していた

これも簡単なようで調整難しかった陰影がかかる高さ濃さ画段微妙な緩急調整繰り返し,さりげなく,かつ分かりやすい理想的な陰影ようやく作れた一時linear-gradient() ではなく radial-gradient() を使って中央丸みのある陰影試したが,交度部区などに重なった時に視認出来なくなるためやめた

諸場舞覧などスクロールバー出ない舞覧スクロール可能であることが非常に分かりにくいという用合い上欠陥がこれで解消したスクロールバーの出る舞覧でもより直感的スクロール可能であることが分かるようになり,効果大きい

{HTML}{駒手記法}{進捗記録}{あれ}{希哲16年2月20日13歩}{神秘的な}{別に}{実装した}{付けた}{階層区切り}...=}(248)

{希哲16年2月15日24歩 K#F85E/A-E74C-1EF9}

進捗時限記録中略

不意に閃いた階層区切り線」についての方針まとめて終了

従来の見出し未満区切り線記法に,見出し階層越えられる階層区切り線」を加える。以下のように,唯一通常の区切り線区別出来る見出し記号 #全角 使う

* 第1階層
** 第2階層

#========================#

第1階層段落。

#------------------------#

第2階層段落。

#- - - - - - - - - - - - #

第3階層段落。

#. . . . . . . . . . . . #

第4階層段落。

##

第1階層段落(# の数でも調整出来る)。

持ち辺モチベーション

従来の区切り線記法は,HTML において対応する <hr>性質上見出し未満区切りにしか使えなかった

見出し階層作った後で描写全体に対するフッター的なものを書こうとする第1階層見出し作る必要があるが,しばしば大袈裟感じられることがある。

検討過程

空見出し」の挫折

今回検討当初は,「空見出し」という概念主に考えていた区切り線長さ任意であるべきなので,どうっても自然な形階層調整出来そうになかった。その点,見出し内容出来れば手っ取り早い

しかし,等号星号区切り線使う予定なので,== のように第2階層以降で内容空にする衝突することになる。

区切り線の方を見直しても,--区切り線なら == はやはり二重区切り線であってほしい。直感性下線形見出しとの整合性考えるとこれは捨て難い星号による区切り線はそれに比べればまだ転用余地があったが,その代わり *使う Markdown の区切り線記法との互換性損われる

そもそも,「空見出し」という概念にも無理がある文字を書くから見出しなのだし,実質的に区切り線なのだから,直感的とは言い難い

階層区切り線」の閃き

ここで,唯一区切り線記法被らない見出し記号である番号記号思い出した

番号記号による見出しは,ハッシュタグ駒手記法との衝突避けつつ atx 式見出しある程度互換性持たせるため,## のように2個以上条件対応していた個人的に好きな記法ではなかったこともあり,おまけのような扱いで,ここまで気付かなかった

すでに「空見出し」に感じていて,区切り線記法での対応立ち返っていたことで,この ##特殊な区切り線みなせる特徴持っていることに気付いた記号2個以上繰り返す区切り線見える記法で,実際普文枠線的な装飾使われることが多い記号でもある。

特に,区切り線記法としての統一感直感性保てる2個第1階層表せるということは決定的に重要な点で,見出し記号個数階層関係一致しないとどうしてもちぐはぐ見えてしまう。これは,衝突回避したとしても等号星号では解決出来ない問題だ。区切り線記号としての最短形見出し記号としての第1階層対応しうる唯一記号番号記号だった。

ただし,通常の区切り線記号異なり,個数階層対応するため,普文装飾兼ねられないという問題があった。上位階層区切り線普文上で目立つように書けない

これは,最新の区切り線記法下線形見出し記法検討9日17歩19歩踏まえ見出し階層対応する4種区切り線組み合わせる解決することにした。つまり,第1階層から順に最短形#==##--##- -##. .# というように区切り線組み合わせることが出来るようにする。これがまた都合が良いことに,よくある装飾見える

9日15歩以後,見出し下線区切り線長さ区別出来るようになっているため,区切り線装体にはある程度多様性持たせ問題ない一方見出し下線階層表す装体になっているため,一定制限必要になる。この点でもぴったり噛み合った

別に2個以上良いだろうと実装した区切り線記法おまけ感覚付けた番号記号による見出し記法最近の拡張方針……何気ない全てパズル要素だったかのように思える神秘的な閃きだった。

番号記号見出し仕様厳密化

この階層区切り線考案に,番号記号による見出し常に2個最上位階層とすることにした。つまり,*=##始まる見出しはともに最上位階層表す

これまで異なる見出し記号併用することは特に想定しておらず,実際使われていないはずなので,記号個数単純に計算していた。見出し階層相対的な個数決まるため,*始まる見出しがあると ##第2階層になる。これは階層区切り線整合しない。

特に仕様として決めていたことではないため,ここで厳密化することにした。

実装上の課題

仕様完璧思えるが,実装上の課題残った

HTMLCSS機能的には,可接性ちつつ見出し要素隠すことは造作もないが,SEO 上の懸念多少ある。今の検索演心評価理積みはそこまで単純ではないだろうが,伝統的に見出し要素隠すべきではないとされてきただけに,どこまで不利になるか分からない出来るだけ行儀の良い実装方法見つけたい

そもそも見出し要素にしてはいけないのか,<section> あたりを使って上手く誤魔化せないか,など色々考えてみたが,どれも多かれ少なかれ怪しさ残る

見出しの無い階層区切りというのは HTML想定外だったのだろう。

{色見本}{色見本記法}{デラング}{進捗記録}{書く}{Markdown}{あれ}{特殊形}{交度埋め込み}{難があった}...=}(96)

{希哲16年2月15日18歩 K#F85E/A-E74C-E831}

進捗時限記録中略

交度コード記法埋め込み記法組み合わせた交度埋め込み記法仮称方針まとめて終了

例えばMermaid埋め込みたい場合,以下のような書き方になる交度部区コードブロック記法は「逆括点バッククォート2つ以上」にする予定

+``mermaid
...
``

あるいは

+mermaid``
...
``

最近デラングMermaid 対応についてぼんやり考えていたが,場当たり的拡張はしたくないので,「外部言語による表現埋め込む汎用的な記法」がまず必要だと感じていた

GitHubMermaid 対応という話題目にしたことがきっかけで,これが急速に進展した。GitHub も含め,Markdown での Mermaid 対応は,いわゆるコードフェンスをそのまま使った記法採用例多い。これは私が嫌だった場当たり的拡張そのものだった。

コードフェンスは,「交度提示する記法であって,単に交度が書ける記法ではない。そうでなければ従来用法矛盾が生じるのは明らかなので,これは言語設計として悪手としか言いようがない

ただ,その愚かさ瀕答ヒントにもなった。つまり,深く考えなければ,多くの人にとって交度記法違和感なくこの種の記法応用出来る,「直感的な記法」であるということだ。

もう一つ,逆括点代わりに埋め込み記法拡張として以下のように書けたらどうか,と考えていたことも瀕答になった。

++mermaid
...
++

これは何かと整合性難があったが,役割として埋め込み記法一番近いとは感じていた。この二つを組み合わせればいい,と気付いて出来たのが今回の「交度埋め込み記法」だ。


言語名逆括点の前でも後でも大きな違和感はない。前に付けられるようにした方が,行内交度記法応用しても一貫性がある。

交度埋め込み先例として KaTeX による数式記法があるが,これは以下のような交度埋め込み記法特殊形とみなすことが出来る。

+katex``
...
``

行内でも使える: ++katex`...`++

さらに,これは色見本にも応用出来る可能性がある。サービス通類ツールによっては,行内交度記法色符号カラーコード書く自動的に色見本付加するものがある。

流石にそれはお節介過ぎるが,「色見本記法」があるといいとはずっと思っていた希哲15年3月31日1歩。例えば,++`#000000`++色見本が出来てもいいかもしれない。

{HTML}{HTML5}{デラング}{進捗記録}{高い}{あれ}{役割を持たせる}{役割を持つ}{緩衝的}{実践的な}...=}(248)

{希哲16年2月15日10歩 K#F85E/A-E74C-2CA8}

進捗時限記録中略

昨日寝る直前にまた脳爆発があり,今朝にかけて文字装飾記法タグ記法周りの概念整理仕様整理急速に進んだ

文字装飾記法は,「文字装飾を伴う慣用表現」のための記法位置付けることにした。太字記法##斜体記法//下線記法__打ち消し線記法~~翌日のまとめで「打ち消し記法」から改称4記法基本とし,それぞれ所定装体スタイルを伴う <b><i><u><s> HTML 要素対応する

@ を使った文字サイズ記法% を使った色記法検討していたが,タグ記法概念が出来たことで中途半端なものになるため,これは廃案とする。

文字装飾記法はこれがほぼ完成形か。

検討過程

3つ検討方針

実装自体は容易部類で,記法概ね固まっていたにもかかわらず文字装飾記法実装踏み切れなかった理由として意味論的な問題があり,これが思いのほか難題だった。実装方針3通り考えられる

  1. 完全に意味論的な記法にする
  2. 完全に装飾的な記法にする
  3. 意味論装飾重ね合わせた記法にする

記法趣旨からしても,軽量標記マークアップ言語特性を考えても,1つ目に無理があるのは明らかだ。対応する HTML<b><i><u><s> は,私が何度解説を読んでもややこし感じる代物だ。それを多くの人正しく理解して使うのは不可能だろう。そもそも「文字装飾記法」という分かりやすい説明体系捨てることになるが,代替案があるわけでもない。

かといって,2つ目ももったいない。要は <span>装体指定だけにするということだが,例えば,太字にはしたいが <b> にはしたくない場合打ち消し線引きたい<s> にはしたくない場合がどれだけあるのかと考えると,無難通り越して臆病過ぎる失う可接性アクセシビリティ応用可能性釣り合わない

最終的に採用することになった3つ目も,全く考えなかったわけではないが,柔軟性に欠け,前の2つの悪い所組み合わされる気もして,有力案にはなっていなかった。

タグ記法による書き分け

この膠着状態変えたのは,前日概念としてまとまったばかりのタグ記法だった。

これまで,デラングにおける HTML は,どうしてもデラング出来ない表現をしたい場合などの“抜け道”とか“救済措置”に近い位置付けで,積極的に使うことを想定していなかった。実際個人的にはほとんど使っておらず放置している不具合多い部分だった。

デラングタグ記法として間接的に HTML使うことで,略記法導入可能になり,HTML 側の仕様変更に対しても一定の緩衝帯設けることが出来る。ここに来て初めて文字装飾記法でも「書き分け」が考えられるようになった文字装飾記法対応しうるのが全て1文字要素だったことも幸いした

昨日寝る直前に,##太字的な表現##<{font-weight:bold}>太字</> のように書き分けるよりも,##太字##<b>太字的な表現</b> のように書き分ける方がマシであることに気付いて,1つ目の実装方針完全に潰せた

これにより一時的に2つ目の実装方針再浮上したが,標準的に使う記法として標準的な用途最適化不足なのはやはり否めなかった

決着

最終的に,「文字装飾を伴う慣用表現」という用者自然に理解出来る範囲での意味論的位置付け与え逸脱する用途ならタグ記法書き分けるのが使用頻度に対して最適だろうという結論に達した。3つ目の実装方針洗練させた格好になる。

例えば##太字## は「太字装体<b>」に対応する装体邪魔なら <b>太字的な表現</b>書けるし,意味邪魔なら <{font-weight:bold}>太字</>略記法検討段階のように書けるが,これらの場合稀少なのは明らかで,記述量上手く釣り合うワープロならともかく,軽量標記言語手書きしようという人にとって難しい使い分けではないだろう。

そもそも<b><i><u><s> は,古くからある視覚的要素HTML5慣用的な用途引き継いで意味論化されたものなので,「文字装飾を伴う慣用表現」と非常に相性が良い相互変換にも全く問題ない

何より,直感的に入力すれば構造的に出力されるというデラングの理想適っている

文字サイズ記法色記法廃案

文字装飾記法を「文字装飾を伴う慣用表現」と位置付けたことで,慣用表現を持たない文字サイズ記法色記法仲間外れになるが,タグ記法によって出る幕がなくなった感があるので,ここで廃案にすることとした。

第一に,タグ記法略記法整備した方が一貫性応用可能性高い特定プロパティ省略出来るようにし,<{white}>白い文字</> のように書ければ,%white%白い文字%% と書くのと記述量大差ない

もともとパラメーター必要とする記法異質感はあり,文字装飾記法統一感損うかという懸念はあったので丁度良かった

波及的検討

波及的に,いくつかこまごまとした検討進んだ

組み合わせは「」ではなく「入れ子」へ

これまで,複数文字装飾記法組み合わせ#/太字と斜体/# のように,「記号を1つずつ逆さにした終了記号挟む」といったややこしい説明考えていたが,##//太字と斜体//## のような「入れ子」を #/太字と斜体/#短縮出来るという考え方にした方が分かりやすいため改めることにした。

タグ記法発展

今回検討で,タグ記法早くも実践的な役割を持つことになり,デラングにおける存在感一気に増した

タグ記法HTML仕様変更対する緩衝的役割を持たせること,要素名省略<span> にすることを考え始めた

{デラング}{進捗記録}{Markdown}{希哲16年2月15日24歩}{希哲16年2月9日の開発}{使うこと}{維持すべき}{既存輪郭}{setext 式見出し}{希哲16年2月9日17歩}...=}(61)

{希哲16年2月9日19歩 K#F85E/A-E74C-5731}

進捗時限記録中略

Markdownsetext 式見出しをどうデラング見出し記法取り入れるかの検討終了

区切り線混乱しないようにというのが課題だったが,現在デラング実装では,段落直後に続く区切り線記法機能していないことに気付いた明確に意図していたわけではないはずだが,既存輪郭についての心配は要らなくなった。好都合偶然だ。

とはいえ,省割として空行まずに使える利便性捨て難いので,5日3歩方針維持すべきか。

=-3つ以上というのは,2つ体裁考えず省力のために使うこと多いということと,3つ以上区切り線こうとする人なら Markdownsetext 式見出しにも気を付けるだろうという狙いがある。

これと,最新の見出し装体前歩区切り線記法についての検討総合すると,以下のように破線点線加えた拡張可能性見えてきた

第1階層
=======

第2階層
-------

第3階層
- - - -

第4階層
. . . . 
=}
{方針}

{}