IE Metro Isn’t Always Available

Yes, that says should. Sadly, depending on how you acquired Windows 8–perhaps by upgrading an existing PC or from a PC maker who has modified the default settings–you may see a tile for the desktop version of Internet Explorer instead, as shown in Figure 7‑4 . Or, you may see a tile for a competing web browser.

Figure 7‑4: See this tile instead? That’s the IE 10 desktop tile.

Unfortunately, this is an important consideration, because when another browser or the desktop version of IE is configured as the default browser, Internet Explorer 10 for Metro won’t even be available. It will literally be hidden from you, and unavailable. Because of this possibility, we explain exactly how and why this happens, and how you can fix it, in the final section of this chapter. So if you’re not seeing what you should be seeing, jump ahead now. And no worries, it’s easily fixed, if not easily understood.

The first time you launch the Metro version of Internet Explorer may be a bit surprising, and while Figure 7‑5 is probably inadequate for explaining why, here it goes.

Figure 7‑5: It’s the touchable web: IE 10 for Metro.

Yes, this is why Google named its own browser Chrome.

What you may not be getting from that static screenshot is that Internet Explorer for Metro, like IE for Windows Phone, offers only a very minimal user interface, and one that is, in fact, hidden by default. So what you’re looking at there is a web page loaded in a browser that has no surrounding user interface, or what browser makers call chrome. That is, you’re seeing just the web page, and not the browser.

To hide the edge UIs, simply perform the same swipe–or keyboard shortcut, or right‑click, again. These things almost always work like a toggle.

Like other Metro‑style apps, Internet Explorer 10 does provide a so‑called edge UI that is accessed by swiping toward the middle of the screen from the top or bottom edge. (Mouse users can right‑click any blank area of the browser’s surface to trigger this interface, while keyboard users should learn the Winkey + Z shortcut.) When you access this edge UI, the browser will resemble Figure 7‑6.

Figure 7‑6: The IE Metro edge UI

There’s a lot going on here. In fact, one thing you may have noticed is that Internet Explorer 10 is fairly unique among Metro‑style apps in that it not only offers a single app bar–that toolbar‑like control at the bottom of the screen that in IE is called the navigation bar–but it also offers a second bar, called the tab switcher, at the top of the screen. Almost all Metro‑style apps offer a single app bar. But very few go beyond that, as IE does.

The reason for this overloaded user interface is simple. Internet Explorer 10 is a fairly complex and certainly full‑featured app, just like its desktop‑based cousin. And it requires the additional space for commands that’s afforded by the extra chrome.

NOTE

In some cases, only the navigation bar will appear, allowing you to type a URL into the address bar or perform other actions. If you don’t see the tab switcher as well, simply swipe down from the top of the screen (or perform any other input action that will display an edge UI).

Understanding the Navigation Bar

The Internet Explorer navigation bar has several main user interface components, which are called out in Figure 7‑7 and described next.

• Back: This button functions like a simplified version of the Back button commonly found in desktop web browsers. However, in keeping with the Metro design philosophies, it lacks advanced features, such as the ability to tap and hold to access a menu of past pages and the browser History.

Figure 7‑7: The IE navigation bar

NOTE

IE Metro supports other ways to go back to the previously loaded web page. We’ll examine these capabilities in the “Navigating the Web with IE 10 Metro” section.

• Site Icon: A noninteractive button that displays the site’s icon, if any.

• Address bar: This control works much like the address bar in the desktop version of Internet Explorer, but with some key differences. You can, of course, select the address bar to type any arbitrary URL, and then press Enter to start navigation. But IE Metro is unique because a full‑screen view of Frequent and Pinned sites is displayed each time the address bar is selected. And as you type, these lists are filtered, on the fly. This feature is so cool, we discuss it more in the “Finding Favorites and Other Websites” section later in this chapter.

Sites with encrypted connections will include a lock badge in the address bar, just as with the desktop version of IE. This control also works as a progress indicator while sites are loading.

To search the web from the address bar, simply type your search query in the address bar. Internet Explorer will search the web using the configured search engine, which, by default, is Bing.

The address bar also lacks some features of the desktop IE’s address bar, including a menu‑based auto‑complete list and Compatibility View.

