#46「ブラウザ戦国時代はくるか」

加藤 : 皆さん、こんにちは！ ミツエーリンクスの加藤です！

佐竹 : 佐竹です！

加藤 : はい、えー今回もミツエーテックラジオをやっていきたいと思います。ミツエーテックラジオは、株式会社ミツエーリンクスのスタッフが、Webデザイン、 Webフロントエンドなどの、Web技術に関するニュースやツールをシェアするポッドキャストです。えー今日のテーマはWebブラウザということで、いつもはHTMLとかCSSとかJavaScriptとか、まぁフロントエンドの技術を中心に話しているんですけども、今日はブラウザ自体のUIの変化とか、最近のブラウザはこういう特徴があるよみたいな話をしていきたいなと思っています！

佐竹 : ブラウザは日本だとChrome、Safari、Edge、Firefoxあたりがシェア率高いと思いますけど、それ以外にもかなり種類がありますよね。

加藤 : そうですね。

佐竹 : 加藤さんがメインで使っているのはFirefoxですよね？

加藤 : はい、そうです。

佐竹 : それは何か理由があるんですか？

加藤 : まぁーあの正直言ってしまうとそんなにこだわりがあるわけではないんですけど、一番大きな理由はMDNにお世話になってるからとかですかね。

佐竹 : なるほど。私はFirefoxはちょっとしたテキスト修正のチェックの時によく使いますね。えーとテキストの大文字小文字だったり半角全角の違いを完全一致で検索できるのがいいんですよ。あと開発者ツールのアクセシビリティパネルにあるタブ移動順序の表示とかコントラストチェックもよく使ったりします。

加藤 : へーちょっとそれは知らなかったですね笑 あと他によく言われているFirefoxの特徴的な機能としてはトラッキング拒否機能っていうのがデフォルトで備わっていて、まぁ私個人としてはそのブラウジング中に広告をクリックすることってあんまりないので、常に拒否する設定にしてますね。で、プライバシー保護ダッシュボードという機能もあって、1週間でどのくらいのトラッカーをブロックしたのかとかも確認できます。

佐竹 : あのプライバシー保護ダッシュボードってアドレスバーのところの盾のアイコンをクリックして表示されるメニューから移動できましたよね。ちなみに、加藤さんはどのぐらいブロックされてました？

加藤 : えーと先週1週間だと2000個近くブロックされてましたね。

佐竹 : えー私200くらいでした。Firefoxではあまりブロック機能が働きやすい広告があるようなサイトにはアクセスしていないつもりだったんで200でもびっくりだったんですけど、メインブラウザで使用していると10倍にもなるんですね…！

加藤 : うーん、そうですねーまぁもちろんあの訪問するサイトに依るとは思うんですけど。あのーFirefoxを使うまではあまり気にしてなかったんですけど、やっぱり数字出されるとびっくりしますよね。とはいえ、このトラッキング拒否みたいなプライバシーを重視した機能をデフォルトで搭載しているブラウザっていうのは、Firefoxの他にも結構出てきているので、ブラウザベンダーとしては他のブラウザとどう差別化するのかが難しい時代になってきてるんじゃないかなーとは感じます。

佐竹 : 確かにそうですね。

加藤 : はい。佐竹さんはVivaldiユーザーでしたっけ？

佐竹 : そうです！私はまぁ作業ごとにブラウザを使い分けているんですけど、Vivaldiは結構使いますね。

加藤 : あのー先日当社の木達さんがVivaldiブラウザの創業者であるテッツナーさんと対談した記事が公開されてたんですけども、読みました？？

佐竹 : 読みましたー！面白かったですよね。

加藤 : いやーそうですね。結構つっこんだ話もされていたので、テックラジオを聞いていただいている皆さんにもぜひ読んでいただきたいなと思いますね。ちなみに、佐竹さん的にVivaldiの推しポイントはどのあたりですか？

佐竹 : えーVivaldiの推しポイントはありすぎてこの時間だけでは語りきれないんですけど、いち推しと言ったらウェブパネル機能ですかね。あのChatGPTとかCan I useとか、よく使うWebアプリを設定しておくと、Webページをブラウジングしてるときでも、それを横に並べて表示しておけるので調べものをする時に便利なんですよ。

