Notionの見出しの視認性の問題
ちえラジChat火曜日始まりました。今回はですね、プログラミングについてということで、拡張しやすいサイトしにくいサイトという話をしようと思います。
Notionを自分は使っていて、まあNotionね本当にいろんな情報を保存したりしているんですが、Notionのテキスト情報って、保存しようと思うと結構やりづらいってことはありませんかね。
具体的にはこの見出しのレベルっていうのが何なのかっていうのがパッと見わかりづらいっていう時があるんですよ。
Notionでは見出しのレベルは1から4までが使えるんですが、
ブラウザのウィンドウサイズとか様々な要件で見出しの文章の文字サイズが変わる設定になっているのか、
場合によってはね見出しのレベル、特に2と3がパッと見でどう見ても同じサイズに見えるっていう時があったりするんですよ。
なんか文脈の途中でいじってみて、え?これ見出し2だったの?え?これ見出し3だったの?っていうところが結構あったりして、
なんかその辺がすごい複雑で区別がつきづらい。
そうすると階層構造をつけてちゃんと文章を書きたいなって時に、これ今どれだけの見出しが書かれているのかっていうのがパッと見わかんなくなってくる。
特に自分はAIの出力とかを全部Notionに書き写してみるんですが、その時に見出しのレベルがどこがどこなのかってのがパッと見わかんなくなるってことが結構あるんですよ。
ブラウザ拡張機能開発の試みと直面した課題
ていうわけで、じゃあ拡張しちゃえばいいじゃん、ブラウザ拡張機能を作ればいいじゃんっていうことで、
まあNotionってウェブサイトとしても普通に表示できますからね、
ウェブブラウザでNotionを開いた時に、これこれこういうようなことができる拡張機能を作ってっていうのをAIにお願いして作ってみて、
まあ結構ね、とりあえず動いているっぽいってところまでは確認できたんですが、
なんか目的の動作が全然達成できない。
なんでだろうなと思って、出てきたコードをちゃんと見たところ、動いているように見えるし、実際デバッグしようとしてもちゃんと動いている。
でもなぜか実際には反映されてないってことで、なんでだろうっていうような状況に出くわすことがありました。
Reactフレームワークによる拡張の困難さ
で、なんでって聞いてみたところ、Microsoft Copilot曰く、これはReactっていうフレームワーク、
JavaScriptフレームワークの挙動のせいだっていう話なんですよね。
こちらでウェブページの要素を変更しようとしても、Reactが全部元に戻しちゃう。
正直そういうことをやられると、ブラウザ拡張で拡張しようがないなって思っちゃったりします。
幸い対処方法というか、代替案もCopilotに提示してもらったので、そこは非常に助かるなって思うんですが、
ウェブサイトの使われているフレームワークによってここまで挙動が変わっちゃったりするっていうのは、
目の当たりにすると困りますねって正直思いました。
こういうリッチなフレームワークっていうのもなかなか困ったもので、
いわゆるウェブアプリって言われるようなものとか、リッチなウェブサイトを作るってなると、
JavaScriptのフレームワークを使うっていうのはもはや基本中の基本、もはや当然って言われているところもあるとは思います。
特にこういうようなNotionみたいなアプリケーション的に動くものになると、
多分JavaScriptフレームワーク使わなきゃきついでしょうになってくるんだろうと思います。
ユーザーによるサイト改変とフレームワークのバランス
ただブラウザで見るサイトである以上、ある程度ユーザーが上手い感じにいじるっていうのも、
ちょっと想定してほしいなあなんていうふうに思ったりはしますね。
だから今回みたいにこういうようなウェブサイトが、
こちらでノードをいじろうとするとすぐに元に戻されてしまうっていうね、
セキュリティ的な面を言えばそれが正しいのかもしれませんが、
ローカルでとどまる範囲でいじるんであれば何か許容してくれよっていうような気もちょっとしてしまいます。
まあなんかこの辺をうまくバランスとってほしいなっていうふうに、
ウェブアプリの方にはちょっと思ったりするところだったりはしますかね。
まとめと今後の展望
というところで今回の学びとしては本当にね、
ウェブフレームワークを使われているサイトを拡張したいなって思った時には、
細心の注意を払いましょうというところでしょうか。
というところで今日の話はこれくらいで終わりにしていきたいと思います。
明日は水曜日、まちのえんがわキャストについてお話ができればと思います。
ではでは。
