<a href="http://www.omniture.com" mce_href="http://www.omniture.com" title='Web Analytics'><img alt='' border='0' height='1' src="http://mssto.112.2o7.net/b/ss/msstoextblogsnojs/1/H.20.2--NS/0" mce_src="http://mssto.112.2o7.net/b/ss/msstoextblogsnojs/1/H.20.2--NS/0" width='1' /></a>","bodyAsHTML":"New browsers introduce new ways of thinking. IE10 is no different. \r\nThere are compatibility concerns to make your site look awesome \r\neverywhere. So where do you start to learn about this stuff? How about \r\nright here!

Compat Inspector

Compat\r\n Inspector is a JavaScript-based testing tool that analyzes your site \r\nwhile it runs. Compat Inspector watches for patterns of interaction \r\nknown to cause issues and reports them automatically. This allows you to\r\n identify problems quickly without first memorizing a bunch of \r\ndocumentation. See this page to learn how to use it.

To help demonstrate Compat Inspector, known compatibility patterns have been introduced into the tooltip script\r\n used for this page. Use Compat Inspector to learn about the issues \r\npresent in the tooltips above. Just click on the Compat Inspector widget\r\n in the upper right-hand corner of the page to get started.

For a\r\n given reported issue, check the "Verify" checkbox and refresh the page \r\nto temporarily simulate the expected behavior. Focus on one issue at a \r\ntime. Although you can "Verify" multiple issues at once, typically only \r\none represents the root cause of the problem. Continue this process \r\nuntil the tooltips start working correctly. After that, take a look at \r\nthe patched version of the tooltip script.

Touch Input for IE10 and Metro style Apps

The Web is more interactive, fun, and immersive when sites work well with new input devices and touch screens. The Windows Developer Preview\r\n introduces support for handling touch and pen input in your sites and \r\napps. Developers can now ensure their sites work well with touch and \r\nbuild powerful new experiences that make the most of advanced \r\ninput such as multi-touch and gestures. You can see this in action on \r\nthe IE Test Drive site in the new and updated demos Touch Effects, Lasso Birds, and Flying Images.

Internet Explorer 10 Compatibility Cookbook

The Internet Explorer 10 Compatibility Cookbook is\r\n designed to help you understand changes in Internet Explorer 10 that \r\nmight impact applications that you developed for earlier versions of \r\nWindows Internet Explorer. Many changes help Internet Explorer comply \r\nwith broader industry standards, and other changes improve performance \r\nand reliability.

The Internet Explorer 10 Compatibility Cookbook includes\r\n information about changes to features, identifies features that are \r\ndeprecated or removed, and describes general tools and guidance. New \r\ntopics will be added to this section as features are modified and as \r\nuser feedback identifies areas where more information is needed.

No Browser Left Behind: An HTML5 Adoption Strategy

There’s\r\n a lot to be excited about with HTML5. With new markup, CSS capabilities\r\n and JavaScript APIs, the scope of what’s possible on the Web is growing\r\n by leaps and bounds. Add to that the steady one-upmanship among browser\r\n vendors, and the list of exciting features expands almost daily. From \r\nnightly builds to dev channel releases and regular platform previews, \r\nbrowsers are changing fast and Web developers everywhere are going along\r\n for the exhilarating ride.

But as much as the development and \r\nbrowser communities are pushing the HTML5 hype up to a fever pitch, the \r\nvast majority of people on the Web aren’t using the brand-new browsers \r\nand versions that we are. If you’re a Web developer in a large \r\ndevelopment shop or an enterprise with a large user base, you probably \r\nalready know this. Even if you’re working with a small shop or startup \r\nproviding some service via the Web, you probably spend a lot of time \r\nmaking sure your site caters to as many browsers and browser versions as\r\n possible.

Internet Explorer 10 Guide for Developers

