SlideShare uma empresa Scribd logo
1 de 8
Device Channels
Prepared by : Prashanth BS
Advantages
• Enables you to render certain site content, style your content, and
even change images—while maintaining the same URL across a
pool of different devices.
• Target devices - Target different designs based on user agent
string for different devices. Device channels can be ordered and
stored in a list.
• Define channels for single devices or group of devices and Assign
alternate “Master Pages” per channel
• Ranking device channels - It helps for proper traffic routing by
ordering the most specific rules at the top for higher priority.
• To define a mobile fallback Device Channel you have to define
only one Device Inclusion Rule which has to be equal to
$FALLBACKMOBILEUSERAGENTS
• Selectively include or exclude portion of page layouts per
channel - Content inside a device channel panel is not rendered
at all on the non-specified channels hence reduces the rendered
size of a page for devices by eliminating bulky content. This
provides a way to increase site responsiveness on bandwidth-
constrained devices.
• Image Renditions - helps you improve the user experience of
your website by optimizing images.
• From troubleshooting point of view where the user and the
helpdesk employee would see the same interface despite the
possible differences in their screen resolutions or browser
window sizes.
Advantages
• This feature is only available for publishing sites.
• Multiple Master page needs to created, since every channel
needs to be associated with a Master page
• You can have a maximum of 10 device channels including the
default configured on a specific site for an on-premises
installation, and a total of two device channels when using
SharePoint Online.
• 150 inclusion rules per device channel.
• Device Channels are designed to help you provide the visitors if
your website with the best User Experience suitable for their
device. They are in no way a security measure and you shouldn’t
be using Device Channels to hide confidential data from your
visitors. Because anonymous users can switch between Device
Channels using query string parameters or cookies, using Device
Channels for security purposes is a bad idea and could lead to
disclosing confidential information to general public.
Limitations
Device Channels Responsive Web Design
Device management
Uses the identity of the browser on
the particular device to decide
which presentation style to use
Property management
Uses a device’s screen size to
determine the presentation layer
Different HTML for every channel
•Will always load the same
experience for the same device
regardless of the browser window
size.
•But depending on how many
different devices your site visitors
use, managing the different devices
and experiences can become
complex.
Same HTML for every device
•Responsive web design can cause
different experiences to be loaded
depending on the size of the
browser window.
Uses different master pages to
ensure that only the relevant
markup is served to users and
therefore optimized performance of
the website.
Changes only the presentation layer
of the website. Although you can
hide some pieces of the page in the
browser using CSS, they are still
present in the website’s code and
therefore loaded.
Device Channels Responsive Web Design
More flexibility
•You can serve different content to
different devices
•You get more flexibility in controlling
the markup of your website for the
different devices
•You can apply additional
optimizations to your website, such as
resizing images and videos server-
side using the renditions capability,
which further improves the
performance and user experience of
your website.
Limited by CSS support and
capabilities
•Same content is served when
using responsive web design.
Custom Vary-By User Agent
response header required
Preferred by Internet search
engines - since the same HTML
is sent to every device, it’s
sufficient for an Internet search
engine to index the content
once, and it can be sure that the
search results will apply the
search query on every device
Device Channels Responsive Web Design
More management
(support for new devices) – Any
new device to be supported will
need a separate Device channel/
inclusion of rule
Future proof (device size)
• Combine responsive web design and SharePoint 2013 device
channels to benefit from the strengths of both approaches
• When combining responsive web design and device channels,
you could use responsive web design to create the baseline
cross-device experience
• By using responsive web design to build the baseline for the
cross-browser experience, we benefit from its future-proofness
and robustness. For the specific exceptions, we can benefit
from the granular control that SharePoint device channels
offer us.
Combining responsive web design and
device channels
Combining responsive web design and
device channels

Mais conteúdo relacionado

Semelhante a Optimize Website Experience with Device Channels

Responsive Web Design
Responsive Web DesignResponsive Web Design
Responsive Web DesignJulia Vi
 
Responsive Web Design.pptx
Responsive Web Design.pptxResponsive Web Design.pptx
Responsive Web Design.pptxAarav Infotech
 
Responsive web design ppt
Responsive web design pptResponsive web design ppt
Responsive web design pptNAWAZ KHAN
 
Overview of Responsive Web Design
Overview of Responsive Web DesignOverview of Responsive Web Design
Overview of Responsive Web DesignPankaj Bajaj
 
