Microsoft has unveiled a dev center called modern.ie bearing resources and tools aimed at helping developers embrace modern standards like CSS3 and HTML5, as well as with a less-than-subtle emphasis on Windows 8 and the latest versions of IE. One company that could benefit from this dev center is, ironically, Microsoft.
Central to modern.ie, currently in beta, is a Web page scanning tool designed to detect common problems in supporting previous versions of IE, to reveal ways for developers to update pages to with work well across various browsers and devices, and to suggest ways developers can add support for new features in Windows 8.
Among other services, the scanner looks for known compatibility issues, determines that the page's frameworks and libraries support the latest versions of Internet Explorer, assesses whether the site has a DocType that recognizes modern Web standards, checks for CSS prefixes that might cause compatibility problems, gauges whether the page uses responsive Web design practices, checks whether a site supports touch-enabled browsing by default, and tells you whether the site has an associated Windows 8 Start Screen tile built for it.
When the scanner detects problems, it provides some details as to what might be the cause and offers suggested remediation.
On a lark, I ran the testing tool against a few Microsoft-owned websites, and the results were interesting.
Microsoft.com didn't have any compatibility issues, per the scan, and it found no issues in running across various browsers and devices. However, Microsoft.com isn't touch-enabled by default, according to the scanning tool, and there's no Window 8 Start Screen tile for the site. The tool helpfully provided the code necessary to enable touch and offered links to more details on setting default touch behavior and on implementing MSPointer APIs. It also provided the code for a Start Screen tile for Windows 8, along with links to a tile-building wizard and an article on how to connect your site to your app.
Moving on to a scan of the Microsoft Store website: The tool found that the site is running an outdated version of jQuery (version 1.4.4), which could prevent users from "[doing] what they want like navigate or view this Web page correctly in Internet Explorer 9 or 10."
The site, per the tool, is missing some vendor-specific CSS prefixes or may have some implemented that aren't necessary. The tool lets you click a button to view the full list of CSS properties detected. In this case, it found eight instances where the -ms- (for Microsoft) and -o- (for Opera) prefixes were missing. The tool also offered a couple of links: one to an article about best practices for using vendor prefixes, and one detailing CSS support in IE.
Additionally, the tool found the Microsoft Store doesn't have an adequately responsive Web page design, such that the layout might not display well on modern browsers designed for smaller or larger screens (Apple iPad, Microsoft Surface, and so on). "This scan currently detects media queries, which may be one of many indicators of responsive Web design; however, it's not a complete scan for all best practices," per the scan results.
To help address these problems, the tool offered links to an article on responsive Web design basics, an article on using responsive Web design for multiple devices, and one on targeting large screens for Xbox.
Finally, like the Microsoft home page, the Microsoft Store site isn't touch-enabled by default and doesn't have a Windows 8 Start Screen tile built for it.
I ran a final scan on the Windows Phone Store site. The results were almost identical to those of the Windows Store scan: jQuery issues, responsive design issues, no default touch-browsing, and no Windows 8 tile. The difference was that the Windows Phone site's use of CSS prefixes did not raise any flags, but the tool did flag a browser-detection issue. Specifically, "we've found that this Web page may be using browser detection techniques to determine how the Web page should render across many different versions of browsers. We suggest that you implement feature detection -- a practice that first determines if a browser or device supports a specific feature and then chooses the best experience to render based on this information."
Here, the tool let me click a button to see what source had prompted the flag (it was an navigator.userAgent in a line of code). It also pointed to two articles: One about feature detection, and one to download Modernizr, a JavaScript library that detects HTML5 and CSS3 features in a user's browser.
Beyond the scanning tool, the modern.ie site currently offers three free months of free virtual testing through BrowserStack (which requires logging in a Facebook account), as well as back-level virtual versions of Windows and Internet Explorer for local testing. VMs for Mac and Linux are coming soon, per the site.
This story, "Microsoft's new Web-scanning tool finds company's own sites lacking," was originally published at InfoWorld.com. Get the first word on what the important tech news really means with the InfoWorld Tech Watch blog. For the latest developments in business technology news, follow InfoWorld.com on Twitter.