1 / 29

Pinned Sites Internet Explorer 9

tate
Download Presentation

Pinned Sites Internet Explorer 9

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript


    1. Pinned Sites + Internet Explorer 9 Presenter Name Presenter Title

    2. Agenda The Web and Windows Theater vs. Play Who’s Using It Today Bringing it all Together 2

    3. The Web and Windows

    4. Web Browsing is Core to the Windows Experience 4

    5. Expectations are Rising for the Web The capabilities of the web are increasing every day, but the way we experience the web isn’t keeping up. 5

    6. And What About all Those Apps? 6

    7. The Browser is the Theater, not the Play 7

    8. Native Web, through Windows Putting the focus on your sites 8

    9. Pinned Sites Presenter Presenter Title Demo

    10. Behind The Scenes: Pinned Sites 10

    11. A Look At How Pinned Sites Are Being Used Today Real World Pinned Sited

    12. Let’s Build It!

    13. Getting Started 13

    14. Customize Your Pinned Site 14 Use meta elements to provide specific information <meta name="application-name" content="Pinned Name" /> <meta name="msapplication-tooltip" content="Start Site" /> <meta name="msapplication-starturl" content="http://host/page.htm" /> <meta name="msapplication-window" content="width=1024;height=768" /> <meta name="msapplication-navbutton-color" content="#FF3300" />

    15. Programmatically Pinning Your Site 15 if (window.external.msIsSiteMode) { if (window.external.msIsSiteMode()) { // we are already in site mode } else { // Show HTML elements that will promote the // addition of a pin site to the Programs menu window.external.msAddSiteMode() } }

    16. Customizing The Icon 16 Uses existing, same markup to specify the icon to use Uses the existing, standards based site favicon <link rel="shortcut icon" href="/favicon.ico" /> Best Practice: Icon file should contain Recommended: 16x16, 32x32, 48x48 Optimal: 16x16, 24x24, 32x32, 64x64

    17. Pinned Site Basics Presenter Presenter Title Demo

    18. Adding Icon Overlays 18 Provide users with notifications or progress updates window.external.msSiteModeSetIconOverlay( 'http://host/star.ico', 'Complete'); window.external.msSiteModeClearIconOverlay();

    19. Icon Overlays Presenter Presenter Title Demo

    20. Adding Jump List Tasks 20 Windows 7 integration <meta name="msapplication-task" content="name=New Message; action-uri=http://host/NewMail.htm; icon-uri=http://host/mail.ico"/> <meta name="msapplication-task" content="name=New Appointment; action-uri=http://host2/NewAppt.htm; icon-uri=http://host2/Appt.ico"/>

    21. Customizing Jump Lists 21 Adding a custom Jump List category window.external.msSiteModeCreateJumplist('Notifications'); window.external. msSiteModeAddJumpListItem( 'Scrum (37 minutes overdue)', 'http://host/reminders.html', 'http://host/images/bell.ico'); window.external. msSiteModeShowJumpList();

    22. Adding Jump Lists Presenter Presenter Title Demo

    23. Displaying Thumbnail Toolbar Buttons 23 var but1 = window.external.msSiteModeAddThumbBarButton( 'http://host/speaker.ico', 'Mute'); document.addEventListener( 'msthumbnailclick', handler, false); window.external.msSiteModeShowThumbBar();

    24. Updating Thumbnail Toolbar Buttons 24 Changing the Button Properties window.external.msSiteModeUpdateThumbBarButton( buttonID, Enabled, Visible) Changing the Button Style var style1 = window.external.msSiteModeAddButtonStyle( buttonID, IconUrl, ToolTip) window.external.msSiteModeShowButtonStyle(buttonID, styleID);

    25. Adding Thumbnail Toolbar Buttons Presenter Presenter Title Demo

    26. Internet Explorer 9 Makes Your Web Look and Perform as if it Were Native to Windows 26

    27. Unlock a More Beautiful Web 27

    28. Questions

    29. Resources 29

More Related