SES Berlin OMCap 2013
SES Berlin OMCap 2013SES Berlin OMCap 2013
SES Berlin OMCap 2013Rachel Pasqua
 
Reponsive web design (HTML5 + css3)
Reponsive web design (HTML5 + css3)Reponsive web design (HTML5 + css3)
Reponsive web design (HTML5 + css3)Sandip Jadhav
 
Mastering Responsive Web Design_ Creating Seamless User Experiences.pdf
Mastering Responsive Web Design_ Creating Seamless User Experiences.pdfMastering Responsive Web Design_ Creating Seamless User Experiences.pdf
Mastering Responsive Web Design_ Creating Seamless User Experiences.pdfGerryspeck
 
Dynamic Website Designing
Dynamic Website DesigningDynamic Website Designing
Dynamic Website DesigningOGEN Infosystem
 
Why should we build our website responsive
Why should we build our website responsiveWhy should we build our website responsive
Why should we build our website responsiveOmkarsoft Bangalore
 
Responsive Web Design - Advantages and Best Practice for Sports Direct
Responsive Web Design - Advantages and Best Practice for Sports DirectResponsive Web Design - Advantages and Best Practice for Sports Direct
Responsive Web Design - Advantages and Best Practice for Sports DirectCantarus
 
Responsive Web Design: Advantages & Best Practice - Darrin Adams, Cantarus
Responsive Web Design: Advantages & Best Practice - Darrin Adams, CantarusResponsive Web Design: Advantages & Best Practice - Darrin Adams, Cantarus
Responsive Web Design: Advantages & Best Practice - Darrin Adams, CantarusInternet World
 
Conformance Checklist for Product Owner
Conformance Checklist for Product OwnerConformance Checklist for Product Owner
Conformance Checklist for Product OwnerJatin Kochhar
 
Online tools for Content Development
Online tools for Content DevelopmentOnline tools for Content Development
Online tools for Content Developmentadrianlaranjo111
 
digital marketing[1].pdf
digital marketing[1].pdfdigital marketing[1].pdf
digital marketing[1].pdfTECHCENTRAL3
 

Semelhante a Optimize Website Experience with Device Channels (20)

Responsive Web Design
Responsive Web DesignResponsive Web Design
Responsive Web Design
 
Responsive Web Design.pptx
Responsive Web Design.pptxResponsive Web Design.pptx
Responsive Web Design.pptx
 
Responsive web design ppt
Responsive web design pptResponsive web design ppt
Responsive web design ppt
 
Overview of Responsive Web Design
Overview of Responsive Web DesignOverview of Responsive Web Design
Overview of Responsive Web Design
 
SES Berlin OMCap 2013
SES Berlin OMCap 2013SES Berlin OMCap 2013
SES Berlin OMCap 2013
 
reponsive-web-design.pptx
reponsive-web-design.pptxreponsive-web-design.pptx
reponsive-web-design.pptx
 
reponsive-web-design.pptx
reponsive-web-design.pptxreponsive-web-design.pptx
reponsive-web-design.pptx
 
Reponsive web design (HTML5 + css3)
Reponsive web design (HTML5 + css3)Reponsive web design (HTML5 + css3)
Reponsive web design (HTML5 + css3)
 
Mastering Responsive Web Design_ Creating Seamless User Experiences.pdf
Mastering Responsive Web Design_ Creating Seamless User Experiences.pdfMastering Responsive Web Design_ Creating Seamless User Experiences.pdf
Mastering Responsive Web Design_ Creating Seamless User Experiences.pdf
 
Dynamic Website
Dynamic Website Dynamic Website
Dynamic Website
 
Dynamic Website Designing
Dynamic Website DesigningDynamic Website Designing
Dynamic Website Designing
 
Why should we build our website responsive
Why should we build our website responsiveWhy should we build our website responsive
Why should we build our website responsive
 
Responsive
ResponsiveResponsive
Responsive
 
Responsive Web Site Design
Responsive Web Site DesignResponsive Web Site Design
Responsive Web Site Design
 
Responsive Web Design - Advantages and Best Practice for Sports Direct
Responsive Web Design - Advantages and Best Practice for Sports DirectResponsive Web Design - Advantages and Best Practice for Sports Direct
Responsive Web Design - Advantages and Best Practice for Sports Direct
 
