Add content for <picture> element #8
Comments
We just filed https://code.google.com/p/chromium/issues/detail?id=368830 special for you guys, so we can keep track of |
@petele I had a bit of a conversation around this of thread with @Wilto @igrigorik and others and the consensus is that we need to get this in for the launch of the documentation before I/O. It has good sane fallbacks for all browsers that don't support it and we need to encourage developers to start using this now. Also cc @addyosmani for any starter kit type projects - my thinking behind this is that because of the relatively sane fallback our guidance should be along the lines of it works everywhere, better browsers give their users a better experience (content direction etc etc) but all browsers should be able to render an image. |
OK, that should be do-able. I'll get started on it this week. |
The RICG is happy to help out with this in whatever way we can! Keep me posted, yeah? |
@Wilto Any pointers to recommended materials/polyfills/docs etc would be great. I've got a few things already lined up, but it's always helpful to hear what you guys think is the best. |
Sounds good—we’ll put some resources together today. |
Use Cases The Spec PolyfillsPicturefill 2.0 How the syntax evolvedResponsive Images: How they Almost Worked and What We Need Florian’s Compromise Reasoning behind srcN replacing srcset and Explaining The Last Clause of the Using the current syntaxResponsive Images Done Right: A Guide To Srcset and sizes Brace yourselves – responsive images are coming Implementation ProgressGecko: Blink: WebKit: IE: |
Kind of a team-wide brain dump there. Hope it’s helpful! If you want to run anything by the spec writers or implementors involved with |
I've started work on this and hope to have an initial draft ready for review tomorrow. |
The first draft is done and ready for review! I'm not happy with a few of the titles or the explicit DO this WHEN this instructions, but will work on that over the next few days. |
Given that this probably won't be in Chrome until 38, I'm wondering if this content might be more appropriate for H5R right now... should we wait to publish this on WF? It doesn't seem like best practices for developers today. |
@maxh: We (@petele, @addyosmani, @igrigorik, @paulirish, @viviancromwell) were talking it over in an email thread a few weeks ago, and the general consensus was that this pattern is already seeing wide use by developers today—despite not even having landed in a stable browser—and it would likely be in everyone’s best interests to get in front of that with solid documentation. @petele: Looks great, man! Want me to give this an editorial read-through—if that’s helpful at all—or should I hold off for a bit? |
@Wilto - please do!! |
Densities is handled by
width descriptor It might be good to somehow bake in actual art direction in the example so that it's not confused with a different use case. The
These can use just the HTH |
@Wilto - I've updated the doc to include the comments above and have also updated the samples. http://petele-scratch.appspot.com/picture/sizes.html now uses the http://petele-scratch.appspot.com/picture/breakpoints.html has also been switched to use the If all looks good, I'll push this update today or tomorrow. |
Hm. http://petele-scratch.appspot.com/picture/sizes.html seems to be working for me. It might help to illustrate http://petele-scratch.appspot.com/picture/breakpoints.html if you CSS it to the layout sizes specified in Taking a quick edit pass at https://docs.google.com/document/d/1eHobQTrZs9c_qaPbwvK95NsbfMwsbgyWZHIE9_Yqocc/edit?pli=1 — should I just make comments, or are direct edits okay? |
@Wilto - comments or edits are fine! On Wed, Jun 11, 2014 at 4:20 PM, Mat Marquis notifications@github.com
Pete LePage | Developer Advocate | petele@google.com | 650-733-6404 |
Don’t think I have direct edit permissions, so I chucked a couple of line comments in there. @yoavweiss (working on the Blink impl.) and @marcoscaceres (Moz) are having a quick look now. Good stuff, man—psyched to see it! |
Thanks for the feedback everyone! I've integrated all of the feedback and pushed the update to the staging server. It should be live within a day or so! |
Awesome! We’ve got a fork goin’ under the ResponsiveImagesCG org—if anything changes (highly unlikely though that may be), we’ll send over a PR for discussion. Thanks, man! |
@petele we need to get @ianbarber to do a codereview as there is a js file in the repo. |
On another note, my preference is to never recommend picturefill in production (only so you can see how it works in your dev environment) I would like us to be explicit about that, and also make sure that people know if they use this correctly they still see an image. |
Hmm, okay, if the Responsive Images WG has a CDN version, we may be able to On Thu, Jun 12, 2014 at 11:33 AM, Paul Kinlan notifications@github.com
Pete LePage | Developer Advocate | petele@google.com | 650-733-6404 |
@PaulKinlan: Maybe conditionally? “Until there’s a stable implementation in at least two mainstream browsers” seems to be the de facto polyfill rule. @petele: We have a couple of CDN options in scottjehl/picturefill#247 |
[TRANSLATION] Updates: Credential Management API
# This is the 1st commit message: Adding start of Workbox v3 alpha docs # This is the commit message #2: Adding v3 alpha # This is the commit message #3: Adding configuration guide # This is the commit message #4: Adding workbox-precaching and fixing nested parameters # This is the commit message #5: Setting up namespaced docs on WF # This is the commit message #6: Adding ref and module docs for precaching # This is the commit message #7: Adding ref and module docs for precaching # This is the commit message #8: Routing Docs and module guide # This is the commit message #9: Routing Docs and module guide # This is the commit message #10: Adding workbox-cache-expiration guide and reference docs # This is the commit message #11: Adding routing docs # This is the commit message #12: Changing menu name # This is the commit message #13: Adding ability to use custom project yaml # This is the commit message #14: Adding workbox pages # This is the commit message #15: Getting it to work on devsite staging # This is the commit message #16: Adding some headings instead of sections but need to stage # This is the commit message #17: Moving to heading # This is the commit message #18: Adding heading support for navigation # This is the commit message #19: Adding contributor list # This is the commit message #20: Adding more content for docs # This is the commit message #21: Adding in company logos # This is the commit message #22: Adding in company logos # This is the commit message #23: Adding logos # This is the commit message #24: Adding some fixes for left nav # This is the commit message #25: Renaming strategies # This is the commit message #26: Fixng ref doc bug and add missing module pages # This is the commit message #27: Adding Guides etc
Once
See @Wilto's comments in #6
The text was updated successfully, but these errors were encountered: