<?xml version="1.0" encoding="UTF-8"?><rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	xmlns:series="http://organizeseries.com/"
	>

<channel>
	<title>Windows 10 &#8211; HTML5Experts.jp</title>
	<atom:link href="/tag/windows-10/feed/" rel="self" type="application/rss+xml" />
	<link>https://html5experts.jp</link>
	<description>日本に、もっとエキスパートを。</description>
	<lastBuildDate>Sat, 07 Jul 2018 03:14:05 +0000</lastBuildDate>
	<language>ja</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>https://wordpress.org/?v=4.7.19</generator>
	<item>
		<title>Windows 10 Fall Creators Updateに搭載されるMicrosoft Edgeの新機能</title>
		<link>/osamum_ms/24472/</link>
		<comments>/osamum_ms/24472/#respond</comments>
		<pubDate>Fri, 20 Oct 2017 05:22:22 +0000</pubDate>
		<dc:creator><![CDATA[物江 修]]></dc:creator>
				<category><![CDATA[最新動向]]></category>
		<category><![CDATA[Edge]]></category>
		<category><![CDATA[Windows 10]]></category>

		<guid isPermaLink="false">/?p=24472</guid>
		<description><![CDATA[10月17日 (日本では18日)より、Windows 10 Fall Creators Updateが公開されました。今回のアップデートではWindows Mixed Realityに準拠する MRデバイスのサポートやゲ...]]></description>
				<content:encoded><![CDATA[<p><font size="3">10月17日 (日本では18日)より、<a title="Windows 10 Fall Creators Update" href="https://www.microsoft.com/ja-jp/windows/features" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer">Windows 10 Fall Creators Update</a>が公開されました。今回のアップデートでは<a title="Windows Mixed Reality" href="https://developer.microsoft.com/ja-jp/windows/mixed-reality" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer">Windows Mixed Reality</a>に準拠する <a title="Windows Mixed Reality Headsets" href="https://www.microsoft.com/en-us/store/collections/vrandmixedrealityheadsets?SilentAuth=1&amp;wa=wsignin1.0" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer">MRデバイス</a>のサポートやゲーム配信など、さまざまな機能が追加されています。</font></p>

<h2>Windows Fall Creator Updateとは?</h2>

<p><font size="3">Windows 10に対して行われる年2回の機能アップデートのうちのひとつです。</font></p>

<p><font size="3">今回の <font size="3">Windows Fall Creator Updateで提供される新機能は以下のページで紹介されておりますのでぜひご覧ください。</font></font></p>

<ul>
<li><font size="4"><a title="新しいWindows 10 Creators Updateと機能 | 新機能を見る | Microsoft" href="https://www.microsoft.com/ja-jp/windows/upcoming-features" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer">新しいWindows 10 Creators Updateと機能</a></font></li>
</ul>

<p><font size="3">この記事ではWindows 10 Fall Creators Updateに搭載されるMicrosoft Edgeの新機能について紹介します。</font></p>

<h1>Microsoft Edge (EdgeHTML16)の新機能</h1>

<p><font size="3">Windows 10 Fall Creators Updateに搭載されるEdgeは、一目でその存在がわかるような派手な機能の追加はありませんが、着実にブラッシュアップアップされています。</font></p>

<p><font size="3">とはいえ、実際にユーザーの目に触れるUIとデザイン箇所の新機能から順に紹介していきたいと思います。</font></p>

<h2>UI デザインと機能</h2>

<h3><font style="font-weight: bold">ボタンアニメーションの改善</font></h3>

<p><font size="3"><a title="Fluent Design System" href="https://fluent.microsoft.com/" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer">Fluent Design System</a>にインスパイアされ、Microsoft Edgeのブラウザーフレームをよりモダンにリフレッシュしました。アクリルマテリアルの使用は、タブバーや他のコントロールに奥行きと透明性を提供し、より応答性と楽しさを感じるようにボタンのアニメーションを改善しました。</font></p>

<p><img width="938" height="223" class="alignnone size-full wp-image-5375" alt="" src="https://msdnshared.blob.core.windows.net/media/2017/10/taskbar1-e1508304571818.png"></p>

<h3><font style="font-weight: bold">単語と行の強調表示による読み上げ</font></h3>

<p><font size="3">WebサイトやPDFからのテキストを選択して右クリックし、コンテキストメニューから「読み上げ」を選択すると、テキストが音声で読み上げられます。選択内容が読み込まれ、その際に単語や行が強調表示されます。</font></p>

<div style="width: 100%">
<div style="margin: 0px auto;width: 400px">
<p><img width="401" height="220" class="size-full wp-image-5327" alt="コンテンツの読み上げ" src="https://msdnshared.blob.core.windows.net/media/2017/10/textSpeech.png"></p>
</div>
</div>

<h3><font style="font-weight: bold">Microsoft Edgeのフルスクリーンモード（F11）</font></h3>

<p><font size="3">フルスクリーン機能が正式に導入されています。Edge では、これまでもキーボードの [Shift] + [Win] + [Enter] キーを押下して全画面表示が可能でしたが、この方法は正式にはアナウンスされおらず、ある意味隠しコマンド的なものでした。</font></p>

<p><font size="3">今回のアップデートからは、[F11]キーを押下するか、設定メニューの新しいフルスクリーンアイコンを選択するだけで、Webサイトをフルスクリーンで表示できます。[F11]キーをもう一度押すか、右上隅にある復元アイコンをクリックして、全画面表示を終了することができます。</font></p>

<div style="width: 100%">
<div style="margin: 0px auto;width: 300px">
<p><img width="300" class="alignnone size-full wp-image-5345" alt="フルスクリーンモードのメニュー" src="https://msdnshared.blob.core.windows.net/media/2017/10/fullScreen1.png"></p>
</div>
</div>

<h3><font style="font-weight: bold">JavaScriptダイアログボックスが表示されていても終了可能に</font></h3>

<p><font size="3">これまでのEdgeまたは他のWebブラウザーでも、JavaScript の alert コマンドでなどで表示されるダイアログボックスが表示された状態では、終了することができませんでた。</font></p>

<p><font size="3">一部の悪質なWebサイトでは、この仕様を悪用して任意の操作を行うまでダイアログを表示し続けるということが現在も行われています。</font></p>

<p><font size="3">しかし、今回のアップデートでは、JavaScriptダイアログボックスが表示されている場合でも閉じるボタンを使用して正常にEdgeを終了することができるようになりました。</font></p>

<h3><font style="font-weight: bold">Webサイトのアクセス許可設定</font></h3>

<p><font size="3">Web サイトには、閲覧者の位置情報やWebカメラへのアクセス、またはデスクトップ通知の送信などの許可を求めるものがあります。</font></p>

<p><font size="3">今回のアップデートでは、これまでWebサイトごとに行ったアクセス許可設定が確認できるようになっています。</font></p>

<p><font size="3">これまでWebサイトに付与したアクセス許可を確認するには、アドレスバーに表示される鍵マークのアイコン、丸中にエクスクラメーションマーク (!) が描かれたアイコンのいずれかをクリックします。</font></p>

<p><font size="3">いずれのアイコンも表示されていない場合は、メニューバーの […](設定) – [詳細設定を表示] の画面で「Webサイトのアクセス許可」の[管理]ボタンをクリックします。</font></p>

<div style="width: 100%">
<div style="margin: 0px auto;width: 680px">

<div style="width: 300px;float: left">

<p><img width="300" class="alignnone size-full wp-image-5435" alt="" src="https://msdnshared.blob.core.windows.net/media/2017/10/Acc_web.png"></p>

</div>

<div style="padding: 5px;width: 50px;text-align: center;color: red;font-size: 50px;float: left">

<br>&nbsp; <p>⇒</p>

</div>

<div style="width: 300px;float: left">
<p>
<img width="300" class="alignnone size-full wp-image-5437" alt="" src="https://msdnshared.blob.core.windows.net/media/2017/10/Acc_web2.png"></p>
</div>

<div style="clear: both"><br></div>
</div>
<h2>
アドレスバーとタブ</h2>
<h3><font style="font-weight: bold">アドレスバーのデザインを調整</font></h3>
<p><font size="3">ユーザーからのフィードバックに基づいてアドレスバーのデザインを調整しました。これで、アドレスバーにフォーカスがない場合でも、テキストをクリックしてドラッグしたときに開始されても、カーソルの下に残ります。以前は、「http：//」の表示に合わせてテキストがシフトしました。この変更により、URLの一部を簡単に編集することが容易になりました。</font></p>
<p><font size="3">また、URLバーにフォーカスが当たったときに URLバーのテキストが移動し、URLの特定の部分を編集しにくくなる問題が修正されました。このビルドから、URLをクリックしてもカーソルの下のテキストは同じままになります。</font></p>
<h3><font style="font-weight: bold">タブの閉じ方をより詳細に制御</font></h3>
<p><font size="3">前述の「<font style="font-weight: bold">JavaScriptダイアログボックスが表示されていても終了可能に</font>」のところでも紹介しましたが、Microsoft EdgeでJavaScript（警告、プロンプトなど）のダイアログが表示されている場合でも、タブを閉じるためにタブバンドの X を常に使用できるようになりました。</font></p>
<p><font size="3">ダイアログが表示されている間も、多くのブラウザ機能（お気に入りバー、設定など）にアクセスすることもできます。</font></p>
<h3><strong>開閉時のアニメーション表示</strong></h3>
<p><font size="3">新しいタブは、開閉時にタブバー上にスムーズにアニメーション表示されるようになりました。</font></p>
<p><font size="3">セッションの復元の動作が改善され、（たとえば電子メールからの）リンクをクリックしてマルチウィンドウのEdgeのセッションを復元すると、復元の最後にフォーカスが当てられたウィンドウが新しいリンクを含むウィンドウになります。</font></p>
<h3><font style="font-weight: bold">スプラッシュページの色の遷移がスムーズに</font></h3>
<p><font size="3">Microsoft Edgeのスプラッシュページ（新しく起動したときに表示される）の色がよりスムーズにスタートと新しいタブ ページに遷移できるように。</font></p>
<h2>改善されたお気に入りのエクスペリエンス</h2>
<h3><font style="font-weight: bold">新しいお気に入りを保存するときの新しいエクスペリエンス</font></h3>
<p><font size="3">新しいお気に入りを保存するときに、お気に入りをディレクトリツリーとして表示できるようになり、[お気に入りに追加]ダイアログボックスからフォルダを折りたたんだり展開したりすることができます。</font></p>
<div style="width: 100%">
<div style="margin: 0px auto;width: 300px">
<p><img width="300" class="alignnone size-full wp-image-5386" alt="" src="https://msdnshared.blob.core.windows.net/media/2017/10/Favarit1.png"></p>
</div>
</div>
<h3><font style="font-weight: bold">お気に入りのURLを編集</font></h3>
<p><font size="3">お気に入りメニューまたはお気に入りバーで任意のお気に入りのURLを編集できるようになりました。これを使用して、移動したサイトの場所を更新したり、ブックマークレットをお気に入りバーに作成したりすることができます。</font></p>
<div style="width: 100%">
<div style="margin: 0px auto;width: 700px">
<div style="width: 280px;float: left">
<p><img width="280" class="alignnone size-full wp-image-5376" alt="" src="https://msdnshared.blob.core.windows.net/media/2017/10/Edit_Faverit_url1.png"></p>
</div>
<div style="padding: 5px;width: 100px;text-align: center;color: red;font-size: 50px;float: left">
<p>⇒</p>
</div>
<div style="width: 280px;float: left">
<p><img width="280" class="alignnone size-full wp-image-5385" alt="" src="https://msdnshared.blob.core.windows.net/media/2017/10/Edit_Faverit2_url1.png"></p>
</div>
<div style="clear: both"><br></div>
</div>
<h3><font style="font-weight: bold">エンタープライズのお気に入り管理機能</font></h3>
<p><font size="3">IT管理者は、グループ ポリシーを定義し、ユーザーのお気に入りに加えて事前構成済みのお気に入りをロックする機能など、モバイル デバイスの管理を介してお気に入りを構成できます。</font></p>
<h3><font style="font-weight: bold">お気に入りのウェブサイトをタスクバーにピン留め</font></h3>
<p><font size="3">ユーザーのフィードバックにより、タスクバーとスタートページへのWebサイトのピン留め機能が復活しました。サイトのアイコンを使用して、タスクバーからすぐにお気に入りのサイトにすばやくアクセスできるようにします。使い方は Edgeの設定メニューから「このページをタスクバーに固定する」を選択するだけです。</font></p>
<div style="width: 100%">
<div style="margin: 0px auto;width: 700px">
<p><img width="700" class="alignnone size-full wp-image-5417" alt="" src="https://msdnshared.blob.core.windows.net/media/2017/10/pined_all.png"></p>
</div>
</div>

<br>&nbsp; <h2>PDF関連の機能</h2>
<h3><font style="font-weight: bold">Microsoft Edge PDFの改善</font></h3>
<p><font size="3">PDF で [Cortana に質問] にハイライトカラーとオプションを追加しました。</font></p>
<h3><font style="font-weight: bold">PDFフォームの入力</font></h3>
<p><font size="3">PDFベースのフォームを記入し、保存して印刷する機能が追加されました。</font></p>
<h3><font style="font-weight: bold">PDFのアノテーション(注釈)</font></h3>
<p><font size="3">Webノートアノテーション機能は、Webページだけでなく、PDFでも動作するようになりました。ブラウザフレームの右上にある「Webノートを作成」ボタンを使用して、アノテーションバーを呼び出すことができます。</font></p>
<p><font size="3">アノテーションバーで異なるモードを使用すると、PDFにインクを印刷したり、テキストをハイライト表示したり、アノテーションを消去したりできます。後で使用するために、作業状況をPDFファイルに保存することができます。</font></p>
<div style="width: 100%">
<div style="margin: 0px auto;width: 500px">
<p><img width="500" class="alignnone size-full wp-image-5405" alt="" src="https://msdnshared.blob.core.windows.net/media/2017/10/pdf_note.png"></p>
</div>
</div>
<h3><font style="font-weight: bold">目次</font></h3>
<p><font size="3">目次を含むPDF文書の場合、PDFツールバーの左側に目次用の新しいボタンが表示されます。サイドペインの見出しをクリックすると、ドキュメントのその部分に移動します。</font></p>
<div style="width: 100%">
<div style="margin: 0px auto;width: 500px">
<p><img style="width: 500px" alt="Screen capture showing the ToC in Edge" src="https://winblogs.azureedge.net/win/2017/05/edge-toc.png"></p>
</div>
</div>
<h3><font style="font-weight: bold">より優れた表示とナビゲーション</font></h3>
<p><font size="3">より読みやすくするためにPDFドキュメントを回転させるコントロールを追加し、1ページから2ページのレイアウトに切り替えたり、長いドキュメントのナビゲーションエクスペリエンスを改善するために、連続したページごとのスクロールの間隔を変更したりします。</font></p>
<div style="width: 100%">
<div style="margin: 0px auto;width: 400px">
<p><img width="400" class="alignnone size-full wp-image-5415" alt="" src="https://msdnshared.blob.core.windows.net/media/2017/10/pdf_layout.png"></p>
</div>
</div>
<h2>EPUBの読書の改善</h2>
<h3><font style="font-weight: bold">コピーとCortanaへの質問</font></h3>
<p><font size="3">テキストを選択すると、コピーやCortanaに質問できるだけでなく、ノートを追加したり、強調表示したり下線を引いたりすることができます。EPUBの本を読んでいる間、Cortanaはユーザーの研究を手助けします。</font></p>
<div style="width: 100%">
<div style="margin: 0px auto;width: 500px">
<p><img style="width: 500px" alt="Screen capture showing Ask Cortana in an EPUB document" src="https://winblogs.azureedge.net/win/2017/06/e07555881fab505e99b6b25f749d8bb3-1024x849.png"></p>
</div>
</div>
<h3><font style="font-weight: bold">インクノート</font></h3>
<p><font size="3">これまで、ノートを追加し、ペンで書き込んだり、描画したりする機能は Webページのみで可能でしたが、EPUBでも可能になりました。</font></p>
<div style="width: 100%">
<div style="margin: 0px auto;width: 500px">
<p><img style="width: 500px" alt="Screen capture showing Ink Notes in an EPUB document" src="https://winblogs.azureedge.net/win/2017/06/14b697bb015deb910a6e24a7e0fc740a-1024x849.png"></p>
</div>
</div>
<h3><font style="font-weight: bold">ブックに注釈を付ける</font></h3>
<p><font size="3">4色でハイライト、下線、およびコメントの追加によってEPUB書籍を注釈を付ける機能を追加しました。開始するには、テキストを選択し、メニューからオプションを選択します。</font></p>
<div style="width: 100%">
<div style="margin: 0px auto;width: 400px">
<p><img style="width: 400px" alt="Screen capture showing an annotated EPUB book in Microsoft Edge" src="https://winblogs.azureedge.net/win/2017/06/1300b7c8438536aad5e3b55ed2ecd1e0-e1496958074264.png"></p>
</div>
</div>
<h3><font style="font-weight: bold">本をデバイス間でローミング</font></h3>
<p><font size="3">Windowsストアからの書籍は Windows 10デバイスで間で読み取りの進行状況、ブックマーク、およびメモが同期され保持されます。</font></p>
<p><font size="3">ただし、WindowsストアででのEPUB書籍の販売は現在米国のWindowsストアでのみ行われています。</font></p>
<h2><font style="font-weight: bold">開発者向けの機能</font></h2>
<h3><font style="font-weight: bold">Webプラットフォーム</font></h3>
<ul>
<li><font size="3">Form属性のサポート</font></li>
<li><font size="3"><a title="WebAssembly | MDN" href="https://developer.mozilla.org/ja/docs/WebAssembly" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer">WebAssembly</a>が既定で有効</font></li>
<li><font size="3"><a title="CSS グリッドレイアウト - CSS | MDN" href="https://developer.mozilla.org/ja/docs/Web/CSS/CSS_Grid_Layout" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer">CSS Gridレイアウト</a>のサポート </font></li>
<li><font size="3"><a title="High Resolution Time Level 3" href="http://www.w3.org/TR/hr-time-3/" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer">High Resolution Time Level 3</a> のサポート</font></li>
<li><font size="3">高度なイベントリスナー（ &#8220;once&#8221;と &#8220;passive&#8221;）のサポートが追加</font></li>
<li><font size="3"><a title="object-fit - CSS | MDN" href="https://developer.mozilla.org/ja/docs/Web/CSS/object-fit" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer">CSS object-fit/object-position</a> のサポートが追加</font></li>
<li><font size="3"><a title="position - CSS | MDN" href="https://developer.mozilla.org/ja/docs/Web/CSS/position#Sticky_positioning" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer">CSS position: sticky</a>のサポートが追加</font></li>
<li><font size="3"><a title="CSSの変数を使う" href="https://developer.mozilla.org/ja/docs/Web/CSS/Using_CSS_variables" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer">CSS カスタムプロパティ</a>(aka CSS Variables)のサポート</font></li>
<li><font size="3">ES2017<a title="ECMAScript Shared Memory and Atomics" href="https://tc39.github.io/ecmascript_sharedmem/shmem.html" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer">Shared MemoryとAtomics</a>が既定で有効</font></li>
</ul>
<div style="width: 100%">
<div style="margin: 15px;border: 5px dashed gainsboro;width: 600px">
<div style="font-size: 15px;font-weight: bold">Progressive Web Apps(PWA)のサポートは?</div>
<div style="font-size: 15px">Microsoft Edge Dev Blog の<a title="Microsoft Edge at Build 2017" href="https://blogs.windows.com/msedgedev/2017/05/19/microsoft-edge-at-build-2017/#j05PLwCl6w7GMkPR.97" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer">この記事</a>によれば、<em>will be coming to preview builds of Microsoft Edge for developer testing this summer.</em>とのことでしたが、PWAを構成する Service Worker や Web Application Manifest、Push API、Background Sync APIなどのステータスのステータスを確認すると [<a title="Microsoft Edge web platform features status and roadmap - Microsoft Edge Development" href="https://developer.microsoft.com/en-us/microsoft-edge/platform/status/?q=edge%3A&#039;In%20Development&#039;" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer">IN DEVELOPMENT</a>]のままなので、実装までにはもう少々かかるようです。</div>
</div>
</div>
<h2><font style="font-weight: bold">管理者向けの機能</font></h2>
<h3>グループポリシーオブジェクト</h3>
<p><font size="3">Microsoft EdgeにはWindowsドメイン環境下で管理者が設定を一括管理するためのグループポリシーが用意されています。</font></p>
<p><font size="3">Windows 10 Fall Creators Updateにより、Microsoft Edgeには、3個の新しいグループポリシーが追加されました。</font></p>
<table width="600" border="1" cellspacing="0" cellpadding="5">
<tbody>
<tr>
<td width="300" valign="top" style="text-align: center;color: white;background-color: navy">説明</td>
<td width="300" valign="top" style="text-align: center;color: white;background-color: navy">設定</td>
</tr>
<tr>
<td>Microsoft Edgeに書籍ライブラリを常に表示する</td>
<td>Windows設定の[国または地域] 領域で構成したデバイスの国または地域設定に関係なく、[書籍]タブを表示するかどうかを決定</td>
</tr>
<tr>
<td>お気に入りのプロビジョニング</td>
<td>ユーザーに表示されるお気に入りの既定のセットを構成できる</td>
</tr>
<tr>
<td>Microsoft Edge上のお気に入りを変更できないようにする</td>
<td>この設定を有効にした場合、ユーザーはお気に入りリストの内容を追加、インポート、または変更できません</td>
</tr>
</tbody>
</table>
<p><font size="3"></font></p>
<p><font size="3"></font></p>
<p><font size="3"></font></p>
<p><font size="3"></font></p>
<p><font size="3"></font></p><font size="3">
<p>その他、Microsoft Edgeに指定可能な既存のグループポリシー設定については、以下のドキュメントをご参照くださいませ。</p>
<ul>
<li><a href="https://technet.microsoft.com/ja-jp/itpro/microsoft-edge/available-policies" data-wpel-link="external" target="_blank" rel="follow external noopener noreferrer">Microsoft Edgeで利用可能なポリシー</a></li>
</ul>
<h2><font style="font-weight: bold">その他の進歩</font></h2>
<h3><font style="font-weight: bold">描画性能の向上 &#8211; </font><font style="font-weight: bold">独立したレンダリング</font></h3>
<p>EdgeHTML 16ではグラフィックス処理を追加のCPUスレッドに選択的にオフロードすることができるため、<a href="https://blogs.windows.com/msedgedev/2017/03/08/scrolling-on-the-web" data-wpel-link="external" target="_blank" rel="follow external noopener noreferrer">シルク &#8211; スムーズスクロール</a>、応答性の高い対話、fluid アニメーションなど、ユーザーインターフェイス スレッドと全体的な可視パフォーマンス特性ページへの影響を最小限に抑えてレンダリングできます。EdgeHTML 16では、以下の要素を完全にサポートすることで、より多くのサイトで独立したレンダリングが可能になりました。</p>
<ul>
<li>&lt;select&gt;コントロール</li>
<li>&lt;canvas&gt;要素</li>
<li>特定の&lt;svg&gt;要素</li>
</ul>
<p>この改善点の詳細については以下の記事をご覧ください。</p>
</font><p><font size="3"></font></p>
<p><font size="3"></font></p>
<p><font size="3"></font></p>
<p><font size="3"></font></p>
<p><font size="3"></font></p>
<ul>
<li><a href="https://blogs.windows.com/msedgedev/2017/08/17/making-web-smoother-independent-rendering/" data-wpel-link="external" target="_blank" rel="follow external noopener noreferrer"><font size="4"><strong>Making the web smoother with independent rendering</strong></font></a></li>
</ul>
<h3><font style="font-weight: bold">Windows Defender Application Guard</font></h3>
<p>昨年9月にMicrosoft Edge Blogで発表されました <a title="Microsoft Edge向けのWindows Defender Application Guardの紹介" href="https://blogs.windows.com/japan/2016/10/13/application-guard-microsoft-edge/" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer">Windows Defender Application Guard for Microsoft Edge</a> がエンタープライズユーザー向けに利用できるようになりました。</p>
<p>Application Guard上で実行されるMicrosoft Edgeは、Windowsに対するゼロデイ攻撃とマルウェアからの最大レベルの保護を企業に提供します。</p>
<p>また、Application Guardの使用中にMicrosoft Edgeデータの永続性がサポートされました。有効にすると、お気に入り、Cookie、保存されたパスワードなどのデータは、Application Guardセッション全体で保持されます。永続化されたデータはホスト上で共有されたり表示されたりすることはありませんが、将来のMicrosoft Edgeでは Application Guardセッションで使用できるようになります。</p>
<div style="width: 100%">
<div style="margin: 0px auto;width: 500px">
<p><img style="width: 500px" alt="Screen capture showing a WDAG tab in Edge" src="https://winblogs.azureedge.net/win/2017/05/WDAG-3.png"></p>
</div>
</div>
<h1>まとめ</h1>
<p><font size="3">今回の記事では、Windows 10 Fall Creators Updateに搭載される Microsoft Edge (EdgeHTML16)の新機能について紹介しました。</font></p><p><font size="3">これら新機能については、Edgeの開発者チームのブログMicrosoft Edge Devでも紹介されていますので、こちらも合わせてご覧ください。</font></p><ul><li><font size="4"><a title="What&rsquo;s New in Microsoft Edge in the Windows 10 Fall Creators Update" href="https://blogs.windows.com/msedgedev/2017/10/17/edgehtml-16-fall-creators-update/#0U8LIYBpyVrf3Z8m.97" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer"><strong>What’s New in Microsoft Edge in the Windows 10 Fall Creators Update</strong></a></font></li></ul><p><font size="3">Microsoft Edgeは、ユーザーからのフィードバックを参考に着実に進化しています。</font></p>
<p><font size="3">Microsoft Edgeへのフィードバックと評価は、メニュー[…](設定) – [フィードバックの送信]から送ることができます。</font></p>
<p><font size="3">また、開発チームからの反応や、その後の進捗の状況が気になる方は <a href="https://wpdev.uservoice.com/forums/257854-microsoft-edge-developer" data-wpel-link="external" target="_blank" rel="follow external noopener noreferrer"><strong>Microsoft Edge Platform Suggestion Box</strong></a>に投稿を行うのをお勧めします。</font></p>
<p><font size="3">また私も引き続きEdge、Web関連の情報を発信していきますので、<a title="@samum_MS" href="https://twitter.com/osamum_MS" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer">@osamum_MS</a>のフォローもよろしくお願いします。</font></p>
<p><font size="3"></font><font size="3"></font></p></div></div>
]]></content:encoded>
			<wfw:commentRss>/osamum_ms/24472/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>新しくなったMicrosoft Edgeを試してみよう！ーWindows 10 Creators Updateで入ったEdgeの新機能一挙解説</title>
		<link>/osamum_ms/22779/</link>
		<pubDate>Thu, 13 Apr 2017 01:00:31 +0000</pubDate>
		<dc:creator><![CDATA[物江 修]]></dc:creator>
				<category><![CDATA[最新動向]]></category>
		<category><![CDATA[Creators Update]]></category>
		<category><![CDATA[Edge]]></category>
		<category><![CDATA[Windows 10]]></category>
		<category><![CDATA[browser]]></category>

		<guid isPermaLink="false">/?p=22779</guid>
		<description><![CDATA[今週 (2017/4/11 米国時間) からいよいよ Windows 10 Creators Updateの配信が開始されました。 この配信は、さまざまな業況を見ながら順次行われていきますが、もし、自分の番まで待ちきれな...]]></description>
				<content:encoded><![CDATA[<p>今週 (2017/4/11 米国時間) からいよいよ <a title="The Creators Update | 2017年に追加される新しいWindows機能" href="https://www.microsoft.com/ja-jp/windows/upcoming-features" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer">Windows 10 Creators Update</a>の配信が開始されました。</p>

<p>この配信は、さまざまな業況を見ながら順次行われていきますが、もし、自分の番まで待ちきれない、という人は、4月6日（日本）からすでに利用可能になっている&nbsp;<a href="http://bit.ly/win10updateacc" data-wpel-link="external" target="_blank" rel="follow external noopener noreferrer">Windows 10更新アシスタント</a>を使用してマニュアルインストールをしてもよいでしょう。</p>

<p>このアップデートではWindows 10そのものに<a title="Windows&nbsp;10に間もなく追加される機能" href="https://www.microsoft.com/ja-jp/windows/upcoming-features" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer">さまざまな機能追加</a>が行われることはもちろん、そこに搭載されるWebブラウザーMicrosoft Edgeにも新機能が追加されます。</p>

<p>今回の記事では、Windows 10 Creators Updateに搭載される Microsoft Edgeの新機能について紹介します。</p>

<h1>Windows 10 Creators UpdateでのMicrosoft Edgeの新機能</h1>

<p>Microsoft Edgeは安全性と相互有用性、パフォーマンスの向上を中心に継続的に機能改善が行われています。具体的には、DOMパーサーやJavaScriptエンジンの性能向上であったり、低電力性能の向上、サンドボックスの機能向上といったものです。そういったものは、内側の強化であるため、なかなかユーザーの目に触れることはありませんが、着実に進化しています。こういった部分はEdge開発チームのブログで詳しく紹介されていますので、ご興味のある方はぜひこちらをご覧ください。</p>

<ul> <li><font size="3"><a title="Microsoft Edge Dev Blog" href="https://blogs.windows.com/msedgedev/" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer">Microsoft Edge Dev Blog</a></font></li></ul>

<p>今回のこの記事では、「誰からも使用可能なUIを持った部分」を中心にWindows 10 Creators UpdateでMicrosoft Edgeに追加された新機能を紹介します。</p>

<h2>タブ機能の強化</h2>

<p>Webブラウザーにおけるタブは、いまや ユーザーがWebを閲覧するうえでの重要なUIとなっています。Webブラウザーに読み込んだWeb サイトの画面を効率的に整理できれば、コンテンツにより没頭できますし、必要な情報の入手は把握もはかどることでしょう</p>

<p>前回の<a title="Windows 10 Anniversary Updateを取得する" href="https://support.microsoft.com/ja-jp/instantanswers/d4efb316-79f0-1aa1-9ef3-dcada78f3fa0/get-the-windows-10-anniversary-update" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer">Windows 10 Anniversary Update</a>で、Edgeのタブには「お気に入り」や「プレビュー」機能が追加されましたが、Windows 10 Creators Updateではさらに使い勝手を向上させるための機能が追加されています。</p>

<h3>表示中のタブの終了と保存、そして復元</h3>

<p>現在開いているタブをすべて閉じたあと、任意のタイミングで元通りに戻すことができます。これを行うにはMicrosoft Edgeウィンドウの左上の端から2番目の[表示中のタブを保存して閉じる]&nbsp; アイコンをクリックします。</p>

<div style="width: 200px;margin: 0px auto"><a href="https://msdnshared.blob.core.windows.net/media/2017/04/Save_and_CloseTab31.png" data-wpel-link="external" target="_blank" rel="follow external noopener noreferrer"><img title="Save_and_CloseTab3" style="border-left-width: 0px;border-right-width: 0px;width: 200px;border-bottom-width: 0px;padding-top: 0px;padding-left: 0px;padding-right: 0px;border-top-width: 0px" border="0" alt="Save_and_CloseTab3" src="https://msdnshared.blob.core.windows.net/media/2017/04/Save_and_CloseTab3_thumb1.png" width="240" height="109"></a> </div>

<p>&nbsp;</p>

<p>表示されているタブはすべて閉じられますが、タブが表示していたWebサイトのURLは保存されており、ウィンドウ左上隅にある[保存して閉じたタブ]アイコンをクリックするとその一覧にアクセスできます。</p>

<div style="width: 200px;margin: 0px auto"><a href="https://msdnshared.blob.core.windows.net/media/2017/04/Saved_and_ClosedTab.png" data-wpel-link="external" target="_blank" rel="follow external noopener noreferrer"><img title="Saved_and_ClosedTab" style="width: 200px" border="0" alt="Saved_and_ClosedTab" src="https://msdnshared.blob.core.windows.net/media/2017/04/Saved_and_ClosedTab.png"></a></div>

<p>&nbsp;</p>

<p>同アイコンをクリックすると、画面の左側に保存されたWebサイトのサムネイル画像を含んだブレードが表示されます。</p>

<div style="width: 500px;margin: 0px auto"><a href="https://msdnshared.blob.core.windows.net/media/2017/04/RepairTab_Blade241.png" data-wpel-link="external" target="_blank" rel="follow external noopener noreferrer"><img title="RepairTab_Blade24" style="border-left-width: 0px;border-right-width: 0px;width: 500px;border-bottom-width: 0px;padding-top: 0px;padding-left: 0px;padding-right: 0px;border-top-width: 0px" border="0" alt="RepairTab_Blade24" src="https://msdnshared.blob.core.windows.net/media/2017/04/RepairTab_Blade241.png" width="240" height="161"></a> </div>

<p>&nbsp;</p>

<p>タブは、保存されたタイミング単位で複数のものがまとまって保存されています。</p>

<p>保存されたタブを再度表示するには、ブレート内のサムネイル画像をクリックします。もしくは、同じタイミングで保存されたタブを一度に戻すには 、同ブレードの右端にある[タブの復元]リンクをクリックします。</p>

<div style="width: 500px;margin: 0px auto"><a href="https://msdnshared.blob.core.windows.net/media/2017/04/RepairTab_Blade_Menu231.png" data-wpel-link="external" target="_blank" rel="follow external noopener noreferrer"><img title="RepairTab_Blade_Menu23" style="border-left-width: 0px;border-right-width: 0px;width: 500px;border-bottom-width: 0px;padding-top: 0px;padding-left: 0px;padding-right: 0px;border-top-width: 0px" border="0" alt="RepairTab_Blade_Menu23" src="https://msdnshared.blob.core.windows.net/media/2017/04/RepairTab_Blade_Menu231.png"></a> </div>

<p>&nbsp;</p>

<p>また[タブの復元]メニューの横にある […](その他) メニューをクリックするとタブのURLを [お気に入り] に追加したり、タブを他のアプリで共有したりできます。</p>

<h3>タブのプレビューの一覧</h3>

<p>前回のWindows 10 Anniversary Updateでは、タブがロードしているWebコンテンツのプレビューを表示する機能が追加されましたが、Windows 10 Creators Updateでは、これを一覧表示できるようになりました。</p>

<p>この機能を使用するには、Edgeウィンドウ内にあるタブの右端にある[タブ プレビューを表示]アイコンをクリックします。</p>

<div style="width: 150px;margin: 0px auto"><a href="https://msdnshared.blob.core.windows.net/media/2017/04/TabPreviewButton.png" data-wpel-link="external" target="_blank" rel="follow external noopener noreferrer"><img title="TabPreviewButton" style="width: 150px" border="0" alt="TabPreviewButton" src="https://msdnshared.blob.core.windows.net/media/2017/04/TabPreviewButton.png"></a> </div>

<p>各タブの下にプレビュー画面がサムネイル表示されます。</p>

<div style="width: 540px;margin: 0px auto"><a href="https://msdnshared.blob.core.windows.net/media/2017/04/TabPreviewBar31.png" data-wpel-link="external" target="_blank" rel="follow external noopener noreferrer"><img title="TabPreviewBar3" style="width: 540px" border="0" alt="TabPreviewBar3" src="https://winblogs.azureedge.net/win/2017/01/edge1v2.gif"></a> </div>

<p>&nbsp;</p>

<p>元に戻すには再度[タブ プレビューを表示]アイコンをクリックします。</p>

<h2>Web-to-App のサポート</h2>

<p>Webからアプリへのリンク(Web-to-App)をサポートするWebサイトへのリンクをクリックすると、設定アプリのWeb<em>サイトのアプリ</em>セクションで設定されているように、それぞれのアプリでそのページを開くようになりました。</p>

<p>Web-to-Appがどういうものであるか知りたい方は以下のドキュメントをご覧くださいませ。</p>

<ul> <li><a title="Web-to-App Linking with AppUriHandlers" href="https://blogs.windows.com/buildingapps/2016/10/14/web-to-app-linking-with-appurihandlers/" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer"><font size="2">Web-to-App Linking with AppUriHandlers</font></a>  <li><a title="アプリのURIハンドラーを使用してWebとアプリのリンクをサポートする" href="https://docs.microsoft.com/ja-jp/windows/uwp/launch-resume/web-to-app-linking" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer"><font size="2">アプリのURIハンドラーを使用してWebとアプリのリンクをサポートする</font></a> </li></ul>

<h2>ジャンプリストから直接InPrivateウィンドウへ</h2>

<p>Internet Explorerのように、タスクバーのアイコンを右クリックした際に表示されるジャンプリストから、直接InPrivateウィンドウを開くことができるようになりました。</p>

<div style="width: 271px;margin: 0px auto"><a href="https://msdnshared.blob.core.windows.net/media/2017/04/jumpList.png" data-wpel-link="external" target="_blank" rel="follow external noopener noreferrer"><img title="jumpList" style="width: 271px" border="0" alt="jumpList" src="https://msdnshared.blob.core.windows.net/media/2017/04/jumpList.png"></a> </div>

<p>&nbsp;</p>

<p>InPrivateウィンドウを使用すると、履歴などプライバシーに関わる情報を保護することができます。他人知られたくないWebサイトを閲覧をするときはもちろんですが、Webサイトのサービスへ、別アカウントでログインする際や、自動で認証されているアカウントの影響により操作がうまくいかないといった場合にも役に立ちます。</p>

<h2>Webノートの機能強化</h2>

<p>Microsoft Edgeのもっとも特徴的な機能であるWebノートに、そのアイコンの変更が示すとおり(?)ささやかですが新機能と変更が加えられています。</p>

<div style="width: 130px;margin: 0px auto"><a href="https://html5experts.jp/wp-content/uploads/2017/04/image.png" data-wpel-link="internal"><img title="image" style="width: 130px" border="0" alt="image" src="/wp-content/uploads/2017/04/image_thumb.png"></a> </div>

<p><br></p>

<p>Webノートのメニューの位置はそれまで、画面左上に表示されていましたが、今回のアップデートでは画面右上に移動されています。</p>

<h3>タッチによる手書きのサポート</h3>

<p>[タッチによる手書き]メニューが追加されました。これまでも、メニューがないだけで、タッチによるWebノートの書き込みを行うことができましたが、これをオフにすることができませんでした。今回のアップデートでは、[タッチによる手書き]メニューをクリックすることで、機能のオン/オフを切り替えることができます。</p>

<div style="width: 190px;margin: 0px auto"><a href="https://msdnshared.blob.core.windows.net/media/2017/04/Touch_Write.png" data-wpel-link="external" target="_blank" rel="follow external noopener noreferrer"><img title="Touch_Write" style="width: 190px" border="0" alt="Touch_Write" src="https://msdnshared.blob.core.windows.net/media/2017/04/Touch_Write.png"></a> </div>

<h3>ペンの色とサイズの強化</h3>

<p>[ボールペン]や[蛍光ペン]メニューをクリックした際に選択可能な色が増え、ペン先の太さもスライダーで変更できるように強化されました。</p>

<div style="width: 326px;margin: 0px auto"><a href="https://msdnshared.blob.core.windows.net/media/2017/04/ball_Pen31.png" data-wpel-link="external" target="_blank" rel="follow external noopener noreferrer"><img title="ball_Pen3" style="border-left-width: 0px;border-right-width: 0px;width: 326px;border-bottom-width: 0px;padding-top: 0px;padding-left: 0px;padding-right: 0px;border-top-width: 0px" border="0" alt="ball_Pen3" src="https://msdnshared.blob.core.windows.net/media/2017/04/ball_Pen31.png"></a> </div>

<p><br></p>

<p>ここで選択された内容は、前出の[タッチによる手書き]にも反映されます。</p>

<h3>共有機能の変更</h3>

<p>アイコンのデザインに合わせたのかどうかは定かではありませんが、Webノートの共有機能のデザインが変更になっています。</p>

<div style="width: 150px;margin: 0px auto"><a href="https://msdnshared.blob.core.windows.net/media/2017/04/WebNote_Share.png" data-wpel-link="external" target="_blank" rel="follow external noopener noreferrer"><img title="WebNote_Share" style="width: 150px" border="0" alt="WebNote_Share" src="https://msdnshared.blob.core.windows.net/media/2017/04/WebNote_Share.png"></a></div>

<p><br></p>

<p>以前はWindows 8.xの“チャーム”のようなブレードがウィンドウの右側からせり出してきていましたが、今回のアップデートではダイアログボックスが表示されるようになっています。</p>

<div style="width: 350px;margin: 0px auto"><a href="https://msdnshared.blob.core.windows.net/media/2017/04/WebNote_Share_dialog31.png" data-wpel-link="external" target="_blank" rel="follow external noopener noreferrer"><img title="WebNote_Share_dialog3" style="border-left-width: 0px;border-right-width: 0px;width: 350px;border-bottom-width: 0px;padding-top: 0px;padding-left: 0px;padding-right: 0px;border-top-width: 0px" border="0" alt="WebNote_Share_dialog3" src="https://msdnshared.blob.core.windows.net/media/2017/04/WebNote_Share_dialog31.png"></a></div>

<p><br></p>

<h2>EPUBのサポート</h2>

<p>EdgeでEPUB形式の電子書籍ファイルがサポートされました。</p>

<p>EPUB用に特別にアプリケーションをインストールしなくても、直接ファイルの内容を閲覧することができます。</p>

<p>著作権の関係で、文面の表示された画面ショットをお見せできませんが、日本語の表示はもろろん、縦書きも問題なく表示されます。</p>

<div style="width: 600px;margin: 0px auto"><a href="https://msdnshared.blob.core.windows.net/media/2017/04/image39.png" data-wpel-link="external" target="_blank" rel="follow external noopener noreferrer"><img title="image3" style="border-left-width: 0px;border-right-width: 0px;width: 600px;border-bottom-width: 0px;padding-top: 0px;padding-left: 0px;padding-right: 0px;border-top-width: 0px" border="0" alt="image3" src="https://msdnshared.blob.core.windows.net/media/2017/04/image39.png"></a> </div>

<p>&nbsp;</p>

<p>目次、ブックマーク、検索しもちろんのこと、文章の読み上げや、</p>

<div style="width: 260px;margin: 0px auto"><a href="https://msdnshared.blob.core.windows.net/media/2017/04/e-pub_reading31.png" data-wpel-link="external" target="_blank" rel="follow external noopener noreferrer"><img title="e-pub_reading3" style="border-left-width: 0px;border-right-width: 0px;width: 260px;border-bottom-width: 0px;padding-top: 0px;padding-left: 0px;padding-right: 0px;border-top-width: 0px" border="0" alt="e-pub_reading3" src="https://msdnshared.blob.core.windows.net/media/2017/04/e-pub_reading31.png"></a> </div>

<p>&nbsp;</p>

<p>テキストのサイズや文字間隔、フォントスタイルやテーマなども柔軟に変更することができます。</p>

<div style="width: 259px;margin: 0px auto"><a href="https://msdnshared.blob.core.windows.net/media/2017/04/e-pub_text31.png" data-wpel-link="external" target="_blank" rel="follow external noopener noreferrer"><img title="e-pub_text3" style="border-left-width: 0px;border-right-width: 0px;width: 259px;border-bottom-width: 0px;padding-top: 0px;padding-left: 0px;padding-right: 0px;border-top-width: 0px" border="0" alt="e-pub_text3" src="https://msdnshared.blob.core.windows.net/media/2017/04/e-pub_text31.png"></a> </div>

<p>&nbsp;</p>

<p>EdgeのEPUB機能については、<strong>Jun Tajima</strong>さんが詳しい<a title="電書魂　─グーテンベルクの遙か彼方へ─Microsoft EdgeのEPUB表示チェック" href="http://densyodamasii.com/?p=3179" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer"><strong>レビュー</strong></a>を書かれておりますので、ご興味のある方はぜひご覧くださいませ。</p>

<h2>Flashコンテンツの挙動の変更</h2>

<p>Windows 10 Creators Updateから、信頼できないFlashコンテンツは既定でブロックされており、ユーザーが明示的にプレイするまで実行されないようになりました。これにより、セキュリティ、安定性、パフォーマンスが向上し、選択した時点でFlashを実行するというオプションが選択できます。</p>

<p>Flashコンテンツがブロックされたときに明確にするためにURLバーはダイアログボックスが表示されます。一度、または同じサイトに戻るたびにFlashを許可するパズル アイコンをクリックします。</p>

<div style="width: 297px;margin: 0px auto"><a href="https://msdnshared.blob.core.windows.net/media/2017/04/flashBlock31.png" data-wpel-link="external" target="_blank" rel="follow external noopener noreferrer"><img title="flashBlock3" style="border-left-width: 0px;border-right-width: 0px;width: 297px;border-bottom-width: 0px;padding-top: 0px;padding-left: 0px;padding-right: 0px;border-top-width: 0px" border="0" alt="flashBlock3" src="https://msdnshared.blob.core.windows.net/media/2017/04/flashBlock31.png"></a> <br><br><a href="https://html5experts.jp/wp-content/uploads/2017/04/image3.png" data-wpel-link="internal"><img title="image[3]" style="border-left-width: 0px;border-right-width: 0px;width: 297px;border-bottom-width: 0px;padding-top: 0px;padding-left: 0px;padding-right: 0px;border-top-width: 0px" border="0" alt="image[3]" src="/wp-content/uploads/2017/04/image3_thumb.png"></a> </div>

<p><br>&nbsp;</p>

<p>Microsoft EdgeにおけるFlashコンテンツの動作はWindows 10 Creators Updateで変更されています。この変更についての詳細はMicrosoft Edge Dev Blog: <a href="https://blogs.windows.com/msedgedev/2016/12/14/edge-flash-click-run/" data-wpel-link="external" target="_blank" rel="follow external noopener noreferrer">Extending User Control of Adobe Flash with Click-to-Run</a>. をご覧ください。</p>

<h2>フルカラーemojiのサポート</h2>

<p>Microsoft Edgeでは、絵文字 (emoji)を使用しているWebサイトにフルカラーの新しくなった絵文字が既定で表示されるようになりました。</p>

<p>この絵文字は、Windows 10のソフトウェアキーボードなどからも入力することができます。</p>

<div style="width: 313px;margin: 0px auto"><a href="https://msdnshared.blob.core.windows.net/media/2017/04/fb-Post31.png" data-wpel-link="external" target="_blank" rel="follow external noopener noreferrer"><img title="fb-Post3" style="border-left-width: 0px;border-right-width: 0px;width: 313px;border-bottom-width: 0px;padding-top: 0px;padding-left: 0px;padding-right: 0px;border-top-width: 0px" border="0" alt="fb-Post3" src="https://msdnshared.blob.core.windows.net/media/2017/04/fb-Post31.png"></a> </div>

<div style="width: 789px;margin: 0px auto"><a href="https://msdnshared.blob.core.windows.net/media/2017/04/Touch-Keybord31.png" data-wpel-link="external" target="_blank" rel="follow external noopener noreferrer"><img title="Touch-Keybord3" style="border-left-width: 0px;border-right-width: 0px;width: 789px;border-bottom-width: 0px;padding-top: 0px;padding-left: 0px;padding-right: 0px;border-top-width: 0px" border="0" alt="Touch-Keybord3" src="https://msdnshared.blob.core.windows.net/media/2017/04/Touch-Keybord31.png"></a> </div>

<p>&nbsp;</p>

<p>これら絵文字は、一般的なSNSなどでは画像で変換されて、スマートフォンなどからでもきちんと見ることができます。</p>

<h2>API のサポート</h2>

<p>Windows 10 Creators UpdateでEdgeがサポートしたAPIは、細かくはさまざまなものがありますが、ざっくりとは以下のとおりです。</p>

<ul> <li><a title="Ambient Light Sensor" href="http://www.w3.org/TR/ambient-light/" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer">Ambient Light Sensor API</a>  <li><a title="Async Functions" href="https://tc39.github.io/ecmascript-asyncawait/" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer">Async Functions</a>  <li><a title="RFC 7932 - Brotli Compressed Data Format" href="https://tools.ietf.org/html/rfc7932" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer">Brotli Compressed Data Format</a>  <li><a title="Content Security Policy Level 3" href="http://www.w3.org/TR/CSP/" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer">Content Security Policy Level 2</a>  <li><a title="Offsetting the Outline: the outline-offset property" href="https://drafts.csswg.org/css-ui-3/#outline-offset" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer">CSS outline-offset</a>  <li><a title="ECMAScript 2015 Language Specification &ndash; ECMA-262 6th Edition" href="http://www.ecma-international.org/ecma-262/6.0/#sec-destructuring-assignment" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer">Destructuring</a> (ES6)  <li>H.264/AVC for RTC  <li><a title="Intersection Observer 1" href="https://wicg.github.io/IntersectionObserver/" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer">Intersection Observer</a>  <li>Modules (ES6)  <li><a title="Payment Request API" href="http://www.w3.org/TR/payment-request/" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer">Payment Request API</a>  <li>RegExp Built-ins (ES6)  <li><a href="http://tc39.github.io/ecmascript_simd/" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer">SIMD</a>  <li>VP8 for RTC  <li><a title="WebRTC 1.0: Real-time Communication Between Browsers" href="http://www.w3.org/TR/webrtc/" data-wpel-link="external" target="_blank" rel="follow external noopener noreferrer">WebRTC – WebRTC v1.0 API</a>  <li><a title="WebVR" data-wpel-link="internal">WebVR</a> </li></ul>

<p>これらのいくつかについては、Microsoft Edge Dev Blogに記事が投稿されているので、私が抄訳したものと合わせて紹介させていただきます。</p>

<ul> <li><a title="Microsoft Edge での WebRTC 1.0 および相互運用可能なリアルタイム通信の紹介" href="https://blogs.msdn.microsoft.com/msedgedev_japan/2017/02/01/introducing-webrtc-1-0-and-interoperable-real-time-communications-in-microsoft-edge/" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer">Microsoft EdgeでのWebRTC 1.0および相互運用可能なリアルタイム通信の紹介</a>  <li><a title="Content Security Policy Level 2 サポートの概要" href="https://blogs.msdn.microsoft.com/msedgedev_japan/2017/01/11/introducing-support-for-content-security-policy-level-2/" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer">Content Security Policy Level 2 サポートの概要</a>  <li><a title="よりシンプルなWebの決済方法 : Payment Request APIの紹介" href="https://blogs.msdn.microsoft.com/msedgedev_japan/2016/12/20/simpler-web-payments-introducing-the-payment-request-api/" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer">よりシンプルなWebの決済方法 : Payment Request API の紹介</a>  <li><a title="CSS Custom Properties in Microsoft Edge" href="https://blogs.windows.com/msedgedev/2017/03/24/css-custom-properties/" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer">CSS Custom Properties in Microsoft Edge</a> </li></ul>

<h3>Progressive Web Apps 対応は?</h3>

<p>Progressive Web Appsへの対応は、多くの開発者が気になるところでしょう。Microsoft Edge Developmentの<a title="Platform Status" href="https://developer.microsoft.com/en-us/microsoft-edge/platform/status/" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer">Platform Status</a>で確認すると、Progressive Web Appsを構成する所要機能のいくつかのステータスが IN DEVELOPMENT (開発中)のままになっています。</p>

<div style="width: 375px;margin: 0px auto"><a href="https://msdnshared.blob.core.windows.net/media/2017/04/image132.png" data-wpel-link="external" target="_blank" rel="follow external noopener noreferrer"><img title="image13" style="border-left-width: 0px;border-right-width: 0px;width: 375px;border-bottom-width: 0px;padding-top: 0px;padding-left: 0px;padding-right: 0px;border-top-width: 0px" border="0" alt="image13" src="https://msdnshared.blob.core.windows.net/media/2017/04/image132.png"></a> </div>

<p><br>&nbsp;</p>

<p>しかし、これらの機能は、試験的にWindows 10 Creators UpdateのEdgeに搭載されており、検証に使用することができます。</p>

<p>これらの機能を試すには、アドレスバーにabout:flagsと入力して [開発者向け設定画面]を表示し、以下の該当する機能のチェックボックスにチェックをつけ、Edgeを再起動します。</p>

<div style="width: 350px;margin: 0px auto"><a href="https://msdnshared.blob.core.windows.net/media/2017/04/pwa31.png" data-wpel-link="external" target="_blank" rel="follow external noopener noreferrer"><img title="pwa3" style="border-left-width: 0px;border-right-width: 0px;width: 350px;border-bottom-width: 0px;padding-top: 0px;padding-left: 0px;padding-right: 0px;border-top-width: 0px" border="0" alt="pwa3" src="https://msdnshared.blob.core.windows.net/media/2017/04/pwa31.png"></a> </div>

<p>&nbsp;</p>

<h2>拡張について</h2>

<p>Windows 10 Creators Updateにより、Edge拡張はネイティブメッセージングを使用して、ユニバーサルWindowsプラットフォーム（UWP）アプリケーションと通信することができるようになりました。Edge拡張はChromeやFirefoxの拡張と同じネイティブメッセージングAPIを使用します。

ただし、Edgeのネイティブメッセージングホストは、Universal Windows Platformを使用して実装する必要があります。</p>

<p>この機能を使用すると、Webアプリケーションでは実現できないプラットフォーム固有やハードウェアリソースを利用したソリューションをUWPアプリと連携して実現することができます。</p>

<p>詳しくは以下のドキュメントをご参照ください。</p>

<ul> <li><a title="Native messaging in Microsoft Edge" href="https://docs.microsoft.com/ja-jp/microsoft-edge/extensions/guides/native-messaging" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer"><font size="3">Native messaging in Microsoft Edge</font></a> </li></ul>

<p>&nbsp;</p>

<h2>管理者向け機能</h2>

<p>Microsoft EdgeにはWindowsドメイン環境下で管理者が設定を一括管理するためのグループポリシーが用意されています。</p>

<p>Windows 10 Creators Updateにより、Microsoft Edgeには、10個の新しいグループポリシーが追加されました。</p>

<div style="width: 470px;margin: 0px auto"><a href="https://msdnshared.blob.core.windows.net/media/2017/04/Edge-gp.png" data-wpel-link="external" target="_blank" rel="follow external noopener noreferrer"><img title="Edge-gp" style="width: 470px" border="0" alt="Edge-gp" src="https://msdnshared.blob.core.windows.net/media/2017/04/Edge-gp1.png"></a> </div>

<p>具体的には以下のものになります。</p>

<div style="width: 600px;margin: 0px auto"> <table cellspacing="0" cellpadding="2" width="600" border="1"> <tbody> <tr> <td style="color: white;text-align: center;background-color: navy" valign="top" width="300">説明</td> <td style="color: white;text-align: center;background-color: navy" valign="top" width="300">設定</td></tr> <tr> <td>終了時の閲覧データ クリアを許可する</td> <td>有効にするとEdge終了時に自動で閲覧データをクリアする</td></tr> <tr> <td>アドレスバーのドロップダウンリスト候補を許可する</td> <td>有効にするとアドレスバーにドロップダウン候補が表示される。ネットワークトラフィックを下げたい場合はオフにする</td></tr> <tr> <td>Adobe Flash の Click-toRun を構成する</td> <td>有効な場合は自動再生はされない</td></tr> <tr> <td>検索エンジンのカスタマイズを許可する</td> <td>ユーザーが検索エンジンを変更できるかどうかを指定</td></tr> <tr> <td>追加の検索エンジンを構成する</td> <td>検索エンジンを5つまで追加可能。従業員はこれを削除できないが、いずれかを既定の検索エンジンに指定可能</td></tr> <tr> <td>スタートページのロックを無効にする</td> <td>ユーザーにスタートページのカスタマイズを許可するか否か</td></tr> <tr> <td>Microsoft Edgeで最初の実行時のWebページを開かない</td> <td>初めて Edgeを開くときに、最初の実行時のMicrosoft Webページを従業員に対して表示するかどうかを指定できます。</td></tr> <tr> <td>サイトをスタートにピン留めする際にライブタイル情報の収集を Microsoft Edgeに許可しない</td> <td>ユーザーがライブ タイルをスタート メニューにピン留めする際に提供するエクスペリエンスを改善するために、Microsoft Edgeがieonline.microsoft.comサービスからライブ タイルのメタデータを収集できるかどうかを指定できます。</td></tr> <tr> <td>既定の検索エンジンを設定する</td> <td>従業員の既定の検索エンジンを構成する</td></tr> <tr> <td>Internet ExplorerとMicrosoft Edgeの間でお気に入りの同期状態を維持する</td> <td>従業員がInternet ExplorerとMicrosoft Edgeの間でお気に入りを同期できるかどうかを指定できます。</td></tr></tbody></table></div>

<p>その他、Microsoft Edgeに指定可能な既存のグループポリシー設定については、以下のドキュメントをご参照くださいませ。</p>

<ul> <li><a title="Microsoft Edgeで利用可能なポリシー" href="https://technet.microsoft.com/ja-jp/itpro/microsoft-edge/available-policies" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer"><font size="3">Microsoft Edgeで利用可能なポリシー</font></a></li></ul>

<h2>その他</h2>

<p>Windows 10 Creators Updateについての細かな機能追加や修正、変更については、Microsoft Edge DevelopmentのChangelogで確認することができますので、Edgeの変化についてより詳しく知りたい方はぜひアクセスしてみてください。</p>

<ul> <li><a title="Microsoft Edge build 15063 changelog" href="https://developer.microsoft.com/en-us/microsoft-edge/platform/changelog/desktop/15063/?compareWith=14393" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer"><font size="3">Microsoft Edge build 15063 changelog</font></a></li></ul>

<p>また、Windows マシンをお持ちでない方は、<a title="Download virtual machines" href="https://developer.microsoft.com/en-us/microsoft-edge/tools/vms/" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer">ぜひ無償の検証用仮想マシン</a>や<a title="Announcing free Microsoft Edge testing in partnership with BrowserStack" href="https://blogs.windows.com/msedgedev/2017/03/30/free-edge-testing-browserstack/" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer">リモート環境</a>をお試しください。</p>
]]></content:encoded>
			</item>
		<item>
		<title>PCからIoTまで! Web技術を使ったユニバーサルWindowsプラットフォーム (UWP) アプリの開発</title>
		<link>/osamum_ms/20545/</link>
		<pubDate>Thu, 08 Sep 2016 01:00:45 +0000</pubDate>
		<dc:creator><![CDATA[物江 修]]></dc:creator>
				<category><![CDATA[最新動向]]></category>
		<category><![CDATA[Visual Studio]]></category>
		<category><![CDATA[Windows 10]]></category>
		<category><![CDATA[Windows Store]]></category>
		<category><![CDATA[uwp]]></category>
		<category><![CDATA[ハイブリッド]]></category>

		<guid isPermaLink="false">/?p=20545</guid>
		<description><![CDATA[連載： Web技術でアプリ開発2016 (3)「Web技術でアプリ開発2016」ということで、この記事ではPCからIoT機器まで、Windows 10プラットフォームであればデバイスを問わず動作する ユニバーサルWind...]]></description>
				<content:encoded><![CDATA[<div class="seriesmeta">連載： <a href="https://html5experts.jp/series/web-based-apps-2016/" class="series-391" title="Web技術でアプリ開発2016" data-wpel-link="internal">Web技術でアプリ開発2016</a> (3)</div><p>「Web技術でアプリ開発2016」ということで、この記事ではPCからIoT機器まで、Windows 10プラットフォームであればデバイスを問わず動作する ユニバーサルWindowsプラットフォーム (以下、UWPと記述) 上で動作するアプリについて紹介します。</p>

<p>このアプリはもちろんHTML、CSS + JavaScriptといったWeb開発者が慣れ親しんだ技術で開発することができます。また、インターネットでホストされているWebページをラップしてアプリ化することができます。</p>

<p>UWPをターゲットとしたアプリ開発では、新規開発はもちろん、既存のWeb資産を利用してアプリを開発し、さまざまな Windows 10デバイスに横断的に機能を提供することができます。</p>

<p>この記事では、UWPがどのようものであるか、UWP上で動作するアプリの開発方法と公開方法について紹介します。</p>

<h1>ユニバーサルWindowsプラットフォーム (UWP)アプリ とは</h1>

<p>Windows 10では、<a title="最新のWindows PC、ノートPC、タブレットのご紹介 | Microsoft Windows 10" href="https://www.microsoft.com/ja-jp/windows/view-all" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer"><strong>PC</strong></a>、<a title="Windows 10 Mobileにアップグレードする方法 - マイクロソフト" href="https://www.microsoft.com/ja-jp/windows/windows-10-mobile-upgrade" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer"><strong>モバイル</strong></a>、<a title="Xbox | Official Site" href="http://www.xbox.com/ja-JP/" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer"><strong>XBOX</strong></a>、<a title="Microsoft Surface Hub | コラボレーション デバイス" href="https://www.microsoft.com/microsoft-surface-hub/ja-jp" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer"><strong>Surface Hub</strong></a>、<a title="Microsoft HoloLens | Official Site" href="https://www.microsoft.com/microsoft-surface-hub/ja-jp" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer"><strong>HoloLens</strong></a>、<a title="Raspberry Pi 3とArduinoでのWindows 10 IoTアプリの開発 - Windows IoT" href="https://developer.microsoft.com/ja-jp/windows/iot" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer"><strong>IoT</strong></a> 機器といったデバイスファミリーで共通のカーネルを採用しており、これによりアプリケーションのプラットフォームが統合されました。</p>

<div style="width: 400px;margin: 0px auto">
  <a href="https://html5experts.jp/wp-content/uploads/2016/08/image7.png" data-wpel-link="internal"><img title="image" style="border-left-width: 0px;border-right-width: 0px;border-bottom-width: 0px;padding-top: 0px;padding-left: 0px;padding-right: 0px;border-top-width: 0px" border="0" alt="image" src="/wp-content/uploads/2016/08/image_thumb7.png"
      width="450" height="174"></a>
</div>

<p><br /></p>

<p>このWindows 10デバイスファミリーで統合されたプラットフォームをユニバーサルWindowsプラットフォーム (Universal Windows Platform : UWP)と呼びます。</p>

<div style="width: 500px;margin: 0px auto">
  <br>
  <a href="https://html5experts.jp/wp-content/uploads/2016/08/image8.png" data-wpel-link="internal"><img title="image" style="border-left-width: 0px;border-right-width: 0px;border-bottom-width: 0px;float: none;padding-top: 0px;padding-left: 0px;margin-left: auto;padding-right: 0px;border-top-width: 0px;margin-right: auto" border="0" alt="image" src="/wp-content/uploads/2016/08/image_thumb8.png"
      width="500" height="273">
    <br>
  </a>
  <br>
</div>

<p>UWP用のアプリは、OSのバージョンではなくデバイスファミリーを対象としますが、UWPのコアAPIはすべてのWindowsデバイス ファミリーに共通であり、アプリにコアAPIのみを使う場合は、そのアプリはいずれのWindows 10デバイスでも動作します。</p>

<p>つまり、固有のデバイスに縛られることなく、目的のデバイスファミリーをターゲットして再コンパイルすることでPCから IOT基板まで、さまざまな機器に配置し、動作させることができるのです。</p>

<p>Webの開発者からみればハードルが高そうなIoT機器用のアプリもHTML、CSS + JavaScriptで開発することができます。</p>

<p>たとえば、以下の記事では、Raspberry Piとディスプレイをマジックミラーの裏に配置し、洗面台の鏡の中に情報を表示するアプリを紹介していますが、この上表を表示するアプリはHTML、CSS + JavaScriptを使用したUWPアプリです。</p>

<ul>
  <li><a href="https://blogs.windows.com/msedgedev/2016/05/31/magic-mirror-hosted-web-app/#ZA4Bz3egXpR7RBJS.99" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer"><strong>Building an IoT Magic Mirror with Hosted Web Apps and Windows 10</strong></a> </li>
</ul>

<p>また逆に、拡張機能SDKにより特殊なデバイス用のアプリも開発することもできます。</p>

<h1>UWPアプリのメリット</h1>

<p>UWPアプリのメリットは、前述したようにデバイスファミリーを横断したアプリの開発が容易であるということもありますが、それ以外でも、複数の言語で開発することができることや、UWPが公開する豊富なAPIを直接使用できるということがあるでしょう。</p>

<p>UWPアプリのロジック部分はC#、Visual Basic、C、C++、JavaScriptといった開発言語で記述することができ、UI部分は XAML (C#、VB、C、C++)、DirectX (C、C++)と、HTML/CSS (JavaScript)で記述することができます。</p>

<div style="width: 600px;margin: 0px auto">
  <a href="https://html5experts.jp/wp-content/uploads/2016/09/image1.png" data-wpel-link="internal"><img title="image" style="border-left-width: 0px;border-right-width: 0px;border-bottom-width: 0px;padding-top: 0px;padding-left: 0px;padding-right: 0px;border-top-width: 0px" border="0" alt="image" src="/wp-content/uploads/2016/09/image_thumb1.png"
      width="600" height="338"></a>
</div>

<p><br /></p>

<p>UWPのリソースにアクセスするためのWindowsランタイム(WinRT) APIには、各言語ともWindows名前空間を空間を介して接続することができます。</p>

<p>WinRT APIは Windows 10の予定表や連絡先、タイルといったOSが持つソフト的なリソースからBluetoothやWi-Fi、USBといったハード的リソースへのアクセスなど、幅広く機能を提供します。そしてこれらのAPIはUWPでサポートされている言語であれば、言語を問わず利用することができます。</p>

<p>Windowsランタイムがアプリ向けに公開しているAPIのついての詳細は以下のドキュメントをご参照ください。</p>

<ul>
  <li><a title="WindowsランタイムアプリのWindows APIリファレンス - Windows app development" href="https://msdn.microsoft.com/ja-jp/library/windows/apps/br211377.aspx" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer"><strong>Windows ランタイム アプリのWindows APIリファレンス</strong></a> </li>
</ul>

<h1>開発環境</h1>

<p>UWPアプリの開発はWindows 10と<a title="Visual Studio - Microsoft Developer Tools" href="https://www.visualstudio.com/ja-jp/" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer">Visual Studio 2015</a>もしくは、<a title="Apache Cordova" href="https://cordova.apache.org/" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer">Apache Cordova</a>を使用して行うことができます。</p>

<h2>Visual Studio 2015とApache Cordovaの使い分け</h2>

<p>Visual Studio 2015では、それ単体によるUWPアプリの開発はもちろん、<a title="Visual Studio Tools for Apache Cordova" href="https://www.visualstudio.com/ja-jp/features/cordova-vs.aspx" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer"><strong>Visual Studio Tools for Apache Cordova</strong></a> を使用してiOS、Android、UWPアプリの開発が行えます。</p>

<p>つまり、Visual Studio 2015ではそれ単体とApache Cordovaのどちらかを使用してUWPアプリを開発することができますが、これは単に機能が重複しているということではなく、以下のように状況や目的に合わせて使い分けるためにあります。</p>

<div style="width: 600px;margin: 0px auto">
  <table cellspacing="0" cellpadding="2" width="600" border="1">
    <tbody>
      <tr>
        <td style="text-align: center;background-color: lightskyblue" valign="middle" width="200">開発環境</td>
        <td style="text-align: center;background-color: lightskyblue" valign="middle">用途</td>
      </tr>
      <tr>
        <td valign="middle" width="200">Visual Studio 単体</td>
        <td valign="middle">特殊デバイス向けの開発など、UWP固有の機能を使用した実装を行う場合</td>
      </tr>
      <tr>
        <td valign="middle" width="200">Apache Cordova</td>
        <td valign="middle">共通のソースで、UWP以外のiOSやAndroidにもアプリを提供する場合</td>
      </tr>
    </tbody>
  </table>
</div>

<p>なお、Visual Studio 2015は有償製品ですが、非営利目的やオープンソースソフトウェアの開発であれば、無償の<strong> </strong><a title="Visual Studio Community - Visual Studio" href="https://www.microsoft.com/ja-jp/dev/products/community.aspx" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer"><strong>Visual Studio Community</strong></a><strong>　</strong>を使用することができます。</p>

<p>Visual Studio Communityは、機能的にはVisual Studio Professionalと同等であり、クロスプラットフォーム開発をサポートしています。</p>

<h1>開発できるアプリの形式</h1>

<p>HTML、CSS + JavaScriptで開発できるUWPアプリの形式は、大まかにUI部分をクライアントサイドにインストールするパッケージ型と、ネットワークにホストされているコンテンツをラップしたホスト型の2つのタイプに大別されます。</p>

<div style="width: 500px;margin: 0px auto">
  <table cellspacing="0" cellpadding="2" width="500" border="1">
    <tbody>
      <tr>
        <td style="text-align: center;background-color: lightskyblue" valign="middle" width="150">アプリの型式</td>
        <td style="text-align: center;background-color: lightskyblue" valign="middle">状態</td>
      </tr>
      <tr>
        <td valign="middle" width="150">パッケージ型</td>
        <td valign="middle">UI部分をクライアントサイドにインストールするもの
          <br>一部 WebViewコントロールで覆ったものもプロジェクトテンプレート上はこれにあたる</td>
      </tr>
      <tr>
        <td valign="middle" width="150">ホスト型</td>
        <td valign="middle">ネットワークにホストされている
          <br>Webコンテンツをラップしたもの</td>
      </tr>
    </tbody>
  </table>
</div>

<p>一部をWebViewコントロールで覆ったものもVisual Studioのプロジェクトテンプレート上はパッケージ型に含まれます。</p>

<div style="width: 500px;margin: 0px auto">
  <a href="https://html5experts.jp/wp-content/uploads/2016/08/image9.png" data-wpel-link="internal"><img title="image" style="border-left-width: 0px;border-right-width: 0px;border-bottom-width: 0px;padding-top: 0px;padding-left: 0px;padding-right: 0px;border-top-width: 0px" border="0" alt="image" src="/wp-content/uploads/2016/08/image_thumb9.png"
      width="500" height="331"></a>
</div>

<p>パッケージ型、ホスト型アプリにはそれぞれ特徴とメリットがあります。</p>

<p>パッケージ型アプリは、動作に必要なリソースをクライアントサイドにインストールできるので、アプリの作りによっては、動作にサーバーサイドのリソースを必要としない完全にオフラインのアプリを作ることも可能です。</p>

<p>ホスト型のアプリの場合は、ネットワーク上に公開されているコンテンツを表示しているので、画面や機能を変更する際でも再インストールの必要はなく、常に最新の情報を提供することができます。また、Webサイト向けのコンテンツの開発と作業が一元化できます。
  <br>ホスト型のアプリはその性質上オンラインでの使用が大前提となりますが <a href="https://developers.google.com/web/progressive-web-apps/" target="_brank" data-wpel-link="external" rel="follow external noopener noreferrer"><strong>Progressive Web Apps</strong> </a>の実装が可能になればこういった制限も大幅に緩和され、パッケージ型よりもホスト型が選択されるケースが増えることでしょう。</p>

<div style="width: 300px;margin: 0px auto">
  <a href="https://html5experts.jp/wp-content/uploads/2016/08/image10.png" data-wpel-link="internal"><img title="image" style="border-left-width: 0px;border-right-width: 0px;border-bottom-width: 0px;padding-top: 0px;padding-left: 0px;padding-right: 0px;border-top-width: 0px" border="0" alt="image" src="/wp-content/uploads/2016/08/image_thumb10.png"
      width="400" height="302"></a>
</div>

<p><br />&nbsp;</p>

<p>パッケージ型のアプリはもちろん、ホスト型のアプリも、適切なセキュリティ設定を行うことにより、Windowsランタイム API にアクセスできます。</p>

<p>たとえば、以下の記事では、Webサイトに公開されているページに記述されているJavaScirptからNFCデバイスにアクセスする方法について紹介しています。</p>

<ul>
  <li><a title="UWPのHosted WebアプリからのNFCデバイスへのアクセス" href="https://blogs.msdn.microsoft.com/osamum/2016/06/02/uwp-%e3%81%ae-hosted-web-%e3%82%a2%e3%83%97%e3%83%aa%e3%81%8b%e3%82%89%e3%81%ae-nfc-デバイス%e3%81%b8%e3%81%ae%e3%82%a2%e3%82%af%e3%82%bb%e3%82%b9/" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer"><strong>UWPのHosted WebアプリからのNFCデバイスへのアクセス</strong></a></li>
</ul>

<h1>開発方法</h1>

<p>Visual Studio 2015に用意されたプロジェクトテンプレートを使用してプロジェクトを作成し、コーディングしていきます。</p>

<p>HTML、CSS + JavaScriptで開発するUWPアプリに用意されているプロジェクトテンプレートの種類は以下のとおりです。(2016年9月現在)</p>

<div style="width: 600px;margin: 0px auto">
  <table cellspacing="0" cellpadding="2" width="600" border="1">
    <tbody>
      <tr>
        <td style="text-align: center;background-color: lightskyblue" valign="middle" width="230">プロジェクトテンプレートの種類</td>
        <td style="text-align: center;background-color: lightskyblue" valign="middle">説明</td>
      </tr>
      <tr>
        <td valign="middle" width="230">空白のアプリ</td>
        <td valign="middle">事前定義されたコントロールやレイアウトのないユニバーサルWindowsアプリのためのプロジェクト。コンテンツセキュリティポリシー(CSP)を適用します。すべてのユニバーサルWindows APIに直接アクセスします。</td>
      </tr>
      <tr>
        <td valign="middle" width="230">WinJSアプリ</td>
        <td valign="middle">WinJS を使用しているユニバーサルWindowsアプリのプロジェクトです。すべてのユニバーサルWindows APIに直接アクセスできます。</td>
      </tr>
      <tr>
        <td valign="middle" width="230">ホストされるWebアプリ</td>
        <td valign="middle">リモートの開始ページを含むユニバーサルWindowsアプリのプロジェクトです。すべてのユニバーサル Windows APIにアクセスするには、URLをアプリケーション コンテンツURI規則に追加する必要があります。</td>
      </tr>
      <tr>
        <td valign="middle" width="230">空のアプリ-Webコンテキスト</td>
        <td valign="middle">ローカルコンテンツをWebからのものとして処理します。既定のアプリケーションコンテンツポリシー(CSP)はありません。ユニバーサルWindows APIにアクセスするには、URIがアプリケーション コンテンツURI規則で宣言されている必要があります。</td>
      </tr>
    </tbody>
  </table>
</div>

<p>開発を開始するための具体的な手順について、以下のチュートリアルを参照してください。</p>

<ul>
  <li><a title="Hello, worldアプリを作成する (JS)" href="https://msdn.microsoft.com/windows/uwp/get-started/create-a-hello-world-app-js-universal" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer"><strong>JavaScript とHTMLのチュートリアル</strong></a>
    <li><a title="Hello, worldアプリを作成する (XAML)" href="https://msdn.microsoft.com/windows/uwp/get-started/create-a-hello-world-app-xaml-universal" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer"><strong>C#とXAMLのチュートリアル</strong></a>
      <li><a title="C++ を使った&quot;hello world&quot;アプリの作成(Windows 10)" href="https://msdn.microsoft.com//windows/uwp/get-started/create-a-basic-windows-10-app-in-cpp" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer"><strong>C++とXAMLのチュートリアル</strong></a></li>
</ul>

<h1>配布方法</h1>

<p>UWPアプリの公開は、一般的にはWindowsストアを介して行われます。</p>

<div style="width: 200px;margin: 0px auto">
  <a href="https://html5experts.jp/wp-content/uploads/2016/09/image2.png" data-wpel-link="internal"><img title="image" style="border-left-width: 0px;border-right-width: 0px;border-bottom-width: 0px;padding-top: 0px;padding-left: 0px;padding-right: 0px;border-top-width: 0px" border="0" alt="image" src="/wp-content/uploads/2016/09/image_thumb2.png"
      width="200"></a>
</div>

<p><br /></p>

<p>Windowsストアにアプリを公開するには、Windowsデベロッパーセンターのダッシュボードから、<a title="UWPアプリのパッケージ化" href="https://msdn.microsoft.com/ja-jp/windows/uwp/packaging/packaging-uwp-apps" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer">appx形式にパッケージングした</a>アプリを提出します。Windowsストア側で安全性を含め様々な審査が実施され、合格すると公開されます。</p>

<p>UWPアプリをWindowsストアに公開するまでの、開発者アカウントの作成からパッケージの提出、支払いの受け取り (販売した場合) までの具体的な方法については以下のドキュメントを参照してください。</p>

<ul>
  <li><a title="Windowsアプリの公開 | MSDN" href="https://msdn.microsoft.com/ja-jp/windows/uwp/publish/index" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer"><strong>Windowsアプリの公開</strong></a></li>
</ul>

<p>会社組織のみの利用を想定した場合など、Windowsストアで公開を希望しない場合にはサイドローディングという方法を使用して、管理化にあるデバイスにUWPアプリを直接インストールすることができます。</p>

<p>サイドローディングの具体的な方法については以下のドキュメントを参照してください。</p>

<ul>
  <li><a title="DISMを使ったアプリのサイドローディング" href="https://msdn.microsoft.com/ja-jp/library/windows/hardware/dn938326(v=vs.85).aspx#UnderstandingConcepts" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer"><strong>DISM を使ったアプリのサイドローディング</strong></a></li>
</ul>

<h1>収益モデル</h1>

<p>Windowsストアでは提出したアプリを販売することができます。また、アプリ内の課金も可能です。開発者Windowsストアが用意するさまざまな仕組を利用して収益を上げることができます。</p>

<p>現在Windowsストアで収益を上げるには、以下の3つの方法があります。</p>

<ol>
  <li><strong>アプリそのものの販売</strong>
    <li><strong>アプリ内課金(In-App purchase : IAP)</strong>
      <li><strong>アプリ内広告</strong></li>
</ol>

<p>これら収益に関する詳しい内容は、以下のドキュメントを参照してください。</p>

<ul>
  <li><a title="アプリの価格と使用可能状況の設定" href="https://msdn.microsoft.com/ja-jp/windows/uwp/publish/set-app-pricing-and-availability" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer"><strong>アプリの価格と使用可能状況の設定</strong></a>
    <li><a title="IAPの申請" href="https://msdn.microsoft.com/ja-jp/windows/uwp/publish/iap-submissions" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer"><strong>IAPの申請</strong></a>
      <li><a title="広告による収益獲得" href="https://msdn.microsoft.com/ja-jp/windows/uwp/publish/monetize-with-ads" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer"><strong>広告による収益獲得</strong></a></li>
</ul>

<h1>まとめ</h1>

<p>この記事ではWindows 10から採用されたユニバーサルWindowsプラットフォーム用のアプリ(UWPアプリ) について紹介しました。</p>

<p>UWPアプリは Window 10デバイスファミリーに対し横断的にアプリを開発できます。そのためPC、スマートフォンはもちろん、Web開発者からは技術的に遠いIoTデバイス向けのアプリも使い慣れた HTML,CSS + JavaScriptで開発することができます。</p>

<p>Continuumにも対応しているため、対応スマートフォンをテレビやディスプレイに接続した際にユーザーにデスクトップエクスペリエンスを提供することもできます。</p>

<div style="width: 500px;margin: 0px auto">
  <a href="https://html5experts.jp/wp-content/uploads/2016/09/image3.png" data-wpel-link="internal"><img title="image" style="border-left-width: 0px;border-right-width: 0px;border-bottom-width: 0px;float: none;padding-top: 0px;padding-left: 0px;margin-left: auto;padding-right: 0px;border-top-width: 0px;margin-right: auto" border="0" alt="image" src="/wp-content/uploads/2016/09/image_thumb3.png"
      width="500" height="250"></a>
</div>

<p>Webブラウザー上で動作するアプリはもちろん、他のハイブリット アプリ用フレームワーク向けのコンテンツでも、HTML、CSS + JavaScriptを使用して作られているのであれば、特別なことをしていない限りはUWPアプリへの移植はそれほど難しくはありません。</p>

<p>新規での開発はもちろん、既存のアプリの新たな市場獲得のための移植先としても検討してもいいかもしれません。</p>

<p>UWP開発についてのより詳しい情報は以下をぜひご覧ください。</p>

<ul>
  <li><a title="ユニバーサルWindowsプラットフォーム (UWP) 向けアプリの開発" href="https://msdn.microsoft.com/ja-jp/library/dn975273.aspx" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer"><strong>ユニバーサル Windowsプラットフォーム(UWP)向けアプリの開発</strong></a></li>
  <li><a title="ユニバーサルWindowsアプリの開発 - Windowsアプリの開発" href="https://developer.microsoft.com/ja-jp/windows/develop" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer"><strong>ユニバーサル Windowsアプリの開発 &#8211; Windowsアプリの開発</strong></a></li>
  <li><a title="ユニバーサルWindowsプラットフォーム アプリ(UWP)のデザイン - Windowsアプリ開発" href="https://developer.microsoft.com/ja-jp/windows/design" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer"><strong>ユニバーサルWindows プラットフォームアプリ(UWP)のデザイン &#8211; Windowsアプリ開発</strong></a></li>
</ul>
]]></content:encoded>
		
		<series:name><![CDATA[Web技術でアプリ開発2016]]></series:name>
	</item>
		<item>
		<title>Microsoft EdgeのUI機能が強化！ーWindows 10 Anniversary Updateにおける新機能一挙解説</title>
		<link>/osamum_ms/20244/</link>
		<comments>/osamum_ms/20244/#respond</comments>
		<pubDate>Wed, 03 Aug 2016 01:09:34 +0000</pubDate>
		<dc:creator><![CDATA[物江 修]]></dc:creator>
				<category><![CDATA[最新動向]]></category>
		<category><![CDATA[Microsoft Edge]]></category>
		<category><![CDATA[Windows 10]]></category>
		<category><![CDATA[extension]]></category>

		<guid isPermaLink="false">/?p=20244</guid>
		<description><![CDATA[Windows 10 が公開されてちょうど一年、Windows 10 の無償アップグレード期間が終了したのと入れ替わるように本日 (2016/8/3 日本時間) Windows 10 Anniversary Update...]]></description>
				<content:encoded><![CDATA[<p>Windows 10 が公開されてちょうど一年、Windows 10 の無償アップグレード期間が終了したのと入れ替わるように本日 (2016/8/3 日本時間) Windows 10 Anniversary Update が公開されました。</p>

<p>この Windows 10 Anniversary Update では、Windows 10 が発表された際の様々なビジョンのいくつかが実装され、さらにその当時は想像だにできなかった&nbsp; <a title="Windows Subsystem for Linux Overview" href="https://blogs.msdn.microsoft.com/wsl/2016/04/22/windows-subsystem-for-linux-overview/" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer">Windows Subsystem for Linux</a> (WSL) といったようなまったく新しい機能も搭載されています。</p>

<p>Windows 10 から搭載された新しい Web ブラウザーである Edge にも、当初の計画にあった新しい拡張 (エクステンション)モデルの実装や、Windows フィードバック、<a title="Microsoft Edge Developer　&ndash; Welcome to the Windows developer feedback site!" href="https://wpdev.uservoice.com/forums/257854-microsoft-edge-developer" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer">Developer FeedBack</a> (旧 Edge Suggestion Box) に寄せられたフィードバックや提案をもとにした新しい機能が実装されています。</p>

<p>今回の記事では Windows 10 Anniversary Update の新機能、とくにユーザーが直接対話するデスクトップ UI の新機能と、新しく追加された Edge 関連のグループポリシーの設定について紹介します。</p>

<h1>Microsoft Edge のデスクトップ UI 機能の強化</h1>

<p>Windows 10 がリリースされてからこれまで、Edge にもたゆまず機能強化が行われてきましたが、その内容はパフォーマンスの向上であったり、サポートする API の数を増やすであるとか、どちらかというと開発者向けのものが多かった印象があります。</p>

<p>これら機能は UI を持たないため、開発者以外の多くのユーザーは Edge の機能向上の進捗を肌感として感じれなかったかもしれません。</p>

<p>しかし、Windows 10 Anniversary Update での Edge では、誰しもがアクセス可能なデスクトップ UI に複数の新機能を搭載しています。</p>

<p>この機能は、おおまかに分類すると以下の 4 つに別けられます。</p>

<ol> <li><a style="font-weight: bold" href="#h_nav" data-wpel-link="internal">ナビゲーション</a>  <li><a style="font-weight: bold" href="#h_fov" data-wpel-link="internal">お気に入り</a>  <li><a style="font-weight: bold" href="#h_dl" data-wpel-link="internal">ダウンロード</a>  <li><a style="font-weight: bold" href="#h_context" data-wpel-link="internal">コンテキストメニュー</a></li></ol>

<p>以降は、上記 4 つの項目について、具体的にどのどのような機能が追加されたのかを紹介していきます。</p>

<h1 id="h_nav">ナビゲーション</h1>

<p>Web ブラウジングにおける “ナビゲーション” はページを遷移させるための操作や、その動作そのものを指します。</p>

<p>このナビゲーション関連では以下の機能が追加されています。</p>

<h3>右クリックでのナビゲーション履歴表示</h3>

<p>Edge のナビゲーションバーの左側にある 戻るボタン/進むボタン上で、マウスの右ボタンをクリックすることで、それまでの履歴と現在の位置(履歴内のどこをブラウズしているか)が表示され、クリックすることでそのページに遷移できるようになりました。</p>

<p>従来の 戻る/進む ボタンでは、ブラウザーを起動してからの履歴に対し、ひとつずつしか前後に遷移できませんでしたが、この機能を使用すると履歴の任意の位置に直接移動できます。</p>

<div style="width: 500px;margin: 0px auto"><a href="https://html5experts.jp/wp-content/uploads/2016/08/context_history.png" data-wpel-link="internal"><img title="context_history" style="border-left-width: 0px;border-right-width: 0px;border-bottom-width: 0px;padding-top: 0px;padding-left: 0px;padding-right: 0px;border-top-width: 0px" border="0" alt="context_history" src="/wp-content/uploads/2016/08/context_history_thumb.png" width="500"></a></div>

<p><br />&nbsp;</p>

<h3>貼り付けて移動/検索</h3>

<p>クリップボードにコピーした URL のページを Edge で表示させる場合、ナビゲーションバーに一度 URL を貼り付けてからキーボードの [ Enter] キーを押下する必要がありました。</p>

<p>また同様に、クリップボードにコピーしたキーワードで検索を行う場合には、 ナビゲーションバーに一度 キーワードを貼り付けてからキーボードの [ Enter] キーを押下する必要がありました。</p>

<p>Windows 10 Anniversary Update からの Edge では、ナビゲーションバー上でマウスの右ボタンをクリックした際に表示されるコンテキストメニューに [貼り付けて移動] もしくは [貼り付けて検索] というメニューが追加されており、このメニューを選択することで [Enter] キーを押下しなくてもクリップボードにある URL への移動、あるいはクリップボードにあるキーワードで検索を行うことができます。なお、「移動」か「検索」かは、クリップボードの内容により自動的に判断されます。</p>

<div style="width: 350px;margin: 0px auto"><a href="https://html5experts.jp/wp-content/uploads/2016/08/paste_and_go.png" data-wpel-link="internal"><img title="paste_and_go" style="border-left-width: 0px;border-right-width: 0px;border-bottom-width: 0px;float: none;padding-top: 0px;padding-left: 0px;margin-left: auto;padding-right: 0px;border-top-width: 0px;margin-right: auto" border="0" alt="paste_and_go" src="/wp-content/uploads/2016/08/paste_and_go_thumb.png" width="350"></a>  <div style="text-align: center">(クリップボードの中身が URL の場合)</div></div>

<p><br>&nbsp;</p>

<div style="width: 350px;margin: 0px auto"><a href="https://html5experts.jp/wp-content/uploads/2016/08/paste_and_find.png" data-wpel-link="internal"><img title="paste_and_find" style="border-left-width: 0px;border-right-width: 0px;border-bottom-width: 0px;float: none;padding-top: 0px;padding-left: 0px;margin-left: auto;padding-right: 0px;border-top-width: 0px;margin-right: auto" border="0" alt="paste_and_find" src="/wp-content/uploads/2016/08/paste_and_find_thumb.png" width="350"></a>  <div style="text-align: center">(クリップボードの中身が URL ではない場合)</div></div>

<p><br />&nbsp;</p>

<h3>スワイプによるナビゲーション</h3>

<p>スワイプによるナビゲーションに対応しました。</p>

<p>Windows Phone や タッチ対応のモニタの PC で Edge を使用する場合、画面を左/右にスワイプすることで一度遷移した URL について遷移することができます。</p>

<p>左にスワイプするとひとつ前に戻り、右にスワイプするとひとつ進みます。</p>

<h1 id="h_fov">お気に入り</h1>

<p>Edge において「お気に入り」 (favorite) はユーザーが任意の URL を Web ブラウザーに登録しておく機能です。</p>

<p>お気に入り関連では以下の機能が追加されています。</p>

<h3>ピン留め</h3>

<p>ピン留めは Internet Explorer 8 からサポートされた機能で、当時はピン留め対応した Web サイトのショートカット アイコンとナビゲーションメニューを Windows のタスクバーに登録することができました。</p>

<p>Windows 10 Anniversary Update で提供される Edge には、ショートカットアイコンの登録場所や提供される機能は異なりますが、ピン留め機能が復活しています。</p>

<p>また、Web サイト側での特別な設定は不要となっています。</p>

<p>Edge のピン留め機能を使用するには、任意のページを表示したページのタブの上で右クリックし、表示されたコンテキストメニューから [ピン留めする] メニューを選択します。</p>

<div style="width: 200px;margin: 0px auto"><a href="https://html5experts.jp/wp-content/uploads/2016/08/Pinned-tab.png" data-wpel-link="internal"><img title="Pinned tab" style="border-left-width: 0px;border-right-width: 0px;border-bottom-width: 0px;float: none;padding-top: 0px;padding-left: 0px;margin-left: auto;padding-right: 0px;border-top-width: 0px;margin-right: auto" border="0" alt="Pinned tab" src="/wp-content/uploads/2016/08/Pinned-tab_thumb.png" width="200"></a> </div>

<p>これによりタブの左端にページがピン留めされ、Edge が起動されると同時にページがロードされるようになります。</p>

<div style="width: 200px;margin: 0px auto"><a href="https://html5experts.jp/wp-content/uploads/2016/08/image.png" data-wpel-link="internal"><img title="image" style="border-left-width: 0px;border-right-width: 0px;border-bottom-width: 0px;float: none;padding-top: 0px;padding-left: 0px;margin-left: auto;padding-right: 0px;border-top-width: 0px;margin-right: auto" border="0" alt="image" src="/wp-content/uploads/2016/08/image_thumb.png" width="200"></a> </div>

<p><br />&nbsp;</p>

<h3>[お気に入り] メニューのツリー表示と並べ替え機能</h3>

<p>これまで Edge の [お気に入り] メニューでは、同一階層にあるリンクのみが一覧で表示されていましたが、Windows 10 Anniversary Update で提供される Edge ではツリー表示されるようになりました。</p>

<div style="width: 250px;margin: 0px auto"><a href="https://html5experts.jp/wp-content/uploads/2016/08/favorit_tree.png" data-wpel-link="internal"><img title="favorit_tree" style="border-left-width: 0px;border-right-width: 0px;border-bottom-width: 0px;float: none;padding-top: 0px;padding-left: 0px;margin-left: auto;padding-right: 0px;border-top-width: 0px;margin-right: auto" border="0" alt="favorit_tree" src="/wp-content/uploads/2016/08/favorit_tree_thumb.png" width="250" height="387"></a> </div>

<p>また、名前で並べ替えも出来るようになっています。</p>

<div style="width: 250px;margin: 0px auto"><a href="https://html5experts.jp/wp-content/uploads/2016/08/name_sort.png" data-wpel-link="internal"><img title="name_sort" style="border-left-width: 0px;border-right-width: 0px;border-bottom-width: 0px;float: none;padding-top: 0px;padding-left: 0px;margin-left: auto;padding-right: 0px;border-top-width: 0px;margin-right: auto" border="0" alt="name_sort" src="/wp-content/uploads/2016/08/name_sort_thumb.png" width="300" height="264"></a> </div>

<p><br />&nbsp;</p>

<h3>[お気に入り] のインポート元の表示</h3>

<p>Edge では他の Web ブラウザーから [お気に入り] をインポートできますが、インポート元の Web ブラウザーの名前がついたフォルダが作成され、どの Web ブラウザーからインポートされたのかわかるようになりました。</p>

<div style="width: 250px;margin: 0px auto"><a href="https://html5experts.jp/wp-content/uploads/2016/08/Inport.png" data-wpel-link="internal"><img title="Inport" style="border-left-width: 0px;border-right-width: 0px;border-bottom-width: 0px;float: none;padding-top: 0px;padding-left: 0px;margin-left: auto;padding-right: 0px;border-top-width: 0px;margin-right: auto" border="0" alt="Inport" src="/wp-content/uploads/2016/08/Inport_thumb.png" width="250" height="84"></a> </div>

<p><br />&nbsp;</p>

<h3>お気に入りバーのメニュー追加</h3>

<p>お気に入りバー上にショートカットの表示で、アイコンだけを表示できる設定が追加されました。</p>

<div style="width: 250px;margin: 0px auto"><a href="https://html5experts.jp/wp-content/uploads/2016/08/favorite_setting.png" data-wpel-link="internal"><img title="favorite_setting" style="border-left-width: 0px;border-right-width: 0px;border-bottom-width: 0px;float: none;padding-top: 0px;padding-left: 0px;margin-left: auto;padding-right: 0px;border-top-width: 0px;margin-right: auto" border="0" alt="favorite_setting" src="/wp-content/uploads/2016/08/favorite_setting_thumb.png" width="250"></a></div>

<p><br></p>

<p>また、これまでお気に入りバーにはコンテキストメニューは設定されていませんでしたが、今回のアップデートで [新しいフォルダの作成] と [アイコンのみ表示する] メニューが追加されました。</p>

<div style="width: 600px;margin: 0px auto"><a href="https://html5experts.jp/wp-content/uploads/2016/08/FavoritesBar.png" data-wpel-link="internal"><img title="FavoritesBar" style="border-left-width: 0px;border-right-width: 0px;border-bottom-width: 0px;float: none;padding-top: 0px;padding-left: 0px;margin-left: auto;padding-right: 0px;border-top-width: 0px;margin-right: auto" border="0" alt="FavoritesBar" src="/wp-content/uploads/2016/08/FavoritesBar_thumb.png" width="600" height="98"></a> </div>

<h1 id="h_dl">ダウンロード</h1>

<p>Edge のダウンロード機能については、保存場所や保存のさいのアクションについて、以下のような機能が追加されています。</p>

<h3>保存先フォルダの指定</h3>

<p>これまでの Edge では、既定のダウンロード先のフォルダは %user%\ダウンロード となっており、これを変更することは出来ませんでしたが、今回のアップデートでは [詳細設定] メニューからこれを変更できるようになりました。</p>

<div style="width: 250px;margin: 0px auto"><a href="https://html5experts.jp/wp-content/uploads/2016/08/image1.png" data-wpel-link="internal"><img title="image" style="border-left-width: 0px;border-right-width: 0px;border-bottom-width: 0px;float: none;padding-top: 0px;padding-left: 0px;margin-left: auto;padding-right: 0px;border-top-width: 0px;margin-right: auto" border="0" alt="image" src="/wp-content/uploads/2016/08/image_thumb1.png" width="300" height="526"></a> </div>

<p><br />&nbsp;</p>

<h3>ダウンロード先の指定</h3>

<p>これまで、Edge ではファイルをダウンロードする際に保存先の指定を任意で行うことはできませんでしたが、今回のアップデートでは、ダウンロード時に表示されるダイアログボックスに [名前を付けて保存] ボタンが追加され、保存先の指定や、保存する際のファイル名の指定ができるようになりました。</p>

<div style="width: 600px;margin: 0px auto"><a href="https://html5experts.jp/wp-content/uploads/2016/08/dl_dialog.png" data-wpel-link="internal"><img title="dl_dialog" style="border-left-width: 0px;border-right-width: 0px;border-bottom-width: 0px;float: none;padding-top: 0px;padding-left: 0px;margin-left: auto;padding-right: 0px;border-top-width: 0px;margin-right: auto" border="0" alt="dl_dialog" src="/wp-content/uploads/2016/08/dl_dialog_thumb.png" width="600"></a> </div>

<p><br />&nbsp;</p>

<h3>ダウンロード中に Edge 終了の際の警告</h3>

<p>ファイルをダウンロード中に Edge をクローズ場合、警告メッセージが表示されるようになりました。</p>

<h1>コンテキストメニューへの機能追加と変更</h1>

<p>Web ページを表示する部分で、右クリックした際に表示されるコンテキストメニューにも機能が追加されています。</p>

<h3>Cortana との連携</h3>

<p>Edge に Cortana との連携機能が実装されました。</p>

<p>文字列、もしくは画像を選択し、マウスの右クリックメニューから [Cortana に質問] を選択すると、選択された内容に関連する情報を判断して検索を行い結果を列挙します。</p>

<div style="width: 150px;margin: 0px auto"><a href="https://html5experts.jp/wp-content/uploads/2016/08/Cortana.png" data-wpel-link="internal"><img title="Cortana" style="border-left-width: 0px;border-right-width: 0px;border-bottom-width: 0px;padding-top: 0px;padding-left: 0px;padding-right: 0px;border-top-width: 0px" border="0" alt="Cortana" src="/wp-content/uploads/2016/08/Cortana_thumb.png" width="150"></a></div>

<p><br>&nbsp;</p>

<p>たとえば、以下のように画像を問い合わせた場合、Cortana は関連する情報と類似する画像を調査して列挙します。</p>

<div style="width: 500px;margin: 0px auto"><a href="https://html5experts.jp/wp-content/uploads/2016/08/image2.png" data-wpel-link="internal"><img title="image" style="border-left-width: 0px;border-right-width: 0px;border-bottom-width: 0px;float: none;padding-top: 0px;padding-left: 0px;margin-left: auto;padding-right: 0px;border-top-width: 0px;margin-right: auto" border="0" alt="image" src="/wp-content/uploads/2016/08/image_thumb2.png" width="500"></a></div>

<p>&nbsp;</p>

<h3>開発者用メニューの表示タイミング</h3>

<p>これまでの Edge では、表示されている Web ページ上での右クリックメニューに [要素の検査] と [ソースの表示] という開発者向けのメニューが、初期状態から表示されるようになっていました。</p>

<p>今回のアップデートでは、初期状態ではこれら開発者向けのメニューは表示されず、F12 開発者ツールが起動されてからはじめて表示されるようになっています。</p>

<p>&nbsp;</p>

<p>ここまで Windows 10 Anniversary Update で追加される Edge の新機能について紹介してきました。</p>

<p>Edge の新機能については、かねてからのロードマップと、ユーザーから寄せられたフィードバックにもとづき実装しています。</p>

<p>しかしながら、期待していた機能が実装されていなかった、ということもあるでしょう。そういった場合には Edge に拡張インストールし、昨日を追加することでご要望を満たすことができるかもしれません。</p>

<h1>拡張 (エクステンション) による Edge の機能強化</h1>

<p>Windows 10 Anniversary Update の Edge では、拡張がサポートされました。</p>

<p>拡張とは、外部で作られたプログラムで、Edge にプラグインすることで Edge の機能を文字どおり拡張します。</p>

<p>Edge の拡張は Windows ストアから入手することができ、すでに Ad ブロックやマウスジェスチャー、翻訳等、さまざまな機能を提供する拡張が用意されています。</p>

<h3>拡張の入手と Edge へのインストール</h3>

<p>拡張の具体的な入手とインストール方法は以下のとおりです。</p>

<ol> <li>Edge のツールバー上の&nbsp; […] アイコンをクリックして [拡張機能] メニューをクリックします。  <div style="width: 250px;margin: 0px auto"><a href="https://html5experts.jp/wp-content/uploads/2016/08/image3.png" data-wpel-link="internal"><img title="image" style="border-left-width: 0px;border-right-width: 0px;border-bottom-width: 0px;padding-top: 0px;padding-left: 0px;padding-right: 0px;border-top-width: 0px" border="0" alt="image" src="/wp-content/uploads/2016/08/image_thumb3.png" width="250"></a> </div><br>&nbsp; <li>[拡張]パネルが表示されるので [ストアから拡張機能を取得する] リンクをクリックします。  <div style="width: 250px;margin: 0px auto"><a href="https://html5experts.jp/wp-content/uploads/2016/08/image4.png" data-wpel-link="internal"><img title="image" style="border-left-width: 0px;border-right-width: 0px;border-bottom-width: 0px;padding-top: 0px;padding-left: 0px;padding-right: 0px;border-top-width: 0px" border="0" alt="image" src="/wp-content/uploads/2016/08/image_thumb4.png" width="250"></a> </div><br>&nbsp; <li>Windows ストアの 「Microsoft Edge の拡張機能」 画面が開くので任意の拡張のアイコンをクリックします。  <div style="width: 500px;margin: 0px auto"><a href="https://html5experts.jp/wp-content/uploads/2016/08/ExtensionList.png" data-wpel-link="internal"><img title="ExtensionList" style="border-left-width: 0px;border-right-width: 0px;border-bottom-width: 0px;padding-top: 0px;padding-left: 0px;padding-right: 0px;border-top-width: 0px" border="0" alt="ExtensionList" src="/wp-content/uploads/2016/08/ExtensionList_thumb.png" width="500" height="383"></a> </div><br>&nbsp; <li>選択した拡張の説明画面に遷移するので [無料] 、もしくは金額の書かれた(※有料の拡張の場合) ボタンをクリックします。  <div style="width: 250px;margin: 0px auto"><a href="https://html5experts.jp/wp-content/uploads/2016/08/image5.png" data-wpel-link="internal"><img title="image" style="border-left-width: 0px;border-right-width: 0px;border-bottom-width: 0px;padding-top: 0px;padding-left: 0px;padding-right: 0px;border-top-width: 0px" border="0" alt="image" src="/wp-content/uploads/2016/08/image_thumb5.png" width="250"></a></div></li></ol>

<p>以上の手順で拡張のダウンロードとインストールが行われます。</p>

<h3>拡張の設定とアンインストール</h3>

<p>Edge にインストールした拡張のアンインストールやオプション設定は、Edge の [拡張機能] メニューで行います。</p>

<p>具体的な手順は以下のとおりです。</p>

<ol> <li>Edge のツールバー上の&nbsp; […] アイコンをクリックして [拡張機能] メニューをクリックします。  <li>[拡張]パネルが表示され、インストール済の拡張のリストが表示されるので、任意の拡張をクリックします。  <li>拡張の詳細設定画面が表示されるので以下から目的の操作を行います。  <ul> <li>拡張を有効、もしくは無効に &#8211;&nbsp; トグルボタンを操作  <li>拡張のオプション設定を行う – [オプション] ボタンをクリック  <li>拡張をアンインストールする – [アンインストール] ボタンをクリック </li></ul> <div style="width: 250px;margin: 0px auto"><a href="https://html5experts.jp/wp-content/uploads/2016/08/image6.png" data-wpel-link="internal"><img title="image" style="border-left-width: 0px;border-right-width: 0px;border-bottom-width: 0px;padding-top: 0px;padding-left: 0px;padding-right: 0px;border-top-width: 0px" border="0" alt="image" src="/wp-content/uploads/2016/08/image_thumb6.png" width="250"></a></div></li></ol>

<p><br>&nbsp;</p>

<p>Edge への拡張のインストール/アンインストール方法は以上です。</p>

<p>Edge 用の拡張を自分で作成する方法については<a title="ゼロからはじめる Microsoft Edge 用の拡張の作り方" href="https://blogs.msdn.microsoft.com/osamum/2016/07/05/how-to-make-extension-for-msedge/" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer">以下の記事</a>で紹介していますので、興味のある方はぜひご覧ください。</p>

<ul> <li><a title="ゼロからはじめる Microsoft Edge 用の拡張の作り方" href="https://blogs.msdn.microsoft.com/osamum/2016/07/05/how-to-make-extension-for-msedge/" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer"><strong>ゼロからはじめる Microsoft Edge 用の拡張の作り方</strong></a></li></ul>

<p>&nbsp;</p>

<h1>Windows 10 Anniversary Update で追加される Edge のグループポリシー設定</h1>

<p>Windows 10 Anniversary Update では Edge のグループポリシーで設定できる内容も追加が行われています。</p>

<p>グループポリシーとは、IT 管理者が管理対象の使用者に対してさまざまな設定を一括で行うための機能です。</p>

<p>従来から Edge では、以下の内容について IT 管理者がグループポリシーを用いて Windows ドメイン ユーザーの使用する Edge を管理することができます。</p>

<table cellspacing="0" cellpadding="2" border="1"> <tbody> <tr> <td style="color: white;text-align: center;background-color: navy" valign="top" width="50%">設定</td> <td style="color: white;text-align: center;background-color: navy" valign="top" width="50%">説明</td></tr> <tr> <td valign="top" width="50%">オートフィルを無効にする</td> <td valign="top" width="50%">Edge の使用中にフォームのフィールドにオートフィルで自動入力できるかどうか</td></tr> <tr> <td valign="top" width="50%">開発者ツールを無効にする</td> <td valign="top" width="50%">F12開発者ツールの使用を許可するかどうか</td></tr> <tr> <td valign="top" width="50%">トラッキング拒否ヘッダーの送信を従業員に許可する</td> <td valign="top" width="50%">トラッキング情報が要求される Web サイトに従業員がトラッキング拒否ヘッダーを送信を許可するかどうか</td></tr> <tr> <td valign="top" width="50%">InPrivate ブラウズを無効にする</td> <td valign="top" width="50%">InPrivate ブラウズの使用の有無</td></tr> <tr> <td valign="top" width="50%">パスワードマネージャーを無効にする</td> <td valign="top" width="50%">パスワードマネージャーを使用してパスワードのローカル保存を許可するかどうか</td></tr> <tr> <td valign="top" width="50%">ポップアップブロックを無効にする</td> <td valign="top" width="50%">ポップアップブロック機能を使用可とするかどうか</td></tr> <tr> <td valign="top" width="50%">アドレスバーの検索候補を無効にする</td> <td valign="top" width="50%">アドレスバーに検索候補を表示するかどうか</td></tr> <tr> <td valign="top" width="50%">SmartScreen フィルターを無効にする</td> <td valign="top" width="50%">SmartScreen フィルターを有効にするかどうか</td></tr> <tr> <td valign="top" width="50%">Open a new tab with an empty tab ([新しいタブ]ページでのWebコンテンツの許可)</td> <td valign="top" width="50%">新しいタブを開いたときに表示するページの種類を構成</td></tr> <tr> <td valign="top" width="50%">Cookie を構成する</td> <td valign="top" width="50%">Cookie の扱いを構成</td></tr> <tr> <td valign="top" width="50%">エンタープライズモードサイト一覧を構成する</td> <td valign="top" width="50%">エンタープライズ モードとエンタープライズ モード サイト一覧を使用するかどうかを構成</td></tr> <tr> <td valign="top" width="50%">お気に入りを構成する</td> <td valign="top" width="50%">ユーザーに表示される既定のお気に入りを構成できます</td></tr> <tr> <td valign="top" width="50%">WebRTC による LocalHost IP アドレスの共有をしない</td> <td valign="top" width="50%">WebRTC プロトコルを使用した通話中にユーザーの LocalHost IP アドレスが表示されるかどうかを指定</td></tr> <tr> <td valign="top" width="50%">企業のホームページを構成する</td> <td valign="top" width="50%">ドメインに参加しているデバイス用に企業のホーム ページを構成</td></tr> <tr> <td valign="top" width="50%">SmartScreen フィルター機能の警告の上書きを許可しない</td> <td valign="top" width="50%">有害である可能性のある Web サイトに関する SmartScreen フィルター機能の警告を従業員が上書きできるかどうかを指定</td></tr> <tr> <td valign="top" width="50%">確認されていないファイルに関するSmartScreen フィルター機能の警告の上書きを許可しない</td> <td valign="top" width="50%">確認されていないファイルのダウンロードに関する SmartScreen フィルター機能の警告をユーザーが上書きできるかどうかを指定</td></tr> <tr> <td valign="top" width="50%">すべてのイントラネットサイトを Internet Explorer 11 に送る</td> <td valign="top" width="50%">イントラネット サイトを Internet Explorer 11 で表示するかどうかを指定</td></tr></tbody></table>

<p>&nbsp;</p>

<p>今回のアップデートでは、新たに以下の内容が制御可能となりました。</p>

<table cellspacing="0" cellpadding="2" border="1"> <tbody> <tr> <td style="color: white;text-align: center;background-color: navy" valign="top" width="50%">設定</td> <td style="color: white;text-align: center;background-color: navy" valign="top" width="50%">説明</td></tr> <tr> <td valign="top" width="50%">Microsoft Edge で about:flags ページへのアクセスを禁止する</td> <td valign="top" width="50%">ユーザーが about:flags ページにアクセスできるかどうかを指定</td></tr> <tr> <td valign="top" width="50%">拡張機能の許可</td> <td valign="top" width="50%">ユーザーが拡張機能を読み込めるかどうかを許可</td></tr> <tr> <td valign="top" width="50%">Interner Explorer でサイトを開くときのメッセージ表示</td> <td valign="top" width="50%">Internet Explorer 11 でサイトが開かれたことを示す追加ページを Microsoft Edge で従業員に表示するのかどうかを指定</td></tr></tbody></table>

<ol><!--EndFragment--></ol>

<p>これらグループポリシーの新しい設定を使用することで、IT 管理者は今回のアップデートで追加された Edge の新機能の使用の有無を管理することかできます。</p>

<h1>Microsoft Edge の更新履歴について</h1>

<p>Windows 10 のビルド単位での、より詳しい更新履歴については、以下のページで確認することができます。</p>

<ul> <li><a title="Microsoft Edge changelog" href="https://developer.microsoft.com/en-us/microsoft-edge/platform/changelog/" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer"><strong>Microsoft Edge changelog</strong></a></li></ul>

<p>Microsoft Edge がサポートする API については以下をご参照ください。</p>

<ul> <li><a title="Platform status" href="https://developer.microsoft.com/en-us/microsoft-edge/platform/status/" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer"><strong>Platform status</strong></a></li></ul>

<h1>まとめ</h1>

<p>これまでの Edge では、Web コンテンツの閲覧中 Internet Explorer 11 と比較して機能が少ないと感じる場面が多々あったかもしれません。しかし、そういった不満は Windows 10 Anniversary Update によってずいぶんと解決されていると思います。</p>

<p>また、それでも足らないと感じる機能については、<a title="Extension for Microsoft Edge" href="https://developer.microsoft.com/en-us/microsoft-edge/extensions/" target="_blank" data-wpel-link="external" rel="follow external noopener noreferrer">拡張を追加</a>することである程度解消できることでしょう。</p>

<p>Edge を使ってみて他の Web ブラウザーを使うようになってしまった人も、Edge をまだ使用したことがない人もぜひこの機会に Edge をお試しくださいませ。</p>
]]></content:encoded>
			<wfw:commentRss>/osamum_ms/20244/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>スクエニのデモすごかった！HoroLensも、Edgeも！見どころ多すぎで長文失礼！- Microsoft de:code基調講演後半レポート</title>
		<link>/shumpei-shiraishi/15034/</link>
		<pubDate>Tue, 26 May 2015 09:18:27 +0000</pubDate>
		<dc:creator><![CDATA[白石 俊平]]></dc:creator>
				<category><![CDATA[最新動向]]></category>
		<category><![CDATA[Edge]]></category>
		<category><![CDATA[FINAL FANTASY]]></category>
		<category><![CDATA[HoroLens]]></category>
		<category><![CDATA[IoT]]></category>
		<category><![CDATA[Microsoft Band]]></category>
		<category><![CDATA[Rasberry Pi]]></category>
		<category><![CDATA[Square Enix]]></category>
		<category><![CDATA[Windows 10]]></category>
		<category><![CDATA[de:code]]></category>
		<category><![CDATA[機械学習]]></category>

		<guid isPermaLink="false">/?p=15034</guid>
		<description><![CDATA[2015年5月26日から、マイクロソフトが主催するエンジニア向けカンファレンス「de:code 2015」が開催中です。 2日間に渡るカンファレンスでは、開発者向けのセッションがてんこ盛り。 この記事は、基調講演レポート...]]></description>
				<content:encoded><![CDATA[<p>2015年5月26日から、マイクロソフトが主催するエンジニア向けカンファレンス「<a href="http://www.microsoft.com/ja-jp/events/decode/2015/default.aspx" data-wpel-link="external" target="_blank" rel="follow external noopener noreferrer">de:code 2015</a>」が開催中です。
2日間に渡るカンファレンスでは、開発者向けのセッションがてんこ盛り。
この記事は、基調講演レポートの後半です。</p>

<p>Microsoft Azureの話題が中心だった前半（<a href="https://html5experts.jp/shumpei-shiraishi/15016/" data-wpel-link="internal">レポート記事</a>）とは対照的に、後半はWindows 10やHoloLensなど、コンシューマ向けプロダクトの紹介が主でした。
よって、内容が<strong>派手</strong>！見栄えのするデモや、ぼくらが大好きなコードの話も出てきて、見どころ満載でした。</p>

<h2>ジョ〜〜！！！</h2>

<p>「前後半の合間に、ちょっとした息抜きをしましょうか。<a href="https://powerbi.microsoft.com/" data-wpel-link="external" target="_blank" rel="follow external noopener noreferrer">Power BI</a>の勉強でもしましょう」って言われた時は「えっ」という気持ちでいっぱいでしたが、フタを開けてみると本当に息抜きのコンテンツでした。</p>

<p>次の登壇者である「Giorgio Sardo」（ジョー）さんの名前を観客が全力で叫び、その音量を視覚化するというもの。
何やらせんだ。</p>

<div id="attachment_15036" style="width: 650px" class="wp-caption aligncenter"><a href="https://html5experts.jp/wp-content/uploads/2015/05/011.jpg" data-wpel-link="internal"><img src="/wp-content/uploads/2015/05/011-640x480.jpg" alt="最後はメーター振り切ることができて、マイクロソフトの方々もご満悦" width="640" height="480" class="size-large wp-image-15036" srcset="/wp-content/uploads/2015/05/011.jpg 640w, /wp-content/uploads/2015/05/011-300x225.jpg 300w, /wp-content/uploads/2015/05/011-207x155.jpg 207w" sizes="(max-width: 640px) 100vw, 640px" /></a><p class="wp-caption-text">最後はメーター振り切ることができて、マイクロソフトの方々もご満悦</p></div>

<p>で、ジョーが出てきました。</p>

<div id="attachment_15037" style="width: 650px" class="wp-caption aligncenter"><a href="https://html5experts.jp/wp-content/uploads/2015/05/021.jpg" data-wpel-link="internal"><img src="/wp-content/uploads/2015/05/021-640x480.jpg" alt="デベロッパーエクスペリエンス &amp; エヴァンジェリストグループ シニアディレクターのGiorgio Sardo氏" width="640" height="480" class="size-large wp-image-15037" srcset="/wp-content/uploads/2015/05/021.jpg 640w, /wp-content/uploads/2015/05/021-300x225.jpg 300w, /wp-content/uploads/2015/05/021-207x155.jpg 207w" sizes="(max-width: 640px) 100vw, 640px" /></a><p class="wp-caption-text">デベロッパーエクスペリエンス &amp; エヴァンジェリストグループ シニアディレクターのGiorgio Sardo氏</p></div>

<h2>Windows 10で、目指せ10億台！</h2>

<p>話題はもちろんWindows 10です。
Windows 10は、「巨大なターゲット市場」「スマートエンゲージメント」「One Store &amp; Dev Center」「統合された開発プラットフォーム」という特徴を備え、大きなチャンスを生み出すと言います。</p>

<p><a href="https://html5experts.jp/wp-content/uploads/2015/05/031.jpg" data-wpel-link="internal"><img src="/wp-content/uploads/2015/05/031-640x480.jpg" alt="03" width="640" height="480" class="aligncenter size-large wp-image-15038" srcset="/wp-content/uploads/2015/05/031.jpg 640w, /wp-content/uploads/2015/05/031-300x225.jpg 300w, /wp-content/uploads/2015/05/031-207x155.jpg 207w" sizes="(max-width: 640px) 100vw, 640px" /></a></p>

<h3>巨大なターゲット市場</h3>

<p>この画像で言いたいことは、「Windows 10はスゲエよ！10億台のデバイスを繋げるんだ！儲かるぜ！」ということ（超意訳）。</p>

<div id="attachment_15039" style="width: 650px" class="wp-caption aligncenter"><a href="https://html5experts.jp/wp-content/uploads/2015/05/041.jpg" data-wpel-link="internal"><img src="/wp-content/uploads/2015/05/041-640x480.jpg" alt="「儲かるぜ！」は、さすがに言ってなかったっけな。" width="640" height="480" class="size-large wp-image-15039" srcset="/wp-content/uploads/2015/05/041.jpg 640w, /wp-content/uploads/2015/05/041-300x225.jpg 300w, /wp-content/uploads/2015/05/041-207x155.jpg 207w" sizes="(max-width: 640px) 100vw, 640px" /></a><p class="wp-caption-text">「儲かるぜ！」は、さすがに言ってなかったっけな。</p></div>

<h3>スマート エンゲージメント</h3>

<p>あらゆるデバイスを統合した通知機能や、Cortanaによるインテリジェントな検索により、アプリケーションとユーザの接点をより緊密なものにします。</p>

<p><a href="https://html5experts.jp/wp-content/uploads/2015/05/051.jpg" data-wpel-link="internal"><img src="/wp-content/uploads/2015/05/051-640x480.jpg" alt="05" width="640" height="480" class="aligncenter size-large wp-image-15040" srcset="/wp-content/uploads/2015/05/051.jpg 640w, /wp-content/uploads/2015/05/051-300x225.jpg 300w, /wp-content/uploads/2015/05/051-207x155.jpg 207w" sizes="(max-width: 640px) 100vw, 640px" /></a></p>

<p><a href="https://html5experts.jp/wp-content/uploads/2015/05/061.jpg" data-wpel-link="internal"><img src="/wp-content/uploads/2015/05/061-640x480.jpg" alt="06" width="640" height="480" class="aligncenter size-large wp-image-15041" srcset="/wp-content/uploads/2015/05/061.jpg 640w, /wp-content/uploads/2015/05/061-300x225.jpg 300w, /wp-content/uploads/2015/05/061-207x155.jpg 207w" sizes="(max-width: 640px) 100vw, 640px" /></a></p>

<h3>（Windows 10がどこでも動くから）Windows 10アプリは一度書けばどこでも動く！HoloLensでも！</h3>

<p>Windows 10の目指す所は、あらゆるデバイスに対して一つのOSという「One Windows」というビジョンです。
それにより当然ながら、アプリストアも一つに統合されます。</p>

<p><a href="https://html5experts.jp/wp-content/uploads/2015/05/071.jpg" data-wpel-link="internal"><img src="/wp-content/uploads/2015/05/071-640x480.jpg" alt="07" width="640" height="480" class="aligncenter size-large wp-image-15042" srcset="/wp-content/uploads/2015/05/071.jpg 640w, /wp-content/uploads/2015/05/071-300x225.jpg 300w, /wp-content/uploads/2015/05/071-207x155.jpg 207w" sizes="(max-width: 640px) 100vw, 640px" /></a></p>

<p>そうなると、「一つのアプリがあらゆるデバイスで動作する」必要も出てきます。つまり、あらゆるスクリーンサイズで動作する…<strong>レスポンシブであることが望まれる</strong> ということです。
レスポンシブなWindows 10アプリの例を、楽天のポータルアプリ「楽天Gateway」で実演。</p>

<p><a href="https://html5experts.jp/wp-content/uploads/2015/05/081.jpg" data-wpel-link="internal"><img src="/wp-content/uploads/2015/05/081-640x480.jpg" alt="08" width="640" height="480" class="aligncenter size-large wp-image-15043" srcset="/wp-content/uploads/2015/05/081.jpg 640w, /wp-content/uploads/2015/05/081-300x225.jpg 300w, /wp-content/uploads/2015/05/081-207x155.jpg 207w" sizes="(max-width: 640px) 100vw, 640px" /></a></p>

<p><a href="https://html5experts.jp/wp-content/uploads/2015/05/091.jpg" data-wpel-link="internal"><img src="/wp-content/uploads/2015/05/091-640x480.jpg" alt="09" width="640" height="480" class="aligncenter size-large wp-image-15044" srcset="/wp-content/uploads/2015/05/091.jpg 640w, /wp-content/uploads/2015/05/091-300x225.jpg 300w, /wp-content/uploads/2015/05/091-207x155.jpg 207w" sizes="(max-width: 640px) 100vw, 640px" /></a></p>

<p>あらゆるデバイスを統合するプラットフォームとしての、Windows 10のデモはまだまだ終わりません。
この画像が、マイクロソフトさんの言いたいことをよく表しているように思います。</p>

<p><a href="https://html5experts.jp/wp-content/uploads/2015/05/101.jpg" data-wpel-link="internal"><img src="/wp-content/uploads/2015/05/101-640x480.jpg" alt="10" width="640" height="480" class="aligncenter size-large wp-image-15045" srcset="/wp-content/uploads/2015/05/101.jpg 640w, /wp-content/uploads/2015/05/101-300x225.jpg 300w, /wp-content/uploads/2015/05/101-207x155.jpg 207w" sizes="(max-width: 640px) 100vw, 640px" /></a></p>

<p>こんなすごい3Dマップも…</p>

<p><a href="https://html5experts.jp/wp-content/uploads/2015/05/111.jpg" data-wpel-link="internal"><img src="/wp-content/uploads/2015/05/111-640x480.jpg" alt="11" width="640" height="480" class="aligncenter size-large wp-image-15046" srcset="/wp-content/uploads/2015/05/111.jpg 640w, /wp-content/uploads/2015/05/111-300x225.jpg 300w, /wp-content/uploads/2015/05/111-207x155.jpg 207w" sizes="(max-width: 640px) 100vw, 640px" /></a></p>

<p>一行書くだけで実現できます。</p>

<p><a href="https://html5experts.jp/wp-content/uploads/2015/05/121.jpg" data-wpel-link="internal"><img src="/wp-content/uploads/2015/05/121-640x480.jpg" alt="12" width="640" height="480" class="aligncenter size-large wp-image-15047" srcset="/wp-content/uploads/2015/05/121.jpg 640w, /wp-content/uploads/2015/05/121-300x225.jpg 300w, /wp-content/uploads/2015/05/121-207x155.jpg 207w" sizes="(max-width: 640px) 100vw, 640px" /></a></p>

<p>こういう、3Dモデルを作れるアプリも…</p>

<p><a href="https://html5experts.jp/wp-content/uploads/2015/05/131.jpg" data-wpel-link="internal"><img src="/wp-content/uploads/2015/05/131-640x480.jpg" alt="13" width="640" height="480" class="aligncenter size-large wp-image-15048" srcset="/wp-content/uploads/2015/05/131.jpg 640w, /wp-content/uploads/2015/05/131-300x225.jpg 300w, /wp-content/uploads/2015/05/131-207x155.jpg 207w" sizes="(max-width: 640px) 100vw, 640px" /></a></p>

<p>HoloLensがあればホログラム化！これはすごい！</p>

<p><a href="https://html5experts.jp/wp-content/uploads/2015/05/141.jpg" data-wpel-link="internal"><img src="/wp-content/uploads/2015/05/141-640x360.jpg" alt="14" width="640" height="360" class="aligncenter size-large wp-image-15049" srcset="/wp-content/uploads/2015/05/141.jpg 640w, /wp-content/uploads/2015/05/141-300x169.jpg 300w, /wp-content/uploads/2015/05/141-207x116.jpg 207w" sizes="(max-width: 640px) 100vw, 640px" /></a></p>

<h3>Edgeの話も忘れずに</h3>

<p>Webエンジニアとしては、最近一番ワクワクする話題だった「Microsoft Edge」の発表。
もちろんこの基調講演でも大きく扱われていました。</p>

<p><a href="https://html5experts.jp/wp-content/uploads/2015/05/15.jpg" data-wpel-link="internal"><img src="/wp-content/uploads/2015/05/15-640x480.jpg" alt="15" width="640" height="480" class="aligncenter size-large wp-image-15050" srcset="/wp-content/uploads/2015/05/15.jpg 640w, /wp-content/uploads/2015/05/15-300x225.jpg 300w, /wp-content/uploads/2015/05/15-207x155.jpg 207w" sizes="(max-width: 640px) 100vw, 640px" /></a></p>

<p>EdgeHTMLという新しい描画エンジンにより、4,200以上の相互運用性を改善したそうです。</p>

<p>もちろん、JavaScriptの実行速度を向上させるのも忘れません。</p>

<p><a href="https://html5experts.jp/wp-content/uploads/2015/05/16.jpg" data-wpel-link="internal"><img src="/wp-content/uploads/2015/05/16-640x480.jpg" alt="16" width="640" height="480" class="aligncenter size-large wp-image-15051" srcset="/wp-content/uploads/2015/05/16.jpg 640w, /wp-content/uploads/2015/05/16-300x225.jpg 300w, /wp-content/uploads/2015/05/16-207x155.jpg 207w" sizes="(max-width: 640px) 100vw, 640px" /></a></p>

<p>Edgeの大きなウリをMicrosoftさん自身でまとめるとこうなります。
「定期的な更新」っていうのが個人的には一番ツボです（IEは後方互換性の問題があって、これができなかったからなあ…）。
あと、ChromeやFirefoxの拡張機能が（ちょっとした修正で）動くと噂の、「新しいエクステンションモデル」も気になります。</p>

<p><a href="https://html5experts.jp/wp-content/uploads/2015/05/17.jpg" data-wpel-link="internal"><img src="/wp-content/uploads/2015/05/17-640x480.jpg" alt="17" width="640" height="480" class="aligncenter size-large wp-image-15052" srcset="/wp-content/uploads/2015/05/17.jpg 640w, /wp-content/uploads/2015/05/17-300x225.jpg 300w, /wp-content/uploads/2015/05/17-207x155.jpg 207w" sizes="(max-width: 640px) 100vw, 640px" /></a></p>

<p>新機能「Hosted Web Apps」は、WebサイトをそのままWindowsアプリにしてしまえる機能。</p>

<p><a href="https://html5experts.jp/wp-content/uploads/2015/05/18.jpg" data-wpel-link="internal"><img src="/wp-content/uploads/2015/05/18-640x480.jpg" alt="18" width="640" height="480" class="aligncenter size-large wp-image-15054" srcset="/wp-content/uploads/2015/05/18.jpg 640w, /wp-content/uploads/2015/05/18-300x225.jpg 300w, /wp-content/uploads/2015/05/18-207x155.jpg 207w" sizes="(max-width: 640px) 100vw, 640px" /></a></p>

<p>こんな感じのフライトシミュレーターアプリ（Webアプリ）も…</p>

<p><a href="https://html5experts.jp/wp-content/uploads/2015/05/19.jpg" data-wpel-link="internal"><img src="/wp-content/uploads/2015/05/19-640x480.jpg" alt="19" width="640" height="480" class="aligncenter size-large wp-image-15053" srcset="/wp-content/uploads/2015/05/19.jpg 640w, /wp-content/uploads/2015/05/19-300x225.jpg 300w, /wp-content/uploads/2015/05/19-207x155.jpg 207w" sizes="(max-width: 640px) 100vw, 640px" /></a></p>

<p>っと、デモを本格的にやる前に、プレイヤーとしての心の準備。
（最近のMicrosoftさん、エンジニアが好むゆるい雰囲気をよくよくわかってらっしゃる）</p>

<p><a href="https://html5experts.jp/wp-content/uploads/2015/05/20.jpg" data-wpel-link="internal"><img src="/wp-content/uploads/2015/05/20-640x480.jpg" alt="20" width="640" height="480" class="aligncenter size-large wp-image-15055" srcset="/wp-content/uploads/2015/05/20.jpg 640w, /wp-content/uploads/2015/05/20-300x225.jpg 300w, /wp-content/uploads/2015/05/20-207x155.jpg 207w" sizes="(max-width: 640px) 100vw, 640px" /></a></p>

<p>Windowsアプリにしてしまえば、よりネイティブな機能を利用できるので、<a href="https://www.microsoft.com/Microsoft-Band/en-us" data-wpel-link="external" target="_blank" rel="follow external noopener noreferrer">Microsoft Band</a>と連携して飛行機を操縦…なんてこともできちゃう。</p>

<p><a href="https://html5experts.jp/wp-content/uploads/2015/05/21.jpg" data-wpel-link="internal"><img src="/wp-content/uploads/2015/05/21-640x480.jpg" alt="21" width="640" height="480" class="aligncenter size-large wp-image-15056" srcset="/wp-content/uploads/2015/05/21.jpg 640w, /wp-content/uploads/2015/05/21-300x225.jpg 300w, /wp-content/uploads/2015/05/21-207x155.jpg 207w" sizes="(max-width: 640px) 100vw, 640px" /></a></p>

<h3>IoTも！機械学習も！</h3>

<p>見どころ多すぎて、書くの疲れてきたんですが、まだまだ行きます。</p>

<p>Windows 10をIoTに対応させる動きも活発ですが、Minnowboard MaxとRasberry Pi 2ですでに利用可能です。</p>

<p><a href="https://html5experts.jp/wp-content/uploads/2015/05/22.jpg" data-wpel-link="internal"><img src="/wp-content/uploads/2015/05/22-640x480.jpg" alt="22" width="640" height="480" class="aligncenter size-large wp-image-15057" srcset="/wp-content/uploads/2015/05/22.jpg 640w, /wp-content/uploads/2015/05/22-300x225.jpg 300w, /wp-content/uploads/2015/05/22-207x155.jpg 207w" sizes="(max-width: 640px) 100vw, 640px" /></a></p>

<p>なんか偉い人らしいんですが、コスプレして出てきました。</p>

<p><a href="https://html5experts.jp/wp-content/uploads/2015/05/23.jpg" data-wpel-link="internal"><img src="/wp-content/uploads/2015/05/23-640x480.jpg" alt="23" width="640" height="480" class="aligncenter size-large wp-image-15058" srcset="/wp-content/uploads/2015/05/23.jpg 640w, /wp-content/uploads/2015/05/23-300x225.jpg 300w, /wp-content/uploads/2015/05/23-207x155.jpg 207w" sizes="(max-width: 640px) 100vw, 640px" /></a></p>

<p>これは何のデモかというと、富士通と共同で開発した「牛管理アプリ」だそうで（コスプレしてた偉い人は「Connected Cow」という札を下げてました）、牛にセンサーを付けて集めたデータを、Azure Machine Learningを使って機械学習＆統計出力していました。なんでもありだな、マイクロソフト。</p>

<p><a href="https://html5experts.jp/wp-content/uploads/2015/05/24.jpg" data-wpel-link="internal"><img src="/wp-content/uploads/2015/05/24-640x480.jpg" alt="24" width="640" height="480" class="aligncenter size-large wp-image-15059" srcset="/wp-content/uploads/2015/05/24.jpg 640w, /wp-content/uploads/2015/05/24-300x225.jpg 300w, /wp-content/uploads/2015/05/24-207x155.jpg 207w" sizes="(max-width: 640px) 100vw, 640px" /></a></p>

<h3>スクエニ来た！なんかすごいデモや！</h3>

<p>そろそろ最後の山場。</p>

<p>Windows 10のゲームとグラフィックの機能をプレゼンする段になり、スクウェア・エニックスの第2ビジネス・ディビジョンから田畑 端氏がいらっしゃいました。</p>

<div id="attachment_15060" style="width: 650px" class="wp-caption aligncenter"><a href="https://html5experts.jp/wp-content/uploads/2015/05/25.jpg" data-wpel-link="internal"><img src="/wp-content/uploads/2015/05/25-640x480.jpg" alt="中央がスクウェア・エニックス 第2ビジネス・ディビジョン ディレクター・プロデューサー 田畑 端氏" width="640" height="480" class="size-large wp-image-15060" srcset="/wp-content/uploads/2015/05/25.jpg 640w, /wp-content/uploads/2015/05/25-300x225.jpg 300w, /wp-content/uploads/2015/05/25-207x155.jpg 207w" sizes="(max-width: 640px) 100vw, 640px" /></a><p class="wp-caption-text">中央がスクウェア・エニックス 第2ビジネス・ディビジョン ディレクター・プロデューサー 田畑 端氏</p></div>

<p>発表はふたつありました。</p>

<p>ひとつは「FINAL FANTASY AGITO on Windows 10」。</p>

<div id="attachment_15061" style="width: 650px" class="wp-caption aligncenter"><a href="https://html5experts.jp/wp-content/uploads/2015/05/26.jpg" data-wpel-link="internal"><img src="/wp-content/uploads/2015/05/26-640x480.jpg" alt="年内ローンチって言った？言ったよね？え？予定？" width="640" height="480" class="size-large wp-image-15061" srcset="/wp-content/uploads/2015/05/26.jpg 640w, /wp-content/uploads/2015/05/26-300x225.jpg 300w, /wp-content/uploads/2015/05/26-207x155.jpg 207w" sizes="(max-width: 640px) 100vw, 640px" /></a><p class="wp-caption-text">年内ローンチって言った？言ったよね？え？予定？</p></div>

<p>もうひとつは、Windows 10に搭載されるDirectX 12、そしてNVIDIAも巻き込んで開発された、アートとテクノロジーを融合させたデモンストレーション。</p>

<p>このクオリティの3D CG（髪の毛の本数も、実際の人間と同じだそうです）を、リアルタイムに視点移動させることができます。思わず会場からはため息が漏れました。
これは、動画見ないと伝わらないかも…。</p>

<div id="attachment_15062" style="width: 650px" class="wp-caption aligncenter"><a href="https://html5experts.jp/wp-content/uploads/2015/05/28.jpg" data-wpel-link="internal"><img src="/wp-content/uploads/2015/05/28-640x480.jpg" alt="WITCH CHAPTER 0 [cry]" width="640" height="480" class="size-large wp-image-15062" srcset="/wp-content/uploads/2015/05/28.jpg 640w, /wp-content/uploads/2015/05/28-300x225.jpg 300w, /wp-content/uploads/2015/05/28-207x155.jpg 207w" sizes="(max-width: 640px) 100vw, 640px" /></a><p class="wp-caption-text">WITCH CHAPTER 0 [cry]</p></div>

<p>ってことで動画貼っておきますね！</p>

<iframe width="560" height="315" src="https://www.youtube.com/embed/CGsJXINz0LQ" frameborder="0" allowfullscreen></iframe>

<h3>すべてのエンジニアとアプリのために</h3>

<p>基調講演の最後は、MacやLinuxでも動作することで話題になった「<a href="https://code.visualstudio.com/" data-wpel-link="external" target="_blank" rel="follow external noopener noreferrer">Visual Studio Code</a>」や、Dockerを一例としてオープンソースコミュニティへの貢献を拡大させていることなど、Microsoftの開発者に向けた取り組みが、Windowsに囲い込もうとしていた以前とは全く異なることへの言及でした。</p>

<p><a href="https://html5experts.jp/wp-content/uploads/2015/05/29.jpg" data-wpel-link="internal"><img src="/wp-content/uploads/2015/05/29-640x480.jpg" alt="29" width="640" height="480" class="aligncenter size-large wp-image-15063" srcset="/wp-content/uploads/2015/05/29.jpg 640w, /wp-content/uploads/2015/05/29-300x225.jpg 300w, /wp-content/uploads/2015/05/29-207x155.jpg 207w" sizes="(max-width: 640px) 100vw, 640px" /></a></p>

<p>「Empower every engineer」（すべてのエンジニアに力を与える）というフレーズは、このキーノートで一貫して取り上げられていましたが、聞いていたぼくとしてはその本気度が十分に伝わる内容でした。この記事を読んでいらっしゃる皆様にも、その雰囲気が少しでも伝われば幸いです。</p>

<p><a href="https://html5experts.jp/wp-content/uploads/2015/05/30.jpg" data-wpel-link="internal"><img src="/wp-content/uploads/2015/05/30-640x480.jpg" alt="30" width="640" height="480" class="aligncenter size-large wp-image-15064" srcset="/wp-content/uploads/2015/05/30.jpg 640w, /wp-content/uploads/2015/05/30-300x225.jpg 300w, /wp-content/uploads/2015/05/30-207x155.jpg 207w" sizes="(max-width: 640px) 100vw, 640px" /></a></p>
]]></content:encoded>
			</item>
	</channel>
</rss>