Responsive Web Design: Advantages & Best Practice - Darrin Adams, Cantarus
Responsive Web Design: Advantages & Best Practice - Darrin Adams, CantarusResponsive Web Design: Advantages & Best Practice - Darrin Adams, Cantarus
Responsive Web Design: Advantages & Best Practice - Darrin Adams, Cantarus
 
Conformance Checklist for Product Owner
Conformance Checklist for Product OwnerConformance Checklist for Product Owner
Conformance Checklist for Product Owner
 
Responsive Web Design
Responsive Web DesignResponsive Web Design
Responsive Web Design
 
Online tools for Content Development
Online tools for Content DevelopmentOnline tools for Content Development
Online tools for Content Development
 
digital marketing[1].pdf
digital marketing[1].pdfdigital marketing[1].pdf
digital marketing[1].pdf
 

Último

2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...Martijn de Jong
 
Tata AIG General Insurance Company - Insurer Innovation Award 2024
Tata AIG General Insurance Company - Insurer Innovation Award 2024Tata AIG General Insurance Company - Insurer Innovation Award 2024
Tata AIG General Insurance Company - Insurer Innovation Award 2024The Digital Insurer
 
The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024Rafal Los
 
Axa Assurance Maroc - Insurer Innovation Award 2024
Axa Assurance Maroc - Insurer Innovation Award 2024Axa Assurance Maroc - Insurer Innovation Award 2024
Axa Assurance Maroc - Insurer Innovation Award 2024The Digital Insurer
 
08448380779 Call Girls In Greater Kailash - I Women Seeking Men
08448380779 Call Girls In Greater Kailash - I Women Seeking Men08448380779 Call Girls In Greater Kailash - I Women Seeking Men
08448380779 Call Girls In Greater Kailash - I Women Seeking MenDelhi Call girls
 
Advantages of Hiring UIUX Design Service Providers for Your Business
Advantages of Hiring UIUX Design Service Providers for Your BusinessAdvantages of Hiring UIUX Design Service Providers for Your Business
Advantages of Hiring UIUX Design Service Providers for Your BusinessPixlogix Infotech
 
A Year of the Servo Reboot: Where Are We Now?
A Year of the Servo Reboot: Where Are We Now?A Year of the Servo Reboot: Where Are We Now?
A Year of the Servo Reboot: Where Are We Now?Igalia
 
Real Time Object Detection Using Open CV
Real Time Object Detection Using Open CVReal Time Object Detection Using Open CV
Real Time Object Detection Using Open CVKhem
 
Slack Application Development 101 Slides
Slack Application Development 101 SlidesSlack Application Development 101 Slides
Slack Application Development 101 Slidespraypatel2
 
Raspberry Pi 5: Challenges and Solutions in Bringing up an OpenGL/Vulkan Driv...
Raspberry Pi 5: Challenges and Solutions in Bringing up an OpenGL/Vulkan Driv...Raspberry Pi 5: Challenges and Solutions in Bringing up an OpenGL/Vulkan Driv...
Raspberry Pi 5: Challenges and Solutions in Bringing up an OpenGL/Vulkan Driv...Igalia
 
Exploring the Future Potential of AI-Enabled Smartphone Processors
Exploring the Future Potential of AI-Enabled Smartphone ProcessorsExploring the Future Potential of AI-Enabled Smartphone Processors
Exploring the Future Potential of AI-Enabled Smartphone Processorsdebabhi2
 
Boost PC performance: How more available memory can improve productivity
Boost PC performance: How more available memory can improve productivityBoost PC performance: How more available memory can improve productivity
Boost PC performance: How more available memory can improve productivityPrincipled Technologies
 
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...Miguel Araújo
 
TrustArc Webinar - Stay Ahead of US State Data Privacy Law Developments
TrustArc Webinar - Stay Ahead of US State Data Privacy Law DevelopmentsTrustArc Webinar - Stay Ahead of US State Data Privacy Law Developments
TrustArc Webinar - Stay Ahead of US State Data Privacy Law DevelopmentsTrustArc
 
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...apidays
 
Presentation on how to chat with PDF using ChatGPT code interpreter
Presentation on how to chat with PDF using ChatGPT code interpreterPresentation on how to chat with PDF using ChatGPT code interpreter
Presentation on how to chat with PDF using ChatGPT code interpreternaman860154
 
Factors to Consider When Choosing Accounts Payable Services Providers.pptx
Factors to Consider When Choosing Accounts Payable Services Providers.pptxFactors to Consider When Choosing Accounts Payable Services Providers.pptx
Factors to Consider When Choosing Accounts Payable Services Providers.pptxKatpro Technologies
 
What Are The Drone Anti-jamming Systems Technology?
What Are The Drone Anti-jamming Systems Technology?What Are The Drone Anti-jamming Systems Technology?
What Are The Drone Anti-jamming Systems Technology?Antenna Manufacturer Coco
 
Artificial Intelligence: Facts and Myths
Artificial Intelligence: Facts and MythsArtificial Intelligence: Facts and Myths
Artificial Intelligence: Facts and MythsJoaquim Jorge
 
Powerful Google developer tools for immediate impact! (2023-24 C)
Powerful Google developer tools for immediate impact! (2023-24 C)Powerful Google developer tools for immediate impact! (2023-24 C)
Powerful Google developer tools for immediate impact! (2023-24 C)wesley chun
 

Último (20)

2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...
 
Tata AIG General Insurance Company - Insurer Innovation Award 2024
Tata AIG General Insurance Company - Insurer Innovation Award 2024Tata AIG General Insurance Company - Insurer Innovation Award 2024
Tata AIG General Insurance Company - Insurer Innovation Award 2024
 
The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024
 
Axa Assurance Maroc - Insurer Innovation Award 2024
Axa Assurance Maroc - Insurer Innovation Award 2024Axa Assurance Maroc - Insurer Innovation Award 2024
Axa Assurance Maroc - Insurer Innovation Award 2024
 
08448380779 Call Girls In Greater Kailash - I Women Seeking Men
08448380779 Call Girls In Greater Kailash - I Women Seeking Men08448380779 Call Girls In Greater Kailash - I Women Seeking Men
08448380779 Call Girls In Greater Kailash - I Women Seeking Men
 
Advantages of Hiring UIUX Design Service Providers for Your Business
Advantages of Hiring UIUX Design Service Providers for Your BusinessAdvantages of Hiring UIUX Design Service Providers for Your Business
Advantages of Hiring UIUX Design Service Providers for Your Business
 
A Year of the Servo Reboot: Where Are We Now?
A Year of the Servo Reboot: Where Are We Now?A Year of the Servo Reboot: Where Are We Now?
A Year of the Servo Reboot: Where Are We Now?
 
Real Time Object Detection Using Open CV
Real Time Object Detection Using Open CVReal Time Object Detection Using Open CV
Real Time Object Detection Using Open CV
 
Slack Application Development 101 Slides
Slack Application Development 101 SlidesSlack Application Development 101 Slides
Slack Application Development 101 Slides
 
Raspberry Pi 5: Challenges and Solutions in Bringing up an OpenGL/Vulkan Driv...
Raspberry Pi 5: Challenges and Solutions in Bringing up an OpenGL/Vulkan Driv...Raspberry Pi 5: Challenges and Solutions in Bringing up an OpenGL/Vulkan Driv...
Raspberry Pi 5: Challenges and Solutions in Bringing up an OpenGL/Vulkan Driv...
 
Exploring the Future Potential of AI-Enabled Smartphone Processors
Exploring the Future Potential of AI-Enabled Smartphone ProcessorsExploring the Future Potential of AI-Enabled Smartphone Processors
Exploring the Future Potential of AI-Enabled Smartphone Processors
 
Boost PC performance: How more available memory can improve productivity
Boost PC performance: How more available memory can improve productivityBoost PC performance: How more available memory can improve productivity
Boost PC performance: How more available memory can improve productivity
 
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
 
TrustArc Webinar - Stay Ahead of US State Data Privacy Law Developments
TrustArc Webinar - Stay Ahead of US State Data Privacy Law DevelopmentsTrustArc Webinar - Stay Ahead of US State Data Privacy Law Developments
TrustArc Webinar - Stay Ahead of US State Data Privacy Law Developments
 
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...
 
Presentation on how to chat with PDF using ChatGPT code interpreter
Presentation on how to chat with PDF using ChatGPT code interpreterPresentation on how to chat with PDF using ChatGPT code interpreter
Presentation on how to chat with PDF using ChatGPT code interpreter
 
Factors to Consider When Choosing Accounts Payable Services Providers.pptx
Factors to Consider When Choosing Accounts Payable Services Providers.pptxFactors to Consider When Choosing Accounts Payable Services Providers.pptx
Factors to Consider When Choosing Accounts Payable Services Providers.pptx
 
What Are The Drone Anti-jamming Systems Technology?
What Are The Drone Anti-jamming Systems Technology?What Are The Drone Anti-jamming Systems Technology?
What Are The Drone Anti-jamming Systems Technology?
 
Artificial Intelligence: Facts and Myths
Artificial Intelligence: Facts and MythsArtificial Intelligence: Facts and Myths
Artificial Intelligence: Facts and Myths
 
Powerful Google developer tools for immediate impact! (2023-24 C)
Powerful Google developer tools for immediate impact! (2023-24 C)Powerful Google developer tools for immediate impact! (2023-24 C)
Powerful Google developer tools for immediate impact! (2023-24 C)
 

Optimize Website Experience with Device Channels

  • 2. Advantages • Enables you to render certain site content, style your content, and even change images—while maintaining the same URL across a pool of different devices. • Target devices - Target different designs based on user agent string for different devices. Device channels can be ordered and stored in a list. • Define channels for single devices or group of devices and Assign alternate “Master Pages” per channel • Ranking device channels - It helps for proper traffic routing by ordering the most specific rules at the top for higher priority. • To define a mobile fallback Device Channel you have to define only one Device Inclusion Rule which has to be equal to $FALLBACKMOBILEUSERAGENTS
  • 3. • Selectively include or exclude portion of page layouts per channel - Content inside a device channel panel is not rendered at all on the non-specified channels hence reduces the rendered size of a page for devices by eliminating bulky content. This provides a way to increase site responsiveness on bandwidth- constrained devices. • Image Renditions - helps you improve the user experience of your website by optimizing images. • From troubleshooting point of view where the user and the helpdesk employee would see the same interface despite the possible differences in their screen resolutions or browser window sizes. Advantages
  • 4. • This feature is only available for publishing sites. • Multiple Master page needs to created, since every channel needs to be associated with a Master page • You can have a maximum of 10 device channels including the default configured on a specific site for an on-premises installation, and a total of two device channels when using SharePoint Online. • 150 inclusion rules per device channel. • Device Channels are designed to help you provide the visitors if your website with the best User Experience suitable for their device. They are in no way a security measure and you shouldn’t be using Device Channels to hide confidential data from your visitors. Because anonymous users can switch between Device Channels using query string parameters or cookies, using Device Channels for security purposes is a bad idea and could lead to disclosing confidential information to general public. Limitations
  • 5. Device Channels Responsive Web Design Device management Uses the identity of the browser on the particular device to decide which presentation style to use Property management Uses a device’s screen size to determine the presentation layer Different HTML for every channel •Will always load the same experience for the same device regardless of the browser window size. •But depending on how many different devices your site visitors use, managing the different devices and experiences can become complex. Same HTML for every device •Responsive web design can cause different experiences to be loaded depending on the size of the browser window. Uses different master pages to ensure that only the relevant markup is served to users and therefore optimized performance of the website. Changes only the presentation layer of the website. Although you can hide some pieces of the page in the browser using CSS, they are still present in the website’s code and therefore loaded.
  • 6. Device Channels Responsive Web Design More flexibility •You can serve different content to different devices •You get more flexibility in controlling the markup of your website for the different devices •You can apply additional optimizations to your website, such as resizing images and videos server- side using the renditions capability, which further improves the performance and user experience of your website. Limited by CSS support and capabilities •Same content is served when using responsive web design. Custom Vary-By User Agent response header required Preferred by Internet search engines - since the same HTML is sent to every device, it’s sufficient for an Internet search engine to index the content once, and it can be sure that the search results will apply the search query on every device
  • 7. Device Channels Responsive Web Design More management (support for new devices) – Any new device to be supported will need a separate Device channel/ inclusion of rule Future proof (device size)
  • 8. • Combine responsive web design and SharePoint 2013 device channels to benefit from the strengths of both approaches • When combining responsive web design and device channels, you could use responsive web design to create the baseline cross-device experience • By using responsive web design to build the baseline for the cross-browser experience, we benefit from its future-proofness and robustness. For the specific exceptions, we can benefit from the granular control that SharePoint device channels offer us. Combining responsive web design and device channels Combining responsive web design and device channels