Adaptive Images
Permalink
Hi Concreters,
I stumbled across this at the weekend and was wondering if anyone had successfully gotten it working with Concrete 5
http://adaptive-images.com/
I'm currently working on my first adaptive website with C5 & when it goes live I hope to strip back the design & offer the Theme in the Marketplace this would be cool to have in there too but I haven't had a chance to look into it properly.
I stumbled across this at the weekend and was wondering if anyone had successfully gotten it working with Concrete 5
http://adaptive-images.com/
I'm currently working on my first adaptive website with C5 & when it goes live I hope to strip back the design & offer the Theme in the Marketplace this would be cool to have in there too but I haven't had a chance to look into it properly.
I am planning on having a play with adaptive images today, so will let you know how i get on.
Cool. If you want the bare bones - no styling applied - startpoint of Skeleton Grid for Concrete5 that I made hit me up with a PM with your email address & I'll share it.
Thanks, that would be good to see, I do have my own "boilerplate" but I would be interested to see yours. I will PM you my email.
Hate to bump this thread, but whatever happend with Adaptive Images? Everything work as expected? Anything we should be concerned with?
Hi Riotaj,
I tried a lot a of very complicated methods, used sensa.io and hand coded in the prefix before every image, but thats not very usable from a handing over a responsive site to a client point of view so I abandoned it for a while.
Then I came across this beauty:
you can check it out in action on my wedding site:http://www.kellyandstephenswedding.com...
I tried a lot a of very complicated methods, used sensa.io and hand coded in the prefix before every image, but thats not very usable from a handing over a responsive site to a client point of view so I abandoned it for a while.
Then I came across this beauty:
img { max-width: 100%; height: auto; width: auto\9; /* ie8 */ }
you can check it out in action on my wedding site:http://www.kellyandstephenswedding.com...
So in other words you didn't end up using the adaptive-images.com mod?
That's all fine and well but adaptive-images.com actually sends appropriately sized images based on the device that is requesting them whereas the standard max-width: 100% stuff does not resize the actual image, just the way the browser interprets it. In other words, a mobile device will download an image meant for a 1080p monitor, resulting in biggg image files to download.
Thanks for the input.
That's all fine and well but adaptive-images.com actually sends appropriately sized images based on the device that is requesting them whereas the standard max-width: 100% stuff does not resize the actual image, just the way the browser interprets it. In other words, a mobile device will download an image meant for a 1080p monitor, resulting in biggg image files to download.
Thanks for the input.
Yeah, it's not big and it's not clever but it was a solution that worked and because I was the client and could keep a handle on the image filesize I let it through.
Did you get this solution working?
Did you get this solution working?
I've used
several times but have yet to use the adaptive-images.com mod. I'll give it a try and report back.
img, embed, object { max-width: 100%; }
several times but have yet to use the adaptive-images.com mod. I'll give it a try and report back.
Cool. Be good to see if others have any more success than I had.
I'm more front-end than developer so a lot of the time it's informed guesses with me when I'm playing with stuff like this. I'm sure someone with a more PHP than PSD background will get it and hopefully share it with the rest of the community.
I'm more front-end than developer so a lot of the time it's informed guesses with me when I'm playing with stuff like this. I'm sure someone with a more PHP than PSD background will get it and hopefully share it with the rest of the community.
There is a posting on A List Apart this month that addresses some of the problems with this idea:http://www.alistapart.com/
I'd like to bump this thread again.
I know that there are drawbacks to every adaptive image approach. But, I'm interested in this one:http://adaptive-images.com
Has anyone got it working with concrete5?
On first blush, it doesn't seem to be working. concrete5 looks like it wants to serve it's own cached image file instead.
I know that there are drawbacks to every adaptive image approach. But, I'm interested in this one:http://adaptive-images.com
Has anyone got it working with concrete5?
On first blush, it doesn't seem to be working. concrete5 looks like it wants to serve it's own cached image file instead.
I used it and it worked for me. I don't think C5 cache system is a problem.
Hi Mnakalay, did you get this to work out of a package?
No not at all, I just used it as a standalone.
If you wanted it out of a package it would require a settings interface for breakpoints and using C5 image helper instead of the included one.
I didn't think it was worse the hassle for that project so I just drop it in like it says in the doc.
If you wanted it out of a package it would require a settings interface for breakpoints and using C5 image helper instead of the included one.
I didn't think it was worse the hassle for that project so I just drop it in like it says in the doc.