• Refresh/Stop: This button works just like its desktop cousin: Tap it to refresh (reload) the current page or, if the currently loading page is stuttering or not completing for some reason, tap it to stop it from loading.

You can still pin websites to the Windows 8 taskbar. But you will do this separately, from the desktop version of IE.

• Pin to Start: While old‑school IE users probably cart around a folder full of Favorites–Internet Explorer’s version of the browser bookmarks feature–the cool kids started pinning their favorite sites to the Windows 7 taskbar with IE 9. And now in IE 10, you can pin your favorite sites to the Windows 8 Start screen too. This is how you do it, and because it’s such a great new feature with unique capabilities, we examine it in detail later in this chapter.

NOTE

The Favorites Bar is no longer available in IE Metro, because of screen real estate reasons.

• Page Tools: This useful tool displays a pop‑up menu when tapped. From here, you can utilize IE Metro’s Find on Page and View on the Desktop functionalities. The former helps you search the currently displayed web page for a specific search term. The latter, new to IE 10, loads the currently displayed web page in the desktop version of Internet Explorer. You will also occasionally see a Get app for this site option in the Page Tools menu; in such cases, the button itself will change a bit, adding a small gear graphic, indicating that a Windows 8 Metro‑style app is also available.

Forward: Yep, this works much like the Forward button in the desktop version of IE. But as with Back, it lacks advanced features, like the ability to tap and hold to access a menu of past pages and the browser History.

Understanding the Tab Switcher

Whereas desktop versions of Internet Explorer feature an always‑visible row of browser tabs, IE Metro tries to do more with less, so it hides its new tab switcher and other UI chrome elements by default. But when enabled, the tab switcher, as shown in Figure 7‑8, provides the UI elements described next.

Figure 7‑8: The IE tab switcher

IE Metro only supports two tab thumbnail rows in the tab switcher. If both rows are full, and you open yet another tab, the oldest tab is removed.

• Active Tab(s): The majority of the tab switcher is occupied with one or more thumbnails representing the currently open browser tabs, each with its own web page loaded. You will always see at least one tab thumbnail here–representing the current page–and if you open enough tabs, a second tab thumbnail row will appear.

• New Tab: This button opens a new tab and then provides a view of your Frequent and (if available) Pinned lists (offering your most frequently accessed sites as well as those you’ve pinned to the Start screen, respectively) and the address bar so you can manually type in a website URL–or a search term–if desired.

Want to close just a single tab? Ctrl + W still works for the current tab. And you can use the little close icon on a tab if you prefer using touch or the mouse.

• Tab Menu: This button displays a small menu when tapped. It has two choices: New InPrivate tab and Close tabs. The former opens a new tab in Internet Explorer’s InPrivate Browsing mode, which prevents anything that happens in that tab from making its way into the global browser History. (What happens in InPrivate Browsing mode stays in InPrivate Browsing mode.) Close tabs is exactly what it sounds like: it simply closes all but the currently displayed tab.

Navigating the Web with IE 10 Metro

Now that you’re up to speed on the major UI components of the Metro‑styled version of Internet Explorer 10, you can turn your attention to actually using the browser. You’ll also see some similarities with desktop IE versions, and some differences, which could prove to be vexing.

Key among these is right‑click, or what we call “tap and hold” for touch users. This common action doesn’t work in IE Metro the same as it does in the desktop versions of the browser, and in fact only offers up limited options, depending on what you’ve clicked (or tapped). Right‑clicking also brings up the browser navigation bar if you’re not selecting an on‑page object.

What this means is that you can’t right‑click any element on a web page and access all of the advanced options you get with desktop IE. Instead, you’ll have limited options depending on what you’ve selected:

• Images: Right‑click an (unhyperlinked) image, and you’ll see two useful choices in the context menu that appears: Copy, which copies the image to the clipboard, and Save to Picture library.

• Hyperlinked Images: Right‑click a hyperlinked image, and you’ll see Copy, Copy Link, Open link in a new tab, Open link, and Save to Picture library.

• Text: If you select a block of text on a web page, you can right‑click to copy it to the clipboard.

• Hyperlinked text: Right‑click hyperlinked text, and you’ll see Copy Link, Open link in a new tab, and Open link.

