Google Chrome, Metro-Style

Windows 8 is a pretty bold new move for Microsoft. It’s bright, vivid, touch friendly and puts apps and contents way up top. It appears to have ditched the traditional desktop metaphor and filesystem. Apps look very different. Here’s what Internet Explorer 10 looks like:

IE10.png

That new look and feel for apps is being referred to as “Metro-style”. Metro-style apps run fullscreen and navigation happens through edge-activated interfaces. While I’m concerned about discoverability for edge-activated interface controls (essentially this is classic mystery meat navigation), I do like that apps are full-screen and that Metro-style apps ditch all archaic notions of UI chrome.

Which brings me to Google Chrome, capital C. Really great browser, my such of choice. From a high-level perspective, Google built this browser to accelerate the pace of web technology development, so that Googles own web-apps — Gmail, Calendar, Docs — could adopt newer features sooner. To that end, Google has gone to great lengths to make sure Chrome is not only cross-platform (Windows, Mac, Linux, soon Android), but that Chrome looks native to each platform. This tenet has been taken to the extreme, actually, with Chrome on Windows XP featuring the horrible “Luna” skin, and Chrome on Linux more or less establishing GTK as the de-facto UI toolkit on the platform, just to be able to use said toolkit. It’s really quite impressive, the amount of work put into making Chrome not only look native, but be native.

Of course we’re only on the cusp of the future. The next round of operating systems are likely to be much more mobile inspired. Windows is blazing a trail with adopting the Windows Phone Metro UI, OSX is likely to become even more iOS-like, and Ubuntu is already exploring more touch-friendly UIs. If Google is going to keep following the path of full-on nativity, Chrome engineers are going to be having some nasty headaches in the not too distant future. Is it even technically possible to replace Internet Explorer 10 as your browser of choice? With Windows 8 treating HTML5 web-apps as first-class citizens among native apps, it’s likely that IE is baked in to the operating system more deeply than it ever was before.

It’s also an interesting mind-game, imagining what Google Chrome would look like, if it were to theoretically be re-written as a Metro-style Windows 8 app. The Metro-style UI is already so minimalist in layout, icon style and even interaction patterns that it’s difficult to think of Metro-style Chrome looking very much different from IE10. The racing-car diagonal tabs for instance, which are important to Chrome’s branding, are hard to translate to Metro-style. Though I suppose if Google were to go this way, they could make their tabs look similar to those of the Android Honeycomb browser (which is likely to spell the direction of how Chrome will look like on Android, once that happens).

Will it happen? I think so, but I think Google will want to play the wait-and-see game for a while. Just like Android Ice Cream Sandwich may be a make-or-break proposition for Google, so do I think that Windows 8 is for Microsoft. Could be that Windows 8 adoption is too slow to worry about. Could be Google’s already working on Metro-style Chrome.

IE9s “Pinned Websites”

Paul Thurrott has the lowdown on the new IE9. It takes the Chrome approach: websites are apps, and the browser should get out of the way. One new thing is that Windows 7 users will be able to pin bookmarks to the taskbar just as though they were apps:

IE 9 allows you to pin web site shortcuts to the Windows taskbar and Start menu just as you would application shortcuts. To do so, you drag the site icon from the One Box (address bar) to either location. If you’re familiar with how this works with applications, there are no huge surprises. But when you do pin a web site, the IE window will reappear with automatic customizations: The Home button is gone, replaced by a new site home button that appears to the left of the Back button. The Back and Forward buttons are colorized to match the site design. And the pinned shortcut gets some default jump list items, assuming the site hasn’t customized that.

Paul has already done this to his own site, and perusing “View source”, I found out more. The pinned taskbar icon will be derived from the sites favicon (good luck with that, Mozillas tried to tackle their low res back in the day). In addition to this, Microsoft wants you to add a few lines of vendor specific meta tags:

<meta name="msapplication-tooltip" content="SuperSite for Windows" /> 
<meta name="msapplication-task" content="name=Windows 7;action-uri=/win7;icon-uri=/images/icon_win7.ico" /> 
<meta name="msapplication-task" content="name=Windows Phone 7;action-uri=/mobile;icon-uri=/images/icon_phone.ico" /> 

This is a different approach than that of Google, which — to be fair — pioneered this whole “the web is the app” strategy. Chrome Web-Apps may not be integrated in your Windows 7 taskbar, but they will be pinned to your Chrome browser and synced. Chrome Web-Apps are bundled in zip files containing icons and permission lists, and you’ll be able to buy these bundles in the Chrome Web-App Store. While either strategy may fail, Googles is certainly the most ambitious one.