加藤 : うん、ウェブパネルいいですよね。あのーちなみにMicrosoft Edgeだとサイドバーって呼ばれていますけど、新しいチャット形式のBingがサイドバーから使えるようになったりとか、あのーサイドバーのなかでPWAを構築することができたりするみたいですね。

佐竹 : そうですね。あとChromeでも拡張機能からサイドパネルにコンテンツを表示するためのAPIっていうのを発表してましたね。

加藤 : そうですね。あのーいわゆるマルチタスクというか、コンテンツを見ながら何かツールを一緒に使いたいというのが世の中のニーズとしてあるっていうことなんですかね。

佐竹 : そうかもしれないですね。サイドパネルがまぁ最近のブラウザのUIとしてトレンドなのは間違いないかなと思います。

加藤 : はい。Vivaldiの話に戻りますけど、他に特徴的なポイントってありますか？

佐竹 : えーそうですね。Vivaldiのトップページをみると「パワフル。パーソナル。プライベート。」というキャッチコピーが書かれているんですけど、やっぱりユーザーがカスタマイズできる部分がとても多いのがポイントですかね。

加藤 : あー例えばどの辺がカスタマイズできるんですか？

佐竹 : 1つ挙げるとするとページアクションですね。開いているWebページの外観にフィルターをかけれる機能なんです。

加藤 : フィルターっていうのはなんでしょう、例えば色味を変えたりとかそういうことですかね？

佐竹 : そうですね。でも色だけではなくって、ページアクションの選択項目に「CSSデバッガー」というのがあるんですけど、これを選択するとすべての要素にoutlineがつくのでコンテンツからはみ出している要素を見つけやすくしてくれますし、あと私的に１番嬉しいのは「遷移効果を強制する」という項目と「遷移効果を適用しない」という項目ですね。

加藤 : 遷移効果っていうのはあれですかね、CSSのanimationとかtransitionとかを指してますかね？

佐竹 : そうです。あのアニメーションってずっと見ていると酔ってしまったり、文字にアニメーションがついていると見失って読みにくい時があるので基本的にOSのアニメーションは切っていることが多いんですね。なので、制作したものの動きを確認するときにOSのアニメーションの設定をブラウザでこうさっと上書きできるっていうのは助かりますね。

加藤 : あーそれは確かに便利ですね。なんかVivaldiはそういうカスタマイズ用のユーザーインターフェースが全体的に分かりやすく作られているなぁという印象はやっぱりありますね。他のブラウザだとそういうカスタマイズ機能はどっちかというとサブ機能というか、あまり目立たないところにUIが置いてあったりしますよね。

佐竹 : そうですよね。Vivaldiは他にもまぁ特徴はあるんですけどVivaldiのページに「#Vivaldiを使うワケ」という連載記事があるのでそれが結構参考になると思います。

加藤 : へーありがとうございます！読んでみたいと思います！

加藤 :　他にも特徴的なブラウザがあるので、いくつかご紹介していこうかと思いますが、VivaldiのWebパネルのようなエリアを標準機能として備えているブラウザとしてはSidekickとかですかね。

佐竹 : あーSidekickよく聞きますねー。でもまだ使ったことなかったです。

加藤 : はい、Sidekickはいろいろなアプリケーションを統合して、切り替えのストレスをなくして集中力を高めることがコアコンセプトになっていて、公式サイトでもオンラインワーカー向けに作っていると明言してますね。

佐竹 : ふーん…ターゲットをオンラインワーカーに絞っているのは面白いですね。

加藤 : そうですね。例えば初期設定でSlackとかGmailとかNotionみたいなオンラインワーカーがよく使うようなアプリがサイドバーに搭載されていたりするので、確かに便利だなと思いますね。しかもブラウザ自体に有料プランがあって、まぁ無料でも十分使えるんですけど、有料プランにするともっと便利になったりしますね。

佐竹 : あー有料のブラウザというのは珍しいですね！大抵のブラウザが無料で提供されていますし、課金する人がどれくらいいるのかが気になりますね。

加藤 : そうですね。ターゲットがオンラインワーカーっていうのもあって、業務効率化ツールとして便利だなーと思った人が有料プランで使うというのは十分あり得るのかなぁと思います。

佐竹 : なるほど。そうするとただのWebブラウザというわけではなくって、いろいろなアプリを統合したアプリケーションの中にブラウザの機能が含まれているという考え方が近いんですかね。

