{希哲16年4月5日の開発}{希哲16年4月5日の進捗}{CSS 変数}{生み出した}{伝証}{合理化した}{呼ぶべき}{汚い現実}{ウェブの理想と現実}{もたらされる}...=}(208)

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

CSS 変数(カスタムプロパティ)の導入舞覧ブラウザ五年対応原則採用決め終了今後デライトでは,「5年以内離立された版存主要舞覧」を中心に対応していく

希哲15年3月1日の開発から「デライト推奨動作環境」として同様の定義考えてはいたが,当時は,古い舞覧対応努力はするが推奨はしない程度の,もっと緩やかなものを想定していた


希哲13年ECMAScript 2015HTML5CSS3比較的新しいウェブ標準導入決めてからだいぶモダンにはなったが,まだデライトの舞覧対応方針には感覚的保守的なところがあった。感覚的に影響範囲の広い付徴主要舞覧対応から10年影響範囲の狭い付徴5年目安導入考えていたrem ですら必要以上には使わなかった

先日前次記法実装グリッド領当て導入したが,これはちょうど主要舞覧使えるようになってから5年ほど経つ機能だった。一記法装体過ぎなかったこともあり,ここまで辛うじて良かったが,他にも色々応用したいことが出てき舞覧対応方針見直し必要を感じていた

決め手は,デライトのダークテーマ対応見据えて CSS 変数の導入考え始めたことだった。CSS 変数主要舞覧対応から5年ほど経つが,本格的に導入するとなると影響範囲広がり過ぎる


Can I use対応舞覧よく調べるようになってから,「5年以内離立された版存主要舞覧」が意外に普及していることに気付いた大体90%以上はある。

地域にもよるだろうが,確かに今時古い舞覧使い続ける方が難しいかもしれない。個人機なら5年平均的な買い替え周期であり,スマートフォンなら古い部類だろう。自動更新標準的になった昔と違って多数派の“普通の人”ほど新しい舞覧使っている

あえて古い舞覧使い続ける場合というと,一昔前なら古い個人機再利用というのがあったが,格安インターネット端末普通に流通している今,新しい舞覧使えないほど古い端末使い続ける費用対効果疑わしく,制危考えれば推奨出来ることではない

一番面倒なのが舞覧の更新許されない企業内利用だが,そもそもそんな保守的な環境デライト利用出来るとは考えにくい

こう考えていくと,デライトにとって古い舞覧への対応重要性極めて低い言わざるをえない

奇しくも新生デライトの完成目指している6月15日に,IE11 のサポート終了がある。中途半端気もする内容だが,いわゆるモダンではない舞覧最後の砦崩壊する新しいウェブ標準への社会的移行象徴的な出来事にはなる。


ある程度古い舞覧への対応考慮してきたのは,企業体力がついた将来対応拡充することを考えていたからだったが,これもよく考えると合理性怪しい

技術的負債”は簡単に返せるものではない。大企業肥大化した交度にいかに苦しめられているかを考えれば合理的に古い舞覧への対応出来る来るかどうかも分からないむしろ組織大きくなった時にこそ見通しの良さ重要になる


もっと根本的なこと言えばデライトウェブ標準という盤本の“キラーアプリ”になるべきものだ。新しいウェブ標準普及牽引していくくらいの考えがなくてはいけない。

その伝証デモ足掛かりがすでにこれだけ普及していれば十分過ぎるだろう。


舞覧五年対応原則導入によって,ウェブの理想と現実における汚い現実大部分だった古い舞覧正しく切り捨てることが出来るようになり,前縁整備はもちろん,デライト文書整備でも大きな効率化もたらされるだろう。文書整備では,対応舞覧についてどう説明していくかが一つの課題だった。ここまで絞り込めば説明すっきりする

デライト開発劇的に合理化した描出公開原則とともに「デライト二大原則」と呼ぶべきかもしれない。思えば描出公開原則デライト正式離立という大きな節目目前にして生み出したものだった。


