Re: [css-d] hiding things and bandwidth?
feb 15 2014 06:22 Chris Williams ch...@clwill.com: And how do they do that? How does the server know the user's page width? By their going to m.example.com as opposed to example.com. Or with JS… Javascript analysis of screen type will take care of a majority of users and feed the relevant data to the server-side web application. In my case I serve another style sheet. People surfing with javascript turned off are probably in the single digits for a majority of web sites and a vast majority of those on non-mobile type of devices. The default to serve to people surfing with javascript turned off has to be handled with some care per site. I have zero mobile users on all my sites surfing without javascript on mobile type devices (less than 1% on other devices with JS off). By logic then I should default to the desktop site. However, I default to the mobile site, it being my main focus. Anyway, this means my non-mobile device type users get exactly the same content on the exactly same site as mobile-type device users, only different styles. This same site thing is more important than fringe user cases IMHO. __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] hiding things and bandwidth?
Which is precisely what I suggested as one of the two alternatives: use JS to serve up content based on screen size. On 2/17/14 12:27 AM, MiB digital.disc...@gmail.com wrote: Javascript analysis of screen type ... __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] hiding things and bandwidth?
Only this group's mentor and creator can set the rules. Because this group IS a forum for discussing CSS it seems right to limit fine-grained how-to-do-it discussion to CSS only. But the use of CSS in the real world invariably happens in a context that almost always includes a mixture of technologies including databases, server side scripting and javascript. So at higher big picture level some discussion about how CSS fits into the overall scheme of things still seems appropriate. Using Javascript cookies and (initially) a double GET to determine the state of the current user agent makes the most sense to me--so custom CSS, custom image sizes and even custom HTML can be sent back down the pipe. CSS only mobile first approaches violate basic theory of programming rules because mobile first inescapably couples itself to both small mobile displays plus the vastly different requirements of bigger desktop displays. Writing codes with semi-secret two role agendas is seldom a good idea. On Mon, Feb 17, 2014 at 9:48 AM, Chris Williams ch...@clwill.com wrote: Which is precisely what I suggested as one of the two alternatives: use JS to serve up content based on screen size. On 2/17/14 12:27 AM, MiB digital.disc...@gmail.com wrote: Javascript analysis of screen type ... __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ -- /* Colin (Sandy) Pittendrigh --oO0 */ __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] hiding things and bandwidth?
17 feb 2014 kl. 17:48 skrev Chris Williams ch...@clwill.com: Which is precisely what I suggested as one of the two alternatives: use JS to serve up content based on screen size. I underscored the importance from my perspective not having a separate ”mobile” web site. Whatever the details, the choices a developer will have to make is about a complete system rather than individual solution. /MiB __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] hiding things and bandwidth?
feb 17 2014 18:05 Colin (Sandy) Pittendrigh sandy.pittendr...@gmail.com: So at higher big picture level some discussion about how CSS fits into the overall scheme of things still seems appropriate. Exactly. Using Javascript cookies and (initially) a double GET to determine the state of the current user agent makes the most sense to me--so custom CSS, custom image sizes and even custom HTML can be sent back down the pipe. I like Googles variheader concept. CSS only mobile first approaches violate basic theory of programming rules because mobile first inescapably couples itself to both small mobile displays I disagree for the most part, but obviously this depends on the actual difference in user patterns and user objectives on different devices. I have embraced that the customers of my clients want to do everything on all types of devices. But envy site is different. plus the vastly different requirements of bigger desktop displays. Writing codes with semi-secret two role agendas is seldom a good idea. This does not make sense. Secret two role agendas? It’s different styles for equivalent content. For some content, like audio/video you may have to server different content and consequently different markup. I fail to see the problem with that though. __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] hiding things and bandwidth?
MiB digital.disc...@gmail.com: the choices a developer will have to make is about a complete system rather than individual solution. Solutions obviously. Sorry about that. /MiB __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] hiding things and bandwidth?
feb 14 2014 19:59 Chris Williams ch...@clwill.com: that's Javascript, and while a worthwhile topic and a useful method used more and more lately, it's off-topic here. Solves several of the issues with separate sites, but adds another language, testing, and layer of complexity. I fail to see how serving style sheets with the help of javascript or even server-side solutions are off-topic here. The technical details may be, but not the concept and the names of available solutions. __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] hiding things and bandwidth?
Let’s say for sizes above mobile (ie 600px) you have 2 or 3 jQuery sliders on a page, but for mobile, you just want 1 slider to be shown. my thought is to use CSS to hide the unwanted, but will there still be just as many HTTP requests, and therefore, should I look to a superior way to do it so that the load on the mobile device reflects only what the user sees? And what would that better way be? Thank you, John __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] hiding things and bandwidth?
I've been thinking about this off and on for a few weeks now. In my case, I have one image carousel that loads up 18 images. I hid it on narrow screens as it's no where near essential (I'm vying to have it removed completely) but, like you've already stated, that doesn't fix the issue of the user having to download it. In the future, for anything that isn't essential, I'm going to load it via JavaScript after the page has loaded. If it is essential, in the case of a carousel, I'm only going to load what is shown immediately. Once the page content is available, I'll load the other items in the background and add the controls to the carousel. Just my thought process so far. On Fri, Feb 14, 2014 at 12:42 PM, John Johnson j...@coffeeonmars.comwrote: Let's say for sizes above mobile (ie 600px) you have 2 or 3 jQuery sliders on a page, but for mobile, you just want 1 slider to be shown. my thought is to use CSS to hide the unwanted, but will there still be just as many HTTP requests, and therefore, should I look to a superior way to do it so that the load on the mobile device reflects only what the user sees? And what would that better way be? Thank you, John __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ -- Chris Rockwell __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] hiding things and bandwidth?
So my short answer is that using CSS for this is not a good idea :) On Fri, Feb 14, 2014 at 12:57 PM, Chris Rockwell ch...@chrisrockwell.comwrote: I've been thinking about this off and on for a few weeks now. In my case, I have one image carousel that loads up 18 images. I hid it on narrow screens as it's no where near essential (I'm vying to have it removed completely) but, like you've already stated, that doesn't fix the issue of the user having to download it. In the future, for anything that isn't essential, I'm going to load it via JavaScript after the page has loaded. If it is essential, in the case of a carousel, I'm only going to load what is shown immediately. Once the page content is available, I'll load the other items in the background and add the controls to the carousel. Just my thought process so far. On Fri, Feb 14, 2014 at 12:42 PM, John Johnson j...@coffeeonmars.comwrote: Let's say for sizes above mobile (ie 600px) you have 2 or 3 jQuery sliders on a page, but for mobile, you just want 1 slider to be shown. my thought is to use CSS to hide the unwanted, but will there still be just as many HTTP requests, and therefore, should I look to a superior way to do it so that the load on the mobile device reflects only what the user sees? And what would that better way be? Thank you, John __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ -- Chris Rockwell -- Chris Rockwell __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] hiding things and bandwidth?
CSS is handled by the client. If you want to have the client to not have to download something, the CSS is too late. AFAIK, there are but two choices: 1) A mobile version of the page/site, users get redirected there based on client and you only load as needed for each client. This has a number of issues: different user experiences, non-portable links, multiple sites to test, etc. but is the easiest way to handle this issue. 2) Have the client determine what is needed and download as necessary. That's lazy loading, that's Javascript, and while a worthwhile topic and a useful method used more and more lately, it's off-topic here. Solves several of the issues with separate sites, but adds another language, testing, and layer of complexity. Chris On 2/14/14 9:42 AM, John Johnson j...@coffeeonmars.com wrote: Let¹s say for sizes above mobile (ie 600px) you have 2 or 3 jQuery sliders on a page, but for mobile, you just want 1 slider to be shown. my thought is to use CSS to hide the unwanted, but will there still be just as many HTTP requests, and therefore, should I look to a superior way to do it so that the load on the mobile device reflects only what the user sees? And what would that better way be? __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] hiding things and bandwidth?
On Fri, Feb 14, 2014 at 12:42 PM, John Johnson j...@coffeeonmars.comwrote: Let's say for sizes above mobile (ie 600px) you have 2 or 3 jQuery sliders on a page, but for mobile, you just want 1 slider to be shown. my thought is to use CSS to hide the unwanted, but will there still be just as many HTTP requests, and therefore, should I look to a superior way to do it so that the load on the mobile device reflects only what the user sees? And what would that better way be? If you are able to make this kind of change, you may want to try implementing the images in the sliders as background images on the element of your choice. You can then use media queries to prevent mobile devices from displaying the sliders that don't apply, along with the associated slider images and their HTTP requests. This has good support based on research by Jason Grigsby and furthered by Tim Kadlec: http://timkadlec.com/2012/04/media-query-asset-downloading-results/ -- Jon Reece jon.re...@gmail.com __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] hiding things and bandwidth?
At 13:59 -0500 on 02/14/2014, Chris Williams wrote about Re: [css-d] hiding things and bandwidth?: AFAIK, there are but two choices: 1) A mobile version of the page/site, users get redirected there based on client and you only load as needed for each client. This has a number of issues: different user experiences, non-portable links, multiple sites to test, etc. but is the easiest way to handle this issue. 2) Have the client determine what is needed and download as necessary. That's lazy loading, that's Javascript, and while a worthwhile topic and a useful method used more and more lately, it's off-topic here. Solves several of the issues with separate sites, but adds another language, testing, and layer of complexity. Chris How about controlling the sending of the optional stuff via Server Side Scripting? So long as the server can tell the difference between a mobile and a non-mobile user the optional page contents can be sent only to the non-mobile user. __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] hiding things and bandwidth?
And how do they do that? How does the server know the user's page width? By their going to m.example.com as opposed to example.com. Or with JS... On 2/14/14 6:59 PM, Robert A. Rosenberg webdesig...@rarpsl.com wrote: How about controlling the sending of the optional stuff via Server Side Scripting? So long as the server can tell the difference between a mobile and a non-mobile user the optional page contents can be sent only to the non-mobile user. __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
