Deep Insider の Tutor コーナー
>>  Deep Insider は本サイトからスピンオフした姉妹サイトです。よろしく! 
Windows 10 Anniversary Updateの新機能

Windows 10 Anniversary Updateの新機能

Microsoft Edgeの進化 ~Windows標準ブラウザーの最新機能と使い方

2016年8月2日

Windows 10 Anniversary Updateで、ようやく日常使用に耐えられる機能性と安定性が備わってきたEdge。その最新機能をパワーユーザー向けに概説する。

尾崎 義尚
  • このエントリーをはてなブックマークに追加

 2016年8月2日、Windows 10の2回目の大きなアップデートであるWindows 10 Anniversary Update提供が始まった。Windows 10がリリースされてからこれまでのMicrosoft Edge(以下Edge)の進化と、今回のアップデートでEdgeがどう変わったのかを解説していく。

これまでの振り返り

 2013年9月、Internet Explorer 11(以下IE)がリリースされた時に紹介したが、マイクロソフトは過去の遺産を精算して自社のWebブラウザーをモダンブラウザーに生まれ変わらせる方法を探っていた。マイクロソフトは互換性を非常に重視する会社なので、モダンブラウザーへの変革を本気で考えていると評価はしたものの、筆者はこの時、IEはそのまま塩漬けにして、互換性を考えずに済む新しいブラウザーを作ってしまえばいいのにと考えていた。

 2015年7月、Windows 10がリリースされ、標準ブラウザーとしてEdgeが提供されて、それが現実のものになった。だがEdgeのプレビューバージョン(当時は“Project Spartan”と呼ばれていた)が公開された時、「これじゃない」と思ったものだ。Webページにコメントを書いて共有できたり、(リリース当初、日本では利用できなかったが)Cortanaと統合されていたりとユニークな機能は持っていたが、突然プロセスごと落ちたり、表示中にページがリロードされたりと不安定な面が目立っていたし、ドラッグ&ドロップがサポートされていなかったり、拡張機能やタブのピン留めなど他のブラウザーでは普通に提供されている機能が提供されていなかったりと、本当の意味での「ブラウザー」以上の機能が提供されていなかった。今でこそXbox OneHoloLensといったさまざまなプラットフォームで利用できるUniversal Windows Platform(以下UWP)アプリだが、当時はWindows 10 Mobileとの共通化しかされていなかったため、なぜ使いにくいUWPアプリで提供されたのか疑問を感じていた。

 2015年11月に、いわゆるNovember UpdateもしくはThreshold 2TH2)や1511と呼ばれる大型アップデートがあったが、この状況が大きく改善されることはなかった。

 その後、Windows Insider Program(以下WIP)で徐々に機能を追加してきた。

 そして今日、Anniversary UpdateもしくはRedstone1RS1)や1607と呼ばれる今回のアップデートにおいて、WIPに参加していないユーザーにもようやく日常使いに耐えられるEdgeになったと考えている。本稿では、今回のアップデートが利用者にとってどう使えるようになったのかを解説していく。

戻る、進むボタンの履歴表示

 Edgeのイケてなかった点の1つが、[戻る]ボタンや[進む]ボタンに履歴が表示されなかったため、いくつか前のページに戻るには、戻るボタンをそのページ数分クリックしなくてはならなかったことだ。今回のアップデートでは、[戻る]ボタンか[進む]ボタンを右クリックすると履歴が表示されるようになり(図1)、戻りたいページまで即座に戻れるようになった。

図1 [戻る]ボタンか[進む]ボタンを右クリックすると表示履歴が表示される

 履歴が一覧表示されるため、タイトルから戻りたいページをクリックして1回で履歴のページに移動できるようになった。IEにもあった地味な機能ながらうれしい機能が帰ってきた。

タブのピン留め

 ChromeやFirefoxではすでに実装されているが、日常使いのブラウザーでは頻繁に使うサイトを固定的に(=起動時に毎回)表示したい。今回のアップデートでようやく固定タブとしてピン留めができるようになった。