=}
{踏み切れた}{`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() を使って中央丸みのある陰影試したが,交度部区などに重なった時に視認出来なくなるためやめた

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

{デラング}{副日記}{今の}{十分高い}{損はしない}{どう転んでも}{顕著に}{パンくず記法実装}{大きな狙い}{月別}...=}(132)

{希哲16年3月5日の日記 K#F85E/A-E74C-6986}

一昨日から始めていた輪郭整備目下課題だったまとめ作業統合し,「大輪郭整備」として継続することにした。この上旬中に,昨年から引きずっている全てのまとめ作業片付けることを目指す

この期間開発作業必要性時間対効果十分高い部分限って行うことにした。大輪郭整備没頭するため,すぐ片付けられるこまごまとした問題明日まとめて片付けることにした。


昨日いったんまとめ作業集中することにしたが,この時点では前次記法実装をした先月24日からのまとめ作業想定していた

しかし,一昨日輪郭整備手応え思いのほかく,昨日止まらなかったこの勢いで,昨年から引きずっているまとめ作業片付くのではないか,と考え始めたのが昨晩就寝直前だった。

数週間ならともかく,数ヶ月範囲になると局所的なまとめ作業」では埒が明かない。その上,連日新たな収穫がある。というわけで24日以前のまとめ作業諦めかけていたが,輪郭整備という形で外堀を埋めるようにまとめていくのが意外と近道かもしれないと思えた

最近出来たパンくず記法前次記法効用がやはり大きい主たる上位階層パンくず記法で,下位階層強調輪符交えつつ箇条書き記法で,前次関係前次記法で,と基本的な輪郭間関係書き込みやすくなり,これまでになっていた無数の輪郭描写急速に充実してきている

一昨日からは関連の輪郭整備本格化し,これがまとめ作業効率化繋がりうることに気付いたこれまで日記にせよ副日記にせよ,年別月別には整理されていなかったずっとやりたいとは思っていたものの,時間対効果疑問があった。当然書き込む手間多少増すが,今のデラングなら閲覧性操作性改善がそれよりずっと大きい終わらないまとめ作業十分に成熟したデラングやるなら最良の時期だろう。

当然現状課題当努整理にも,献典整備にもなるが,もう一つの大きな狙いとして SEO がある。パンくず記法実装をした1月14日頃から顕著に検索演心からの評価上がり,検索流入増えているどう転んでも損はしない作業になるだろう。


6日振り返り日記

=}
{希哲館事業}{デラング}{進捗記録}{希哲16年2月22日}{希哲16年2月22日の開発}{希哲16年2月22日の進捗}{担わせる}{`4ja`}{有名無実化}{意識しない}...=}(159)

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

進捗時限記録中略

kitetu.comサブドメイン設計についての検討終了

今後デラングのように独立して参照出来るべき献典には積極的にサブドメイン与えていくことにした(例:dlng.kitetu.com


デラング的転回同時にデラング文書dlng.kitetu.com与えることを決めたが,これを機に知番SLFS 等々の公式文書にもサブドメイン与えることを考え始めた

これまでサブドメイン追加には消極的で,例えば技術系献典tech.kitetu.com集約することを考えていた。ただ,この手の URL 設計は,運営者にとっても閲覧者にとっても直感的でなく情報過多になりやすい上,階層的な整理難しいことも多々あり,変更に弱く参照可能性の低い URL が出来がちであるという問題があった。

こういう場合対策として,経験上最短原則」が最善であることは分かっていて,最近駒手にせよ各種識別子にせよ知名最短知名原則にせよ最短化する流れにある。サブドメインについてもこれに従うことにした。希哲館事業要素全て kitetu.com階層下にある,ということだけは確かだ。もちろん,これとは別に,階層的な情報源もあった方がいいので,そこは tech.kitetu.com などに担わせる

献典ドメインとしての独立性統一感同時に持たせられるのだから,むしろ,ここからがドメイン名統一本領発揮になりそうだ。

2文字サブドメイン問題解決

サブドメイン活用していく上で,一つ,「2文字サブドメイン問題」とでもいうべき問題があった

例えば,サブドメイン与えるなら cu.kitetu.com とするのが自然だが,CUキューバ国家符号だ。

ドメイン名統一によって ccTLD使わなくなっているため,将来的に地域別ドメイン欲しくなった時にはサブドメイン使うことになる。2文字サブドメイン使用避けるべきかもしれない,と考えていたキット*メーネmn.kitetu.comモンゴルMN被っているのが少し気になってはいた

ただ,その懸念も「もやもや」の域を出ていなかった明らかに紛らわしいサブドメイン最初から使わないので,被るとしたら普段意識しないようなものだ。被ったとして,ドメインハックccTLD有名無実化している今,そこまで神経質になることでもないだろう。そんなことのために,わざわざ不自然な表現もしたくない。とはいえ,サブドメイン選択肢多い越したことはない

そこで,国家符号表す何らかの接子導入考えたFacebook のように,ja-jp言語符号付きを基本として,言語符号がいらない場合は x-jp のように表記出来るようにするかとも考えたが,少し野暮ったい

最終的に4 接頭子導入する方向検討進めることにした。例えば,キューバ向けのドメイン4cu.kitetu.com として cu.kitetu.com区別出来るようにする。衝突しなければ 4 接頭子省略してもいいし,4ja のように言語符号に代えられてもいいだろう。4ja-jp のような表現が出来てもいい。これなら十分な簡潔性柔軟性兼ねられる

例えば 4jp.kitetu.com なら www.kitetu.com変わらない標準的な長さだし,むしろお洒落感すらあるので,これで統一して,4 接頭子無しは転送用にしてもいいくらいかもしれない。

いまのところ地域別ドメイン必要は感じておらず,将来的に必要になるかもしれない,という程度の問題なので,細かいこと追い追い決めるとりあえず理論上すっきりしたので良かった

=}
{進捗記録}{希哲16年2月21日}{希哲16年2月21日の開発}{希哲16年2月21日の進捗}{振り分けられる}{第1階層見出し}{10種}{線種}{希哲16年2月15日24歩}{希哲16年2月21日の進捗時限}...=}(64)

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

進捗時限記録中略

昨日15日24歩についてまとめながら区切り線記法線種見出し階層関係について整理する必要感じたため軽くまとめて終了

下線形見出し階層区切り線用いる線種二本線一本線破線点線4種としていたが,それに対し,9日17歩考えた10種多過ぎる。どれが使えてどれが使えないのか,用者混乱させる懸念がある。

4種絞り込んでしまうことも考えたが,atx 式見出しとの互換性はともかく,10種極めて整合的なものではあり捨て難い

ここで,二本線一本線破線点線出放りとしつつ,他の線種でも代替出来るようにすることを考え始めた。つまり,10線種4階層振り分けてしまえばいい。以下のように,意外と綺麗に振り分けられる

<!-- 第1階層 -->

=====
+++++
*****

<!-- 第2階層 -->

-----
= = =
+ + +

<!-- 第3階層 -->

- - -
: : :
* * *

<!-- 第4階層 -->

. . .

これに装体指定機能持たせてもいいだろう。元々第1階層見出し下線太い一本線だったので,代替しても大きな違和感はない。各見出し階層相応しいように装体はいくらでも調整出来る。

=}
{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> にすることを考え始めた

{『希哲日記』}{分かる}{取れていない}{被りそう}{第一次黄金循環}{違いない}{望んでいる}{見てから}{希哲16年2月8日}{希哲16年2月6日}...=}(64)

{希哲16年2月8日の日記 K#F85E/A-E74C-3D0A}

{進捗記録}{パンくず記法}{脚注記法}{デラング記法}{希哲16年1月11日の開発}{1階層}{紛らわしくなる}{決めかけていた}{階層関係}{輪郭間}...=}(37)

{希哲16年1月11日10歩 K#F85E/A-E74C-0F92}

パンくず記法についての検討終了

もともと輪郭間階層関係明示するために考え始めたパンくず記法だったが,用者の描出から,必ずしも輪符こだわる必要はないことに気付いた汎用的に使えた方がわざわざデラング記法として導入する意義増す

また,^ a > b > c形式決めかけていたものの,^ a のように1階層しかない場合検討中脚注記法などと紛らわしくなる可能性があることに気付いた実験段階では ^^ a > b > c のようにしておくべきか。もう少し他の記法との調整必要になりそうだ。

{考え始めた}

{}