The\r\n Internet Explorer 10 Guide for Developers provides a look at the \r\ndeveloper features included in Internet Explorer 10, as well as the \r\nlatest HTML5, JavaScript, and Cascading Style Sheets, Level 3 (CSS3) \r\nfeatures available to developers of Windows Store apps using JavaScript \r\nfor Windows 8. By using the documentation and samples in this guide, \r\ndevelopers and designers can take full advantage of these new features.

iOS to IE10 Metro: Building Cross-Browser Plugin-Free Experiences

I’ve had the good fortune of working with my friend Jonathan Sampson\r\n recently on figuring out how to help developers build plugin-free \r\nexperiences. With IE10 Metro going plugin-free, it’s incredibly \r\nimportant to document steps to help developers provide their users with \r\ngreat experiences without the need for proprietary 3rd party add-ons.

If you’ve built a plug-in-free browsing experience for the iPad, a few changes will make it ready for the new IE10 plug-in-free experience\r\n on Windows 8. As more browsers adopt the plug-in-free approach, now is a\r\n good time to start thinking about it. I’ll show you how to do this in a\r\n few steps below by writing code that works well in all modern browsers.

Fix Common IE Problems: Update your Docmode for Web Standards

Document\r\n compatibility defines how a browser renders your website. The more \r\nspecific you are at telling the browser what to expect, the better the \r\nexperience for your users. When using web standards like HTML5, start by\r\n explicitly declaring the HTML5 document type:

<!DOCTYPE html>

This markup triggers standards mode in Internet Explorer 9 and 10. And it also works well in Chrome and Firefox.

Browsing Without Plug-ins

Because\r\n more and more browsing takes place on an ever wider variety of devices,\r\n and browsers on them, more and more consumers are browsing without \r\nplug-ins. Delivering a great site experience to consumers who browse the\r\n Web plug-in free is important work that sites must do to reach the \r\nwidest audience. With HTML5, modern browsers and sites can deliver a \r\ngreat consumer experience even without plug-ins.

“Plug-in” refers broadly to browser extensions that run native client code using low-level browser interfaces.  For example, here\r\n is a basic description of Webkit’s approach; the IE equivalents are \r\nActiveX controls and Browser Helper Objects. Web sites use a wide \r\nvariety of plug-ins; Adobe Flash is one of the most common.

 

 