タブを右クリックすると[ピン留めする]メニューが表示される

タブを右クリックすると[ピン留めする]メニューが表示される

ピン留めすると常に表示されるタブとなり、次回起動時にも自動的に読み込まれる

ピン留めすると常に表示されるタブとなり、次回起動時にも自動的に読み込まれる

図2 タブのピン留め

貼り付けて移動、貼り付けて検索

 今回のバージョンアップで地味ながらうれしいのが、アドレスバーにペーストした後、Enterキーを押さなくても移動できる機能だ。URLをクリップボードにコピーした後でアドレスバーを右クリックすると[貼り付けて移動]というメニューが表示される(図3)。これをクリックすれば、以前のようにURLを貼り付けた後でEnterキーを押さなくても移動できる。

図3 クリップボードにURLが登録されていると[貼り付けて移動]メニューが表示されて、Enterキーを押さなくても移動できる

 クリップボードにコピーしたのが、URLではなく文字列の場合は、[貼り付けて検索]メニューが表示される(図4)。これをクリックすれば、デフォルトに設定されている検索エンジンで、貼り付けた文字列を検索できる。

図4 クリップボードに文字列が登録されていると[貼り付けて検索]メニューが表示されて、<kbd>Enter</kbd>キーを押さなくても検索できる
図4 クリップボードに文字列が登録されていると[貼り付けて検索]メニューが表示されて、Enterキーを押さなくても検索できる

拡張機能

 Edgeのリリース当初から最も要望の多かったのが拡張機能のサポートであった。

 FirefoxやChromeのブラウザー拡張は、HTMLやJavaScriptといったWeb開発者にとって使い慣れた技術を使って比較的簡単に開発できたため、非常に多くの拡張機能が開発されてきた。

 一方、IEのブラウザー拡張は、Windowsのネイティブコードで書く必要があり、アーキテクチャが古く開発が難しかったため、開発者であっても気軽にブラウザー拡張を開発できず、他のいわゆるモダンブラウザーから水をあけられていた。

 Edgeのブラウザー拡張については、リリース当初からChromeと同様の拡張機能が使えるとウワサされてきたがなかなか提供されず、初期リリースから1年たった今回のアップデートで正式なリリースとなった。この拡張機能はW3CのBrowser Extension Community Groupとして標準化が進められており、Chromeのブラウザー拡張APIとも似ているため、今回のアップデート後にChrome拡張の移植が進むものと思われる。

 まだまだ数は少ないもののEvernote Web Clipperをはじめとするサードパーティの拡張も増えつつある。代表的なものは拡張機能ページ(英語)で紹介されているが(図5)、今後はストアにどんどん追加されていくはずである。ストアに公開される拡張機能はきちんと審査が通っているため、危険なコードが入り込む可能性は非常に低いといえる。

図5 拡張機能の紹介ページ

主な拡張機能が紹介されている。

 このページの[Open in Store]ボタンをクリックすると、ストアが開いて、拡張機能をインストールできる。

 拡張機能をインストールするのであれば、Edgeの右上にある[・・・]メニューからアクセスする方が自然で簡単だ。[・・・]メニューの中に[拡張機能]が追加されているので、ここから追加・管理できる。実際に追加して管理する手順は、以下の画面を参考にしてほしい。

[・・・]ボタンをクリックして、メニューから[拡張機能]をクリック

[・・・]ボタンをクリックして、メニューから[拡張機能]をクリック

[拡張機能]ペインに切り替わるので[ストアから拡張機能を取得する]リンクをクリック

[拡張機能]ペインに切り替わるので[ストアから拡張機能を取得する]リンクをクリック

ストアが開いて、拡張機能の一覧が表示される。インストールしたい拡張機能のアイコンをクリック

ストアが開いて、拡張機能の一覧が表示される。インストールしたい拡張機能のアイコンをクリック

