ニュース

MicrosoftがPWAのウィンドウタイトルを柔軟に設定できる新しいHTMLメタタグを導入

「Microsoft Edge 134」および「Chrome 134」ベースブラウザーで利用可能

公式ブログ「Microsoft Edge Blog」におけるアナウンス

 米Microsoftは2月5日(現地時間)、新しいメタタグ「application-title」を発表した。「Microsoft Edge 134」および「Chrome 134」ベースの他のWebブラウザーで利用できる。

<meta name='application-title' content='My personal list'>

 このメタタグは、「プログレッシブ Web アプリ」(PWA)としてインストールされたアプリケーションのタイトルバーコンテンツを管理するためのもの。編集アプリのなかには、タイトルバーの内容をドキュメントに応じて「ファイル名 - アプリ名」などとわかりやすく変更してユーザービリティを向上させるものがあるが、Webベースのアプリでも同じことが簡単に実装できる。

 似たような役割としては、すでにHTMLの「title」要素がある。Webブラウザーのタブとして表示する場合、動作は同じだ。

<title>My personal list</title>

 しかし、PWAとしてインストールされた場合は事情が異なる。コンテンツは独自のウィンドウで表示され、そのタイトルバーの内容は、たとえばWindows環境の場合、マニフェストファイルから取得したアプリ名にダッシュ記号を付け、その後にHTMLの「title」要素の内容をつけ足したものになる。そのため、開発者の意図した通りのウィンドウタイトルとなる保証はない。

プラットフォーム(OS)に応じて付けられるウィンドウタイトル(上)。かならずしも開発者の意図した通りではないので、手軽に管理できるようにしたい(下)

 「Window Controls Overlay API」を用いてタイトルバー全体を非表示にし、独自のカスタムタイトルバーを作成する方法もあるが、ウィンドウタイトルのためだけにそれを実装するのは少し大仰だ。

 本来、ブラウザタブとPWAウィンドウのタイトルバーは異なる目的を持つUIといえる。PWAのウィンドウタイトルを制御したいだけであれば、今回新設されたメタタグを利用するのがスマートな解決方法になるだろう。