\r\n\r\n","author":{"id":954995,"username":"Jerry Nixon","realname":null,"emailHash":"1679f0ca80c657f1fca8fbcc74eeefe1","avatar":"https://secure.gravatar.com/avatar/1679f0ca80c657f1fca8fbcc74eeefe1?d=identicon&r=PG","reputation":0},"activeRevisionId":542166,"revisionIds":[542166,542165,542164,542163,542162],"lastActiveUserId":954995,"lastActiveDate":1348740918000,"parentId":null,"parentAuthor":null,"originalParentId":null,"childrenIds":[],"commentIds":[],"marked":true,"topics":["web design","microsoft","windows","css","tutorial","html5","windows8","ie10","browers","internetexplorer"],"primaryContainerId":8,"containerIds":[7,8],"plug":"what-web-developers-need-know","wiki":false,"score":0,"depth":0},"enableThreadedComments":true,"portal":{"topic":{"id":"35","type":"topic","creationDate":1434655010000,"creationDateFormatted":"06/18/2015 07:16 PM","name":"html5","createdBy":{"id":2,"username":"matt"},"parentTopics":[],"childTopics":[],"usedCount":4232},"blurb":"Web programming news and training resources from DZone, the trusted source for learning advanced software design, web development and devops best practices.","code":"webdev","id":11,"creationDate":1434673979000,"creationDateFormatted":"06/19/2015 12:32 AM","displayTitle":"Web Developer Zone: Javascript, PHP, HTML & CSS news, tutorials & tools","title":"Web Dev","new":false,"order":11,"shortTitle":"web-development-programming-tutorials-tools-news","color":"orange","pageTitle":"Web Developer Tutorials, Tools, News & Jobs - DZone","active":true,"modificationDate":1437510529000,"modificationDateFormatted":"07/21/2015 08:28 PM"},"contentType":"article"}],"loadedStyles":[["/lib/bootstrap/bootstrap.less","/lib/font-awesome/font-awesome.less","/lib/fontello/css/fontello.css","/lib/fontello/css/animation.css","/lib/angular-ui/select.css","/lib/ngDialog/css/ngDialog.css","/less/ngDialog-theme.less","/lib/bootstrap-switch/bootstrap-switch.css","/less/dzone20.less","/less/fonts.less","/less/directives.less","/lib/slick/slick.css","/lib/bootstrap-slider/bootstrap-slider.css","/less/layout.less","/widgets/article/content/article-content.less","/widgets/article/infoBar/widget.less","/widgets/components/slider/widget.less","/widgets/content/commentsSlider/widget.less","/widgets/header/blackBar/widget.less","/widgets/header/main/header-common.less","/widgets/header/main/widget.less","/widgets/sidebar/content/list/list.less","/widgets/sidebar/tapBar/sidebar-list.less","/widgets/sidebar/tapBar/widget.less","/widgets/users/UserHomeMiniProfile/widget.less"]],"loadedScripts":[["/lib/jquery/jquery.js","/lib/lodash/lodash.js","/lib/moment/moment.js","/scripts/utils.js","/lib/angular/angular.js","/lib/angular/angular-sanitize.js","/lib/local-storage/angular-local-storage.js","/lib/angular-ui/bootstrap.js","/lib/angular-ui/select.js","/lib/bootstrap-switch/bootstrap-switch.js","/lib/ngDialog/js/ngDialog.js","/lib/angular-moment/angular-moment.js","/scripts/app.js","/scripts/socket.js","/scripts/services.js","/scripts/ui-services.js","/scripts/directives.js","/scripts/filters.js","/lib/angular-touch/angular-touch.min.js","/lib/elastic/elastic.js","/lib/ng-file-upload/angular-file-upload-all.js","/lib/angular-deckgrid/angular-deckgrid.js","/scripts/dzone.js","/scripts/ads.js","/scripts/head.js","/scripts/links.js","/scripts/utilities/directives.js","/scripts/utilities/services.js","/scripts/utilities/image-editor.js","/lib/bootstrap-slider/bootstrap-slider.js","/lib/bootstrap-slider/directive.js","/lib/angular-draganddrop/draganddrop.js","/widgets/article/content/utils.js","/widgets/article/infoBar/services.js","/widgets/components/slider/service.js","/widgets/header/main/angulartics-ga.js","/widgets/header/main/angulartics.js","/widgets/header/main/resize.js","/widgets/sidebar/content/list/service.js","/widgets/sidebar/tapBar/directive.js","/widgets/sidebar/tapBar/service.js"]],"TH_CSRF":"4700446507207199924","botInfo":[{"isRenderBot":false}],"request":[{"site":{"id":7,"title":"DZone: Programming & DevOps news, tutorials & tools","keywords":"programming, software development, devops, java, agile, web, iot, database, mobile, big data, cloud","description":"Programming, Web Development, and DevOps news, tutorials and tools for beginners to experts. Hundreds of free publications, over 1M members, totally free.","name":"DZone.com"},"dev":false,"cdn":["dz2cdn1.dzone.com","dz2cdn2.dzone.com","dz2cdn3.dzone.com","dz2cdn4.dzone.com"],"theme":"dz20","context":"","user":{"id":2500002,"authenticated":false,"name":"Anonymous","realName":null,"avatar":"https://secure.gravatar.com/avatar/?d=identicon&r=PG","profile":"/users/2500002/anon-user.html"}}],"portals":[[{"topic":8,"id":2,"shortTitle":"agile-methodology-training-tools-news","color":"red","name":"Agile","code":"agile","url":"/agile-methodology-training-tools-news"},{"topic":6129,"id":3,"shortTitle":"big-data-analytics-tutorials-tools-news","color":"green","name":"Big Data","code":"big-data","url":"/big-data-analytics-tutorials-tools-news"},{"topic":30,"id":4,"shortTitle":"cloud-computing-tutorials-tools-news","color":"orange","name":"Cloud","code":"cloud","url":"/cloud-computing-tutorials-tools-news"},{"topic":59,"id":5,"shortTitle":"database-sql-nosql-tutorials-tools-news","color":"purple","name":"Database","code":"database","url":"/database-sql-nosql-tutorials-tools-news"},{"topic":31,"id":6,"shortTitle":"devops-tutorials-tools-news","color":"yellow","name":"DevOps","code":"devops","url":"/devops-tutorials-tools-news"},{"topic":1138,"id":7,"shortTitle":"enterprise-integration-training-tools-news","color":"green","name":"Integration","code":"integration","url":"/enterprise-integration-training-tools-news"},{"topic":48,"id":8,"shortTitle":"iot-developer-tutorials-tools-news-reviews","color":"orange","name":"IoT","code":"iot","url":"/iot-developer-tutorials-tools-news-reviews"},{"topic":1,"id":1,"shortTitle":"java-jdk-development-tutorials-tools-news","color":"purple","name":"Java","code":"java","url":"/java-jdk-development-tutorials-tools-news"},{"topic":29,"id":9,"shortTitle":"mobile-app-developer-tutorials-tools-news","color":"yellow","name":"Mobile","code":"mobile","url":"/mobile-app-developer-tutorials-tools-news"},{"topic":653,"id":10,"shortTitle":"apm-tools-performance-monitoring-optimization","color":"red","name":"Performance","code":"performance","url":"/apm-tools-performance-monitoring-optimization"},{"topic":35,"id":11,"shortTitle":"web-development-programming-tutorials-tools-news","color":"orange","name":"Web Dev","code":"webdev","url":"/web-development-programming-tutorials-tools-news"}]],"matchedUrl":{"name":"dzone:articles:view","mapping":"/articles/**","mappingPatterns":{}},"requiresModule":["angulartics","angulartics.google.analytics","dndLists","generalDirectives","monospaced.elastic","angularFileUpload","akoenig.deckgrid","ui.bootstrap-slider","ngSanitize","ui.select","ui.bootstrap","angularMoment","ngTouch","ngDialog","LocalStorageModule"]}; } catch(e) { console.error(e); }
4
Notification
  • Adam Van Grack started following you

  • Jessica Conaghan, Gumption Scott and 6 commented on a link you posted

    T-Mobile Unvells Cheaper, More Basic 'Simple Prepaid' Phone Plans

  • Jessica Conaghan replied on a comment you posted

    CSS counters are one of those "oh neat, didn't know CSS could do that" features with a lot of Xubuntu 14.10 Utopic Unicorn is the latest release of xubuntu based on Ubuntu 14.10

  • Jessica Conaghan started following you