すると拡張機能の詳細ページが表示される。[インストール]ボタンをクリック

すると拡張機能の詳細ページが表示される。[インストール]ボタンをクリック

インストールが開始され、[起動]ボタンが表示されるのでクリックする

インストールが開始され、[起動]ボタンが表示されるのでクリックする

Edgeのウィンドウがアクティブになって[新しい拡張機能があります]と表示されるので、[有効にする]ボタンをクリックして拡張機能を有効にする

Edgeのウィンドウがアクティブになって[新しい拡張機能があります]と表示されるので、[有効にする]ボタンをクリックして拡張機能を有効にする

[拡張機能]ペインに有効にした拡張機能が表示される。拡張機能名をクリックする

[拡張機能]ペインに有効にした拡張機能が表示される。拡張機能名をクリックする

これにより詳細情報が表示される

これにより詳細情報が表示される
・[アドレスバーの横にボタンを表示する]をオンにすると、ツールバーにアイコンが並ぶので、すぐにアクセスしたい機能はオンにするとよい
・[オプション]ボタンをクリックすると、拡張機能の詳細設定が表示される
・[アンインストール]ボタンをクリックすると、拡張機能をアンインストールできる

図6 Edgeで拡張機能を追加・管理する手順

 このようにEdgeの[拡張機能]ペインで拡張機能が管理できるようになっている。なお、Windows 10 MobileのEdgeはバッテリー消費量や表示領域の制限などの課題があるため、現時点では拡張機能が提供されていない。

WebM/VP9サポート

 WebM/VP9とは、グーグルが開発した動画配信フォーマット/動画圧縮コーデックである。4K動画などの高画質の動画配信のニーズが高まる中、ネットワーク帯域を圧迫しないように圧縮率の高い動画フォーマットが必要となっていることから登場したフォーマットである。

 HTML5では<video>タグがサポートされたため、どのブラウザーでも同じく動画が再生できると考えている方も多いと思う。実際には、コーデックやDRMのサポート状況がブラウザーごとにことなっており、どんな動画でも再生できるわけではない。EdgeがWebM/VP9をサポートしたことによりChromeだけでなくすでに対応済みのFirefoxやOperaとの相互互換性が高くなり、1つのフォーマットで全てのブラウザーに対応できる状況に前進したといえる。

Web通知

 デスクトップアプリの更新通知ではデスクトップ上にトースト表示するためのOS標準機能が長らく使われてきているが、Webアプリケーションにはこれと同様の標準的な仕組みが存在しなかった。そのため、(ブラウザーによりポップアップがデフォルトでブロックされるようになる前は)子ウィンドウを表示して通知したり、(それ以後では)ページ内に子ウィンドウを開いたりとさまざまな工夫がされてきた。

 今やスマホでもデスクトップ上でも通知は日常的に受け取るものになり、ブラウザーからの通知もWeb NotificationsとしてW3Cの標準化が進んでいて今回の実装に進んだ。現時点ではプレビュー実装となっており、Webページがアクティブになっていない時には通知を受けることができない。将来的にはページを表示していないときにもバックグラウンドから通知できるようになる予定だ。

 通知が有効なページを開くと「通知を許可するかどうか」を聞かれるので、許可する場合は[はい]を選択する(図7)。

図7 通知の許可メッセージ

Web通知が実装されているサイト(この例ではSlack)にアクセスすると通知の許可を求めるメッセージが表示される。

 通知を許可すると、そのサイトから通知が送られてくるようになる(図8の上)。その通知をクリックしなかった場合、(一定時間がたって消えた)その通知のメッセージはアクションセンターに残ることになる(図8の下)。

この通知をクリックしないままだと……

この通知をクリックしないままだと……

図8 通知メッセージ
図8 通知メッセージ