But most actions will work as expected in IE Metro. You can tap hyperlinks to access the underlying page, scroll with your finger, and so on. Here are some key navigational concerns you’ll want to know about in Internet Explorer for Metro.

Home

As with mobile device browsers, IE Metro does not support the notion of Home, let alone allow you to configure multiple homepages, as does the desktop version of IE. Instead, the browser maintains state between sessions, and even between shutdowns, so that the last site you were visiting–all open tabs, really–are automatically reloaded the next time you open IE Metro.

Back and Forward

As noted previously, the IE Metro navigation bar sports both Back and Forward buttons for normal navigation, albeit without any advanced features. But when you consider that IE Metro will normally be used in a chrome‑less mode in which the navigation bar and tab switcher are hidden, re‑enabling the navigation bar just for basic purposes could get pretty tedious. Fortunately, there are other ways.

Keyboard users can utilize the standard Alt + Left Arrow and Alt + Right Arrow combinations for Back and Forward, respectively. But since Metro in general and IE Metro specifically are designed for multi‑touch interfaces, it’s more likely that you’ll want to utilize some new gestures to navigate Back and Forward. To do so, simply tap and hold near the edge of the screen and then swipe toward the middle. If you do so from the left edge of the screen, you’ll navigate back. Do so from the right, and you’ll navigate forward.

But even mouse users have a new way to navigate. If you move the mouse cursor near the left edge of the screen, you’ll see a new Back transport control appear, as in Figure 7‑9. You can click this control to navigate Back without needing to first display the navigation bar. A similar control appears on the right side of the screen for Forward.

Figure 7‑9: The IE Back tip lets you navigate back without having to first display the navigation bar.

Visiting Specific Websites

Keyboard users will want to remember one of two quick keyboard shortcuts to more quickly bring up the address bar: Alt + D or Ctrl + L. Of course, with a mouse, you can simply right‑click any blank area in IE Metro.

As with any web browser, you can arbitrarily visit any website by typing its name into the address bar. As described previously, however, the address bar is hidden by default. So swipe up from the bottom edge of the display (or down from the top) to display the navigation bar, which includes the address bar.

Finding Favorites and Other Websites

Since the Metro version of IE is focused on providing basic web browsing functionality in a package that is touch‑friendly, it doesn’t include all of the features of its desktop cousin. Or in some cases, it hides functionality in order to keep the display minimalist.

One of the classic examples of this latter user interface miscue is Favorites. It’s in there. In fact, IE Metro synchronizes your Favorites list with the desktop version and, if you’ve enabled it, with other PCs as well. But this browser offers absolutely no way to access your Favorites as a list or menu. And it provides no way to save a site as a Favorite. Instead, you must pin favorite sites to the Start screen.

But since IE Metro does at least synchronize with your list of Favorites, there must be some way to access these sites from the browser, right? Right. And there is. It’s just not clear to us how anyone would ever discover this functionality on their own.

The only way to access Favorites in IE Metro is via search: Select the address bar and start typing. As you do, the navigation tiles at the top of the display change to display search results that match what you’re typing. And these results comprise four things: frequently accessed sites, pinned sites, very popular websites, and … wait for it … your Favorites. You can see this effect in Figure 7‑10.

Figure 7‑10: Favorites are available only when you search through the address bar.

Favorites, pinned sites, and your browsing history are all synced from PC to PC if you sign in to Windows 8 with a Microsoft account, as discussed in Chapter 2.

Why so opaque? It’s pretty clear that Microsoft considers the Favorites list a legacy interface and would prefer users to start moving toward pinned sites. This will be fine for average consumers who only store a handful of frequently visited sites. But power users will need to know the workaround, or simply stick with the desktop version of IE.

You can access the Frequent list, as the list of frequently accessed sites is called, and your pinned sites–but not your Favorites–simply by selecting the address bar. This navigation list display is shown in Figure 7‑11.

Figure 7‑11: Frequent and Pinned sites are available when you just select the address bar.

Working with Tabs

Tabs provide a convenient way to access multiple websites from the same browser window. And IE Metro, as a modern mobile web browser, offers decent tab functionality. As noted earlier, you can access the new tab switcher by using the top or bottom edge UI (or the Winkey + Z shortcut) and manage tabs from there. But your old tab skills work as well. You can use Ctrl + T to open a new tab, for example, and Ctrl + W to close one.

