Microsoft Edge: What designers need to know

Ben Moss.
May 01, 2015
Microsoft Edge: What designers need to know.

This week Microsoft introduced its new browser, Edge, the project that had formerly been known as Project Spartan. Much has been made of its Hub feature, and the ability to add personal annotations to websites. However, these features are aimed at regular users, web designers will use the browser in quite a different way; whilst it’s unlikely that the majority of web designers will switch to Edge as their primary browser, the majority of us will be using it on a daily basis to test code. Whilst we don’t know exactly how Edge will perform until we get hands-on with it, there are some things we do know, and others that we can infer.

A change of approach

When I first saw the Edge announcement, what struck me most was the change in emphasis embodied by its logo. Brands are designed to a brief handed down from board level, and so the change of identity likely mimics similar briefs being handed down to development teams. logo-compare In Internet Explorer’s logo, the e’ sits motionless as the rotation occurs around it; for Microsoft, IE was literally the center of the Web, with all other technologies orbiting it. [pullquote]Microsoft no longer sees itself as the center of the Web[/pullquote] In Edge’s logo, the orbital ring has been dropped, and the rotation is now part of the e’ itself; as well as being more minimal, it’s also more humble; Microsoft no longer sees itself as the center of the Web. This change indicates a shift in approach and hints at an increasing awareness of a wider set of interests, from cross-corporation cooperation, to adherance to web standards. The other notable thing about the logo is that the stroke on the e’ opens up the aperture, making the character far more legible at smaller devices sizes. An indication that Microsoft has finally embraced mobile.

Mobile focus

Even the least informed companies are aware of the growth of the mobile web, so it’s hardly surprising that Microsoft Edge is aimed squarely at the mobile market. Mobile appears to be one of the key areas to have persuaded the Microsoft board of the need for change. According to netmarketshare​.com, IE has a 56% share of desktop browsing, but only a 2.05% share of the mobile browser market. A far cry from the days when the company boasted over 90% of all online traffic. We’ve been told that Edge will be the only browser pre-installed on Windows mobile devices, and will be, for the time-being, an optional download on desktops. Many businesses are slow to upgrade desktop machines — it’s truly frightening how many are still using XP — so the decision to run two browsers in parallel frees up Edge to make ground in the mobile market, whilst still allowing luddites their comfort blanket. What has not been made public is whether Edge will be available on Android or iOS devices. However, given that global Android sales are 400% that of Windows Mobile sales, it seems inevitable that in order to make inroads into the mobile market, Microsoft will have to port Edge to other platforms. An Android version is probably in the works, and an iOS version is likely to follow. What this means is that we’ll be facing not one, but three new browsers to test on. How consistent they will be, or the timescale for their introduction is unknown, probably even by Microsoft.

Evolution, not revolution

Despite Microsoft’s marketing, Edge is not a revolutionary browser, at least not as far as web designers are concerned. According to caniuse​.com CSS support in Edge is roughly 6% better than IE11, exactly the same rate of progression from IE10 to IE11. The steady pace suggests that under the hood, Edge is very much IE12. [pullquote]under the hood, Edge is very much IE12[/pullquote] However Edge still only supports 75% of what Chrome offers, and there are some extremely disappointing omissions: Edge does not support the Picture element, which is central to plans to finally resolve responsive images. Thankfully there is partial support for srcset, albeit a subset of the full spec. There is partial support for the Grid Layout specification, although support is for an older spec. This seems to mimic IE’s Flexbox support, which began as support for an older spec before full support was later added. This approach seems to work for Microsoft, but it will leave us dependent on browser prefixes for some years to come. Unfortunately CSS Filters haven’t made it into the build, meaning Photoshop image effects are still dependent on Photoshop. But in keeping with the mobile push, Edge does offer support for touch events, the first Microsoft browser to do so.

Conclusion

Microsoft Edge is a lighter, faster browser than the unfairly maligned Internet Explorer, but most of its innovations come for users. For web designers taking Edge into account when designing and building websites, the most significant thing about Edge may be the rate at which it encourages users to abandon legacy versions of Internet Explorer. Edge’s advances don’t exceed those of the last two versions of Internet Explorer, but perhaps the change of name is the final piece of the puzzle required for web designers to accept the fact that Microsoft finally has a decent browser.

Ben Moss

Ben Moss is Senior Editor at WebdesignerDepot. He’s designed and coded work for award-winning startups, and global names including IBM, UBS, and the FBI. One of these days he’ll run a sub-4hr marathon. Say hi on Twitter.

Read Next

Apple Opts for AR over VR at WWDC

An Apple VR headset has been one of the most widely-rumored devices of the last few years, and it was finally settled a…

Exciting New Tools for Designers, June 2023

We’re halfway through 2023 already, and the number of incredible apps, tools, and resources for designers is mounting.

3 Essential Design Trends, June 2023

This month we are focusing on three trends within a bigger website design trend – different navigation menu styles and …

15 Best New Fonts, May 2023

The choices you make when selecting a typeface have more impact on your design than almost any other decision, so it’s …

10+ Best Tools & Resources for Web Designers and Agencies (2023 updated)

Having the ability to envision a tastefully designed website (i.e., the role creativity plays) is important. But being …

20 Best New Websites, May 2023

This month, there are tons of great new agency websites to get excited about. 3D animated prisms are a popular theme, a…

How to Find the Right White Label Website Builder for Your Agency

Web design agencies face a lot of obstacles in closing the deal with new clients. One of the most common ones is the ar…

Exciting New Tools For Designers, May 2023

There are hundreds of new tools for designers and developers released each month. We sift through them all to bring you…

3 Essential Design Trends, May 2023

All three of the website design trends here mimic something bigger going on in the tech space, from a desire to have mo…

10 Best AI Tools for Web Designers (2023)

It’s time to stop worrying if AI is going to take your job and instead start using AI to expand the services you can of…

10 Best Marketing Agency Websites (Examples, Inspo, and Templates!)

Marketers are skilled in developing strategies, producing visual assets, writing text with high impact, and optimizing …

15 Best New Fonts, April 2023

Fonts are a designer’s best friend. They add personality to our designs and enable fine typography to elevate the quali…