SlideShare una empresa de 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

Más contenido relacionado

Similar a Device channels v/s Responsive web design

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
Omkarsoft Bangalore
 

Similar a Device channels v/s Responsive web design (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

Why Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire businessWhy Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire business
panagenda
 
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Victor Rentea
 
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers:  A Deep Dive into Serverless Spatial Data and FMECloud Frontiers:  A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Safe Software
 

Último (20)

ICT role in 21st century education and its challenges
ICT role in 21st century education and its challengesICT role in 21st century education and its challenges
ICT role in 21st century education and its challenges
 
Boost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdfBoost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdf
 
FWD Group - Insurer Innovation Award 2024
FWD Group - Insurer Innovation Award 2024FWD Group - Insurer Innovation Award 2024
FWD Group - Insurer Innovation Award 2024
 
Why Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire businessWhy Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire business
 
Apidays New York 2024 - Passkeys: Developing APIs to enable passwordless auth...
Apidays New York 2024 - Passkeys: Developing APIs to enable passwordless auth...Apidays New York 2024 - Passkeys: Developing APIs to enable passwordless auth...
Apidays New York 2024 - Passkeys: Developing APIs to enable passwordless auth...
 
Apidays New York 2024 - APIs in 2030: The Risk of Technological Sleepwalk by ...
Apidays New York 2024 - APIs in 2030: The Risk of Technological Sleepwalk by ...Apidays New York 2024 - APIs in 2030: The Risk of Technological Sleepwalk by ...
Apidays New York 2024 - APIs in 2030: The Risk of Technological Sleepwalk by ...
 
presentation ICT roal in 21st century education
presentation ICT roal in 21st century educationpresentation ICT roal in 21st century education
presentation ICT roal in 21st century education
 
"I see eyes in my soup": How Delivery Hero implemented the safety system for ...
"I see eyes in my soup": How Delivery Hero implemented the safety system for ..."I see eyes in my soup": How Delivery Hero implemented the safety system for ...
"I see eyes in my soup": How Delivery Hero implemented the safety system for ...
 
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
 
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
 
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWEREMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
 
MINDCTI Revenue Release Quarter One 2024
MINDCTI Revenue Release Quarter One 2024MINDCTI Revenue Release Quarter One 2024
MINDCTI Revenue Release Quarter One 2024
 
Cyberprint. Dark Pink Apt Group [EN].pdf
Cyberprint. Dark Pink Apt Group [EN].pdfCyberprint. Dark Pink Apt Group [EN].pdf
Cyberprint. Dark Pink Apt Group [EN].pdf
 
How to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerHow to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected Worker
 
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers:  A Deep Dive into Serverless Spatial Data and FMECloud Frontiers:  A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
 
Corporate and higher education May webinar.pptx
Corporate and higher education May webinar.pptxCorporate and higher education May webinar.pptx
Corporate and higher education May webinar.pptx
 
AXA XL - Insurer Innovation Award Americas 2024
AXA XL - Insurer Innovation Award Americas 2024AXA XL - Insurer Innovation Award Americas 2024
AXA XL - Insurer Innovation Award Americas 2024
 
Apidays New York 2024 - The value of a flexible API Management solution for O...
Apidays New York 2024 - The value of a flexible API Management solution for O...Apidays New York 2024 - The value of a flexible API Management solution for O...
Apidays New York 2024 - The value of a flexible API Management solution for O...
 
Ransomware_Q4_2023. The report. [EN].pdf
Ransomware_Q4_2023. The report. [EN].pdfRansomware_Q4_2023. The report. [EN].pdf
Ransomware_Q4_2023. The report. [EN].pdf
 
AWS Community Day CPH - Three problems of Terraform
AWS Community Day CPH - Three problems of TerraformAWS Community Day CPH - Three problems of Terraform
AWS Community Day CPH - Three problems of Terraform
 

Device channels v/s Responsive web design

  • 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