Internet Explorer 9 Beta video leaks, here’s a few thoughts on the revamped UI [Update]

I have a feeling this video somehow doesn’t tell the whole story about the UI (or is fake), but it’s so interesting I’ll give a few comments.

IE9_beta_leak.png
  • The tabs next to the address bar? Sure doesn’t leave a lot of space for tabs. Could it be Microsofts attempt at solving the tab overflow issue? If 10 tabs are open, do three of them show up next to the addressbar, and 7 of them below?
  • The move towards tabs on top has been gaining momentum ever since Chrome appeared out of nowhere1, so I half expected IE to jump on this bandwagon (which is a good idea for a variety of reasons).
  • Perhaps the placement of the back/forward and address bar in the bulk of Windows 7 dictated that they had to stay in place to ensure “consistency”?
  • Maybe combined with a desire to mimic the intense minification of UI that goes on in other browsers at the moment, this pushed Microsoft to place the tabs to the right of the addressbar as a last ditch attempt at saving vertical pixels?
  • On a widescreen device, while not a good idea, this is not terrible. Since http:// is now officially dead, and short URLs are the trend, perhaps a combined IE omnibar doesn’t need the lavish width it enjoys in Google Chrome? Perhaps it scales down to, say, 300 pixels in width at the least, revealing a decent amount of extra tab space?
  • Alex Faaborg from Mozilla explained best why tabs on top is a good idea. But with the emergence of Chrome Web-Apps, which are just around the corner, there’s a new, albeit not super strong, argument for disconnecting the addressbar from the tab, and that is that it’s still, despite web-apps, a place people use to launch new webpages. In the case of the omnibar, it’s also where people start searching. In Chrome Web-Apps (here’s an early look), the omnibar is hidden when you’re inside, say, the Google Maps web-app. How do you launch a new page or search? You have to click “new tab” in order to get the omnibar back. Which isn’t a big problem, but nonetheless one IE9s hypothetical future toolbar configuration could eliminate.

On the whole of it, Internet Explorer 9 is interesting only in an infamous way. At best, IE9 can become so standards compliant that us webdesigners can ignore it and let our code degrade gracefully to work in it. At worst, it adds another browser we have to hack towards. That makes four, with IE6, 7, and 8.

[Update]: It looks like I was right in many of these things.

  1. Yep, I know Opera was first, but Chrome somehow brought it to the masses  

Safari Was The First To Fall [Updated]

Pwn2Own 2010:

Pwn2Own 2010 is under way, and after day one of the annual security showdown the results are darn near an exact replica of last year’s. Safari was the first to fall, followed by Internet Explorer 8 on Windows 7. Firefox on Windows 7 x64 was also taken down, as was the iPhone’s mobile Safari. Google Chrome, however, has yet to succumb.

I would have honestly thought Internet Explorer — any of them — would be first to circle the drain.

[Update]: One person makes the interesting observation that Safari is first to be hacked because the prize, the Macbook on which the browser ran, was the nicest of the prizes.

Quick Thoughts On Windows Phone 7

Windows just announced Windows Phone 7 (previously known as Windows Mobile 7). Here’s a video, and after that, some thoughts on the offering.