Internet Explorer Metro also provides access to InPrivate tabs, special tabs whose browser history will not be recorded as you go, providing a sense of privacy. InPrivate Browsing is available via a button in the tab switcher, but you can also use the keyboard shortcut Ctrl + Shift + P. However you choose to engage this feature, you’ll see a display similar to that in Figure 7‑12, indicating that InPrivate Browsing is on and you’re safe.

Figure 7‑12: InPrivate Browsing keeps your browsing history private.

You can switch between open tabs most easily with the keyboard: The Ctrl + Tab keyboard shortcut from desktop IE works identically in IE Metro.

Fun with Zoom

If you’ve ever used a mobile browser before, you know that most support a cool, touch‑based system in which you pinch the screen or double‑tap the screen to zoom in to and out of specific areas of a web page. Not surprisingly, IE Metro supports these gestures too. And they make a big difference in the way you’ll read many web pages.

Consider a typically busy website like the one shown in Figure 7‑13. While it is possible to read such a site on larger screens, the text is small and hard to read with smaller displays like those on a slate‑based device.

Figure 7‑13: Modern websites are often difficult to read on portable devices like those running Windows 8.

Internet Explorer 10 for Metro offers two ways to cut through the clutter. First, you can double‑tap the screen to zoom in to the area you tapped, such as a column of text. This will resemble the screen shown in Figure 7‑14.

To reverse the effect, just double‑tap the screen again.

Surprisingly, these features are touch‑only. There’s no way to pinch or double‑tap zoom with the keyboard or mouse.

The second and arguably even more fun effect involves pinching the screen to zoom arbitrarily. Simply pinch the screen with two fingers to zoom out, and then “reverse the pinch” to zoom back in.

Actually, there’s a third way. If you’d prefer to change the screen zoom permanently, you can configure IE Metro to do so. Please refer to the section “Configuring IE 10 Metro,” later in this chapter, for details.

Downloading Files

While IE Metro utilizes the same Download folder as the desktop version, the download experience is, naturally, a bit different. This browser utilizes a pane just above the navigation bar, asking whether you’d like to Run, Save, or Cancel the downloadable file. This is shown in Figure 7‑15

Figure 7‑14: You can zoom in to a text column or other on‑screen area by double‑tapping it.

Figure 7‑15: The file download experience

You may be familiar with this process on the desktop version of IE, which offers advanced save options–Save and run, and Save as–in addition to the choices offered in IE Metro. But as it turns out, the Save option in IE Metro is identical to Save and run on desktop IE. That is, IE Metro will prompt you to run a downloaded file–assuming it passed the SmartScreen security screening–as shown in Figure 7‑16.

All files downloaded through the Metro environment are automatically scanned before you’re allowed to open them.

Figure 7‑16: You’re prompted to run files downloaded from IE Metro.

Searching the Web

Searching the web from a web browser has evolved over the years, with desktop versions of Internet Explorer first offering a dedicated search box and then integrating search directly into the address bar. In the Metro‑style version of Internet Explorer, this capability has been refined yet again: This browser uses the integrated Search contract capabilities of Windows 8 to provide Internet search capabilities.

So you perform a search just as you do in any other Metro‑style app: Open the search pane from the Charms bar and start typing.

Here’s how:

• Touch: Swipe in from the right side of the screen to open the Charms bar and then tap Search.

• Mouse: Move the mouse cursor into the top right or bottom right of the screen and then move the cursor along the right edge of the screen; then, click Search.

• Keyboard: Press Winkey + Q to open the search pane.

However you do it, the search pane will resemble Figure 7‑17.

Figure 7‑17: To trigger an Internet search from IE Metro, you must use the search pane.

As we explained in Chapter 3, the Search contract that backs this functionality is available system‑wide in Windows 8 to any Metro experiences that choose to support it. And many do: This interface is used to search for Metro‑style apps, classic Windows applications, settings and control panels, and files, as well as many different Metro‑style apps–including, as it turns out, Internet Explorer Metro.

Here are a few things to note about this functionality.

First, the default search engine is Bing. This choice is inherited from the desktop version of Internet Explorer and is extremely laborious to change. If you simply want to perform a one‑time search via Google, or some other service, you’re better off navigating to that service’s website manually.