上: サイトから通知があるとトーストとして表示される。
下: トーストをクリックしなかった場合は、アクションセンターに通知内容が残る。

 一度設定した通知のオン/オフを切り替えるには、Edgeの[・・・]をクリックして表示されたメニューの中の[設定]をクリックする。[設定]ペインの中の[詳細設定を表示]ボタンをクリックして、[通知]欄にある[管理]ボタンをクリックすると通知が設定できる(図9)。

[詳細設定]にある[通知]欄の[管理]ボタンをクリック

[詳細設定]にある[通知]欄の[管理]ボタンをクリック

通知を許可したサイトが一覧表示されるので、通知を止めたければ「オフ」に設定すればよい

通知を許可したサイトが一覧表示されるので、通知を止めたければ「オフ」に設定すればよい

図9 通知のオン/オフを切り替える手順

Flash広告のブロック

 Flashは、動的でインタラクティブなコンテンツを提供し、一時期はほとんどのサイトで使われていたといってもよいほど使われていたが、消費電力の多さや読み込みの遅さが目立つようになってきており、HTML5へ移行する動きが進んでいる。

 Edgeはプラグインなしでリリースされたが、まだFlashが使われているサイトが多くあるという理由から、Flashサポートはプラグインではなくブラウザーに組み込む形でリリースされた。今回のアップデートでは、アニメーションや広告などの主要なコンテンツではないFlashを停止する。図10に示すように、停止されたFlash広告は再生ボタンをクリックするまで実行されない

図10 サイドに表示されているFlash広告は再生ボタンをクリックするまで実行されない

 これは、Edgeだけの流れではなく、Chromeは昨年の9月にFlash広告の停止を実施しており、今年の秋にはFlashを使っている主要なサイトを除いてデフォルトでFlashを無効にすると発表している。Safariも次期バージョンであるSafari 10からはFlashをデフォルトで無効にすると発表している。Firefoxも同様に2017年中にFlashを無効にすると発表している。Edgeは、Flashのデフォルト停止のスケジュールが公開されていないが、今後、Flashが停止されることは自然な流れだといえるため、Web開発者は早めの移行を検討してほしい。

グループポリシー

 EdgeはIEほど機能が豊富でないということもあり、グループポリシーで設定できる項目(図11を参照)はそれほど多くない。

図11 Edgeのグループポリシー構成項目

左側にあるツリービューを見てほしい。([Microsoft Edge]項目の上にある)[Internet Explorer]項目と比べると、[Internet Explorer]にだけ配下に多数のフォルダーが存在し、確かに設定可能な項目が少ないのが分かる。ちなみに、この[ローカル グループ ポリシー エディター]は、Windowsのコマンドプロンプトなどで「gpedit.msc」を実行すると表示できる。

 右側にあるリスト表示の内容を見ていこう。これまでのアップデートで利用可能になった構成は以下の通り。

初期バージョンから構成可能

  • オートフィルの構成
  • Cookieの構成
  • トラッキング拒否の構成
  • パスワードマネージャーの構成
  • ポップアップブロックの構成
  • アドレスバーの検索候補の構成
  • エンタープライズモードサイト一覧を構成する
  • SmartScreenフィルターの構成
  • すべてのイントラネットサイトをInternet Explorer 11に送る

TH2(1511)から構成可能

  • 開発者ツールの許可
  • InPrivateブラウズの許可
  • [新しいタブ]ページでのWebコンテンツの許可
  • お気に入りを構成する
  • ホームページの構成
  • ファイルに関するSmartScreenプロンプトのバイパス回避
  • サイトに関するSmartScreenプロンプトのバイパス回避
  • WebRTCでのLocalhost IPアドレス使用の回避