Musings:

  • I like how the lock screen is not a slider, but a “cover” you slide upwards.
  • I’m noticing the Internet Explorer icon, and thinking to myself: Why not rebrand Internet Explorer Mobile as simply “Internet” and replace the icon with a globe? After strangle-holding the web for half a decade, IE must surely be a tainted brand. Then I remember that to most people, the E means internet. And then I’m sad.
  • I wonder which version of IE it’s running… 8? No rounded corners or drop shadows then.
  • The Xbox Live integration will appeal to a number of people. Not a bad move.
  • The interface looks kinda nice, and — dare I say it — clean and original compared to both iPhone OS and Android. I’m told this is the Zune look. Which is ironic, because Zune was originally advertised as bidding you “welcome to the social”. Which of course becomes somewhat easier when you can now finally call someone.
  • It looks like the phone hardware demonstrated has three capacitative buttons, which if you read my column on Androids buttons is two more than just right. Back, Windows logo (probably “home” or “start new app”), and long thing with a circle on the end (probably context menu) [Update]: It’s a Bing key. Incidentally, the more generic “Search” key on my Android phone is my least used button. I think I’ve used it twice in my lifetime ownership of the device.
  • The fact that there’s a smiley on the default SMS texting keyboard… I don’t know… should we read anything in to that? For one thing, I’ll bet you it means WinPhone7 doesn’t leverage the power of HTML5 forms.
  • I wonder if WinPhone7 will be Mac compatible. Catering to the 4% (arguably the important percent) is just not the Microsoft way. One decent alternative would be to not need a computer at all to sync… so that all you had to do to grab music, files, calendar notes, email and everything was to sync to the cloud, or your computer via bluetooth using standardized protocols. The video claims you can “skip the wires and sync over Wi-Fi”. Which, if it works on any computer with a shared network drive, gives this phone a fighting chance, demonstrating how iTunes as sync middle-ware is a last-gen concept.
  • One status update in the demo video from “Anne” reads “Having fun playing at the beach with the twins”. Which we’ll let hang there for a moment. European beach?
  • I’m told version 7 has been underway for quite a while, and has involved a complete rewrite of the code base as opposed to continuing work on WinMo 6.5. Starting from scratch is quite often a really good idea, even if risky.
  • It’s got Bing. Of course it does. Will it allow you to switch that search to Google? Or do they simply ask you go through the browser to do that?
  • The “people” section stresses me out. It’s like walking through the halls at iStockPhoto, constantly wincing to avoid the glare from just-bleached teeth.
  • Let me know if you spot a single instance of the WinMo font set in bold. I haven’t spotted it yet — stylish. The whole “looking through a cutout at a canvas” thing also looks really nice. Actually.
  • Why holiday 2010, why not three years ago?

Invoke Google Chrome Frame When Available

Google recently changed the way you harness the power of Google Chrome Frame in Internet Explorer. Chrome Frame is the plugin which adds Google Chrome as a browser renderer inside Internet Explorer, giving you access to, among other things, HTML5.

Previously, you inserted a simple meta tag. Now you have to send the headers programmatically. Fortunately, that’s not as hard as it sounds.

Paste the following PHP code somewhere in your webpage header template (if you’re using WordPress, simply paste it in your themes functions.php file).

/**
 * Invoke Google Chrome Frame
 */
if(strpos($_SERVER['HTTP_USER_AGENT'], 'chromeframe')) {
	header('X-UA-Compatible: chrome=1');
}

Now you’re done. If Chrome Frame is detected, it’s harnessed.

Quick Thoughts On The IE9 PDC Preview

Good old Microsoft still think they have something to offer the web community. Segway: maybe theydo! Internet Explorer 9 is in the works, and if everything goes according to plan, it’ll sport 2D hardware acceleration (faster and more smooth scaling and rendering of fonts and CSS borders and images), CSS3 support (the interviewer seems to think border-radius is something Microsoft has just invented) and a new faster JavaScript engine. Of course you need Microsoft Silverlight installed to see the videos, this is still Microsoft after all.

I’m assuming the new font rendering engine will eventually propogate to the entirety of Windows; in fact I was expecting it would replace the default font rendering engine in Windows 7 which was not the case. Until then, if IE9 really does smooth fonts differently from all other apps on the system, it’ll be the odd man out, just like Safari and iTunes were until they ditched their custom smoothing.

The rest of the hardware acceleration (for CSS, images and so on) is intriguing, however. It’s DirectX based, so it’s Windows only (again, what did you expect). This could potentially put IE9 back on the map as a semi-serious contender. On the other hand, WebKit has WebGL on the way, and Google will no doubt do what they can to speed up webapps with their Chrome OS. It’ll be interesting to see this play out.

IE9.jpg

The CSS3 support is welcome by default, if only because IE8s lack there-of turned out to be a completely unnecessary and useless stepping stone. As usual, it’ll have little immediate impact for us poor web-developers, as Microsoft refuses to push the browser as a mandatory security update. Even so, I never thought I’d hear Microsoft talking about the ACID3 test. Fun times.

In the video presenting their new faster JavaScript engine, they’re using Gmail as an example of their JS compatability. They’re also comparing to Google Chrome (clearly treated as a competitor now) and Firefox. Is this the new open Microsoft?

So, faster, hardware accelerated and with CSS3 support. All good things. Now what I really need to know is: when will this benefit webdevelopers who’ve struggled with IE6 for nearly a decade. If a browser falls in a forest, and no-one is there to hear it, does it matter if it’s hardware accelerated?