加藤 : うん、そうかもしれないですね。佐竹さんが気になっているブラウザはありますか？

佐竹 : そうですね。あの木達さんとテッツナーさんの対談記事にもリンクが張られていたんですけど、The Browser Companyという会社が作ってるArcというブラウザが最近気になっています。

加藤 : その「The Browser Company」ってめちゃくちゃ分かりやすい社名ですよね笑

佐竹 : そうですよね。そのArcに最近「Boosts」っていう、Webページの見た目をユーザーが自由にカスタマイズできる機能が追加されたんですよ。

加藤 : いわゆるユーザースタイルシートみたいな機能だと思うんですけど、CSSを知らないユーザーでもWebページ上の要素を非表示にしたりとか、フォントを変えたりとか、色を変えたりできるようにGUIを用意しているって感じですよね。

佐竹 : そうですね。変更したスタイルはBoost Galleryで他の人に共有することができますし、逆にたとえばあのーGmailだったりTwitterなんかを他の人だったらどんな感じでカスタマイズしているのかなーっていうのが見れたりします。

加藤 : あ、それ面白いですね！あのーWebサイトの見た目はWebサイト側が決めるのが当たり前と思ってたんですけど、ユーザーが好きなように見た目をカスタマイズできるっていうのは確かに新鮮だし、何か新しいユーザー体験を生み出しそうな予感がしますね。

あとは、ちょっと毛色が違いますけど、Igaliaが開発しているWolvicとかも特徴的ですね。

佐竹 : あーWolvicはFirefox Realityの後継のブラウザですよね。

加藤 : そうですそうです。あのーVRデバイスとかARデバイスなどのXR向けに構築されているっていうところが最大の特徴ですね。

佐竹 : うーん、VRデバイスでブラウザは使ったことがなかったので、ちょっとイメージするのが難しいですね。

加藤 : うん、そうですよね。あのーWolvicのサイトにはハンドトラッキングに関するページとかもあるんですけど、やっぱり普段私たちがスマートフォンとかパソコンで使っているブラウザとは操作の仕方が大きく違うので面白いなーと思って見てます。

佐竹 : AppleのVision Proも発表されましたけど、Vision Proは確か手だけではなくって視線も組み合わせて操作する感じでしたよね。

加藤 :　はい、その通りですね。あのーWolvicではアイトラッキングはまだサポートしていないようなんですけど、ロードマップをみると2023年のQ4のところに「Initial eye tracking support」って書いてあるので、ハンドトラッキングだけではなくて、アイトラッキングも今後サポートする予定はあるみたいですね。

佐竹 : それは楽しみですねー。IgaliaはWebKitの開発も積極的に参加されているので、Vision Pro向けのサポートの方も期待したいですね。

加藤 : はい、そうですね！

加藤 : はい、他にもいろいろブラウザはあるんですけども、今日はこの辺にしておこうかと思います。開発者視点だと、ブラウザというよりはどちらかというとレンダリングエンジンとかに影響されることが多いかもしれないですけど、ユーザー視点で改めてブラウザについて考えてみるとやっぱり面白いですね。

佐竹 : そうですね。ブラウザの主要な機能はChromiumに任せて、その他のUIとかセキュリティ面とか、AIなんかで特色を出すブラウザが増えてきていて、まさにブラウザ戦国時代といった感じですね。ブラウザを作業や環境に合わせて使い分けるのも楽しいですし、いろいろ試して自分にあうブラウザを探したいですね。

加藤 : はい。とてもいい感じにまとめていただいてありがとうございます！では最後に、ミツエーリンクスではスマートなコミュニケーションをデザインしたいUIデザイナー、UI開発者を募集しています。採用サイトではオンライン説明会やオンライン面接なども行っていますのでチェックしてみてください。

また、このPodcastはApple Podcast、Google Podcast、Amazon Music、Spotify、YouTubeで配信していますので、お好みのプラットフォームでフォローいただけると、最新のエピソードをすぐ視聴できます！こちらもぜひご活用ください。 「#ミツエーテックラジオ」でご意見、ご感想、こんなこと話してほしいというリクエストなどもお待ちしております。それでは今日はこの辺で！ありがとうございましたー！

佐竹 : ありがとうございました！