Anniversary Update(1607)から構成可能

  • Microsoft Edgeでabout:flagsページへのアクセスを禁止する
  • 拡張機能の許可
  • Internet Explorerでサイトを開くときのメッセージ表示

 今回のAnniversary Updateで利用可能になった構成の中の一番下についてもう少し分かりやすく説明しよう。社内システムにIE8などの古いバージョンのIEでないと正しく表示されないサイトが残っていることもあるだろう。Edgeの初期バージョンから「エンタープライズモードサイト一覧を構成する」というグループポリシーの構成で、このようなサイトを開いたときには、IEで開くかどうかを確認する図12のようなページが表示されていた。今回追加された「Internet Explorerでサイトを開くときのメッセージ表示」をデフォルトの「未構成」または「無効」に設定すると、IEを開く際のメッセージページ(図12)が表示されずにIEでページが表示されるようになり、これまでと違いよりシームレスに企業内システムを利用できるようになった。これまでと操作手順が変わることに抵抗があるなど、あえて、これまでと同じようにメッセージページを表示したい場合は、この構成を「有効」にすればよい。

図12 Edgeで開けないページを代わりにIEで開く際のメッセージをグループポリシーで有効にしたときに表示されるページ

 グループポリシーで設定できる項目はまだまだ少ないが、今後も徐々に機能が増えていくことになるだろう。

Macでテストするには

 Edgeが他のブラウザーと大きく違うのは、Windows 10でしか動作しないことだろう。多くのWeb開発者はMacを使っているため、テストをするためにWindows環境を用意しないといけないと考えている開発者も多いようだ。テストするだけであれば、マイクロソフトからEdgeがインストールされている仮想環境が無償(利用制限については後述)で提供されているのでそれを使えばよい。以下にVagrantを使う場合の手順を示す。

図13 MacでEdgeをテストするための手順(Vagrantを使う場合)

[Virtual machine]欄には、「最新の安定版のEdge」と「最新ではないが新しめのPreview版のEdge」だけでなく、「IE8」~「IE11」が各環境で提供されている。
[Select platform]欄には、VirtualBoxやVMware、Vagrantが選択できるため、普段使っているものを選択すればよい。ここではVagrantを選択する

★

ダウンロードしたZIPファイルを展開すると、dev-msedgeフォルダーが展開されるので、box.ovfファイルをダブルクリックすればVirtualBox(Vagrantが利用している)が開いて仮想環境をインポートできる。この手順は、仮想化プラットフォームによって違うため、各環境の手順に従って環境を作ってほしい

★

仮想環境を準備できたら、起動すれば仮想環境にWindows 10が起動するので、Edgeを起動してテストが可能になる

図13 MacでEdgeをテストするための手順(Vagrantを使う場合)

 仮想環境は90日間の評価版であること、さらにテスト目的でしか利用できないことにご注意いただきたい。なお、OSは英語版ではあるが、設定により日本語も問題なく表示できるので安心して使ってほしい。

最後に

 Edgeが徐々に進化していて、日常使いのブラウザーになろうとしているのが理解いただけただろうか。ようやく日常使いに耐え得るレベルに到達したEdgeを、ぜひ一度標準ブラウザーとして試してみてほしい。

Windows 10 Anniversary Updateの新機能
1. 【現在、表示中】≫ Microsoft Edgeの進化 ~Windows標準ブラウザーの最新機能と使い方

Windows 10 Anniversary Updateで、ようやく日常使用に耐えられる機能性と安定性が備わってきたEdge。その最新機能をパワーユーザー向けに概説する。

Windows 10 Anniversary Updateの新機能
2. Microsoft Edge: HTML5/JavaScript最新標準仕様への新応とF12開発者ツールの新機能

Windows 10 Anniversary Updateでアップデートされた最新Edgeの「JavaScript標準仕様への対応状況/オープンソース化/追加されたHTML5標準/F12開発ツールの新機能」をWeb開発者向けに概説する。

Windows 10 Anniversary Updateの新機能
3. Windows 10 Creators UpdateのJavaScript/CSS関連の新機能

Windows 10 Creators UpdateでEdgeはどのように進化したのか? CSS/JavaScriptに関する新機能や新搭載のAPIを、開発者目線で紹介する。

サイトからのお知らせ

Twitterでつぶやこう!