See All
POWERED BY DZone TeamHub
","source":"http://blog.jerrynixon.com/2012/09/what-web-developers-need-to-know-about.html","views":15502,"articleDate":1348740918000,"tldr":null,"originalSource":"http://blog.jerrynixon.com/2012/09/what-web-developers-need-to-know-about.html","published":true,"nComments":0,"articleType":""}]; WMODEL_DATA.perms = {"canDecidePick":false,"canPublish":false}; WMODEL_DATA.isPreview = false; WMODEL_DATA.OPTIONS = {}; TH.installWidgetController('article.content', 'articleContent7', WMODEL_DATA, typeof controller == 'function' ? controller : null, [{name: 'partners', data: true},{name: 'DEFAULT', data: true}], ' oUhbblYOaqbcblYOaqbcC', null); })(); (function() { function controller($scope, $service, $location, SideBarService, TH$Request) { SideBarService.ctx.pageSize = $scope.pageSize; SideBarService.ctx.isPreview = $scope.isPreview; SideBarService.ctx.mode = $scope.mode; SideBarService.fn.loader = $service; SideBarService.fn.scrollCheck = function() { $scope.$emit('thIfScrollCheck'); }; var currentFilter; $scope.$on('$locationChangeSuccess', function() { if (!$location.search().filter) { $scope.filter = 'latest'; } else { $scope.filter = $location.search().filter; if ($scope.filter == 'latest') { $location.search('filter', null); } } if (currentFilter == $scope.filter) { return; } currentFilter = $scope.filter; SideBarService.ctx.filter = $scope.filter; }); $scope.display = SideBarService.getList(); $scope.$watchCollection(function() { return SideBarService.getList(); }, function (n) { $scope.display = n; }); $scope.isActive = SideBarService.isActive; $scope.isExcluded = SideBarService.isExcluded; $scope.loadMore = SideBarService.load; $scope.loading = function() { return SideBarService.ctx.loading; } } var WMODEL_DATA = {}; WMODEL_DATA.pageSize = 20; WMODEL_DATA.isPreview = false; WMODEL_DATA.OPTIONS = {}; WMODEL_DATA.mode = null; TH.installWidgetController('sidebar.content.list', 'sidebarContentList10', WMODEL_DATA, typeof controller == 'function' ? controller : null, [{name: 'DEFAULT', data: true}], ' oUhbkSMaaqbcdvVkcC', null); })(); (function() { var WMODEL_DATA = {}; WMODEL_DATA.OPTIONS = {}; TH.installWidgetController('sidebar.tapBar', 'sidebar', WMODEL_DATA, typeof controller == 'function' ? controller : null, null, ' oUhbkSMadabfWVcC oUhbkSMadabbWQbVkcC', null); })(); (function() { function controller($scope, shareThis, TH$Dialog, TH$Service) { $scope.getEditUrl = function(id, type) { if (!type || type == 'article') { return '/content/' + id + '/edit.html'; } else { return '/dzone/staff/' + type + (type == 'refcard' ? 'z' : 's') + '/' + id + '/edit.html'; } } $scope.share = function(socialNet, url, title){ shareThis.shareThis(socialNet, url, title); }; $scope.canDelete = function(article) { return article.canDelete; } $scope.edit = function(link) { TH$Dialog.open({ loadWidget: 'links.postPreview', widgetArgs: { edit: link.id }, size: 'xbig' }).then(function (result) { $scope.link.title = result.title; $scope.link.linkDescription = result.content; $scope.link.thumb = result.thumb; $scope.link.tags = result.topics; }); }; $scope.deleteLink = function(article) { var title = article.title; var type = 'link'; if(article.header){ title = (article.header.type == 'article') ? article.header.title : article.title; type = (article.header.type == 'article') ? 'article' : 'link'; } TH$Dialog.confirm('Do you want to delete "' + title + '"?').then(function() { return TH$Service.action('delete', {type: type, id: article.id}); }).then(function() { article.deleted = true; }); }; } var WMODEL_DATA = {}; WMODEL_DATA.OPTIONS = {}; TH.installWidgetController('content.commentsSlider', 'contentCommentsSlider9', WMODEL_DATA, typeof controller == 'function' ? controller : null, null, ' oUhbaqbcaibvnWffWVcC', null); })(); (function() { var WMODEL_DATA = {}; WMODEL_DATA.name = "commentsSlider"; WMODEL_DATA.slot = null; WMODEL_DATA.OPTIONS = {"name":"commentsSlider"}; TH.installWidgetController('components.slider', 'componentsSlider8', WMODEL_DATA, typeof controller == 'function' ? controller : null, null, ' oUhballbvbdSaoUhM', null); })();