Montego Scripts: Forums
 

 

View next topic
View previous topic
Post new topic   Reply to topic
Author Message
spasticdonkey
Newbie
Newbie



Joined: Sep 05, 2007
Posts: 78

PostPosted: Fri Feb 17, 2012 4:02 pm Reply with quote

Just curious as to what your thoughts were regarding images and mobile devices. From a display perspective, there is a simple approach that works well on modern devices.
img{max-width:100%}

This is provided you have not declared a width for the image elsewhere, and is relative to the parent container. I can't think of any reason (off the top of my head) why you would need an image to be larger than 100% the size of it's parent... Also note that max-width does not account for margin,padding, or border, so it's better to apply those to the parent container if needed. Although provided your parent container has some padding I don't think a 1px border on images would break anything.

You could take it a step further and target specific resolutions and deliver an appropriate fixed-size max-width, although not all devices will recognize such declarations. It depends somewhat on what devices we are trying to support... Some can be as narrow as 120px which is difficult to do anything within. For the most part I have been trying to make the mobile theme look "great" at 320px and above, and "decent" and usable at approx 200px... anything under that is difficult for me to simulate and probably difficult to display at width=device-width, initial-scale=1. This of course is with some limitations, as there are many areas that have content in a wide format; some of which can be addressed, and some cannot. That is until I can talk everyone into implementing a template system within the core Smile

This of course does nothing to optimize the file size of the image, and I'm completely open to ideas there. I took a look at what one popular CMS did, and it used output buffering to re-size images automatically... Which is cool but it was tied to the core image upload and re-size functionality of the CMS; something we don't really have (to tap into). Not sure how compatible that approach would be within shortlinks, which is what got me rambling on here today...

There are other ideas out there using "progressive enhancement" to deliver optimized images based on screen width, all the ones I've looked at seem like too much work to use, and require special markup, JS, creating multiple copies of images, and even htaccess rules. This is cool but not sure it's the answer.
http://filamentgroup.com/examples/responsive-images/

Not sure how I feel about 3rd party services but here is one that is interesting, and in the context of a mobile only theme could work for some.
http://imgble.com/
Questionable how much of a performance improvement could be had using a 3rd party service, versus just serving large images. In conclusion I don't think I'll be implementing any image file optimization within a mobile theme at this time, and focus more on proper display. Just food for thought if we get around to a dedicated "file manager" within the core, as it should be creating mobile versions of images over a certain size for us... ideally.
 
View user's profile Send private message
montego
Site Admin/Owner
Site Admin/Owner



Joined: Feb 12, 2005
Posts: 1399

PostPosted: Sat Feb 18, 2012 11:15 am Reply with quote

Wow. That is a ton to digest. Shocked May just have to "progressively enhance" the approach too over time. Smile A "heavy" image site just isn't going to be practical on a mobile device anyways (with the exception of the larger tablets over WiFi/4G of course). It sounds to me like you are on the right track.

Regarding core theme framework changes are concerned, it would be great if we could figure out how to easily support the existing themes and older, while at the same time either extend the existing framework, or design a whole new one to go alongside the old.

If one goes for a re-design though, I wouldn't recommend what most of us do, and design by coding. Laughing I think it would take considerable thinking through just what would be desired, every feature, function, etc., and design it from scratch. JMO though.
 
View user's profile Send private message Visit poster's website
Display posts from previous:       
Post new topic   Reply to topic

View next topic
View previous topic
You cannot post new topics in this forum
You cannot reply to topics in this forum
You cannot edit your posts in this forum
You cannot delete your posts in this forum
You cannot vote in polls in this forum


Powered by phpBB © 2001-2007 phpBB Group
All times are GMT - 4 Hours
 
Forums ©
linear-bunch