<font color="#333333"><font><font face="arial,helvetica,sans-serif">Unfortunately there's no standard for "breakpoints" they're Design/Theme-Specific. </font></font></font><div><br></div><div><font color="#333333" face="arial, helvetica, sans-serif">Thanks,</font></div>
<div><font color="#333333" face="arial, helvetica, sans-serif">Emil</font></div><div><font color="#333333"><font><font face="arial,helvetica,sans-serif"><br></font></font></font></div><div><font color="#333333"><font><font face="arial,helvetica,sans-serif"><br>
</font></font></font><br><div class="gmail_quote">On Wed, Jul 18, 2012 at 6:51 PM, <a href="mailto:myazalea@hotmail.com">myazalea@hotmail.com</a> <span dir="ltr"><<a href="mailto:myazalea@hotmail.com" target="_blank">myazalea@hotmail.com</a>></span> wrote:<br>
<blockquote class="gmail_quote" style="margin:0 0 0 .8ex;border-left:1px #ccc solid;padding-left:1ex"><u></u>
<div>With the amount of users, who better to set the standard than WordPress, if we can only come up with and agree on some minimums.<br><br><br>Maybe decide on some standard breakpoints and have the theme check plugin to check if they exist in the css.<br>
<br><br><br>Skickat från min HTC<div><div class="h5"><br><br><div>----- Reply message -----<br>Från: "Emil Uzelac" <<a href="mailto:emil@themeid.com" target="_blank">emil@themeid.com</a>><br>Till: <<a href="mailto:theme-reviewers@lists.wordpress.org" target="_blank">theme-reviewers@lists.wordpress.org</a>><br>
Rubrik: [theme-reviewers] Current Theme Unit Test Data<br>Datum: tors, jul 19, 2012 02:21<br><br></div><br><font color="#333333"><font><font face="arial,helvetica,sans-serif">And again this is a never-ending conversation, since there's not really any standards as far as the Responsive Web Design :)</font></font></font><div>
<font color="#333333" face="arial, helvetica, sans-serif"><br></font></div></div></div><div><font color="#333333" face="arial, helvetica, sans-serif"><br></font><div><div><font color="#333333"><font><font face="arial,helvetica,sans-serif">Emil<br>
</font></font></font><br><div class="gmail_quote"><div><div class="h5">On Wed, Jul 18, 2012 at 6:09 PM, Daniel Tara <span dir="ltr"><<a href="mailto:contact@onedesigns.com" target="_blank">contact@onedesigns.com</a>></span> wrote:<br>
</div></div><blockquote class="gmail_quote" style="margin:0 0 0 .8ex;border-left:1px #ccc solid;padding-left:1ex">
<div style="word-wrap:break-word"><div><div class="h5"><div>What I mean to say is that the main layout adaptations should not rely entirely on JavaScript. Using it as fallback, to prettify traditions or where there's no other alternative should be fine.</div>
<span><font color="#888888"><div><br></div><div>Daniel</div></font></span></div></div><div><div><div><br></div><div><div><div class="h5"><div>On Jul 19, 2012, at 2:05 AM, Emil Uzelac wrote:</div><br></div></div><blockquote type="cite">
<div><div class="h5"><i><font color="#333333"><font><font face="arial,helvetica,sans-serif">"</font></font></font><span style="color:rgb(34,34,34);font-size:13px;font-family:arial,sans-serif">Design responsiveness should not be JavaScript dependent"</span></i><div>
<font><font><font color="#222222" face="arial, sans-serif"><br></font></font></font></div><div>IE8 and bellow do not support CSS3 media queries, so JS is very much needed :) please see: <a href="https://github.com/scottjehl/Respond/" target="_blank">https://github.com/scottjehl/Respond/</a> I'm using that in my Theme and many others out there.</div>
<div><font><font><font color="#222222" face="arial, sans-serif"><br></font></font></font></div><div><font><font><font color="#222222" face="arial, sans-serif">Thanks,</font></font></font></div></div></div><div><font><font><font color="#222222" face="arial, sans-serif">Emil<br>
</font></font></font><br><div class="gmail_quote"><div><div class="h5">On Wed, Jul 18, 2012 at 5:43 PM, Daniel Tara <span dir="ltr"><<a href="mailto:contact@onedesigns.com" target="_blank">contact@onedesigns.com</a>></span> wrote:<br>
</div></div><blockquote class="gmail_quote" style="margin:0 0 0 .8ex;border-left:1px #ccc solid;padding-left:1ex">
<div style="word-wrap:break-word"><div><div class="h5">The only guidelines I would recommend regarding responsive design are:<div><br></div></div></div><div><div><div class="h5"><ul><li>No content should be hidden, ever, that's (very) bad practice.</li>
<li>Images should constrain proportions.</li>
<li>Design responsiveness should not be JavaScript dependent</li></ul><div><br></div><div>Everything else would mean restraining the developer. IMHO.</div><span><font color="#888888"><div><br></div><div>Daniel</div>
</font></span></div></div><div><div><div><br><div><div><div class="h5"><div>On Jul 19, 2012, at 1:10 AM, Emil Uzelac wrote:</div><br></div></div><blockquote type="cite"><div><div class="h5"><font color="#333333"><font><font face="arial,helvetica,sans-serif">Hi Bruce,</font></font></font><div>
<font color="#333333"><font><font face="arial,helvetica,sans-serif"><br></font></font></font></div><div><font color="#333333"><font><font face="arial,helvetica,sans-serif">This is all good and we appreciate the heads-up, however at this moment I would not require Theme Reviewers to test RWD. </font></font></font></div>
<div><font color="#333333"><font><font face="arial,helvetica,sans-serif"><br></font></font></font></div><div><font color="#333333"><font><font face="arial,helvetica,sans-serif">Think of it like this. If developers says that their Theme is HTML5, none of us will actually go and check just to see if every Theme element is HTML5 and/or if developers decided to "hack" with non-HTML5 techniques. </font></font></font></div>
<div><font color="#333333"><font><font face="arial,helvetica,sans-serif">As Chip said once this will be under the description and that's all for right now.</font></font></font></div><div><font color="#333333"><font><font face="arial,helvetica,sans-serif"><br>
</font></font></font></div><div><font color="#333333"><font><font face="arial,helvetica,sans-serif">Just for FYI purpose only all this and much more is under my Theme <a href="http://wordpress.org/extend/themes/responsive" target="_blank">http://wordpress.org/extend/themes/responsive</a>, feel free to browse around if you need. Autohide or shrink of sidebars is not the best practices, I would always prefer to "stack" -vs hide.</font></font></font></div>
<div><font color="#333333"><font><font face="arial,helvetica,sans-serif"><br></font></font></font></div><div><font color="#333333"><font><font face="arial,helvetica,sans-serif">Few sites to consider:</font></font></font></div>
<div><ul><li><span style="font-family:arial,helvetica,sans-serif;color:rgb(51,51,51)"><a href="http://foundation.zurb.com/" target="_blank">http://foundation.zurb.com/</a> (my personal favorite)</span></li><li><font color="#333333" face="arial, helvetica, sans-serif"><a href="http://twitter.github.com/bootstrap/" target="_blank">http://twitter.github.com/bootstrap/</a> (second favorite)</font></li>
</ul></div><div><font color="#333333"><font><font face="arial,helvetica,sans-serif"><br></font></font></font></div><div><font color="#333333"><font><font face="arial,helvetica,sans-serif">Thanks,</font></font></font></div>
</div></div><div><font color="#333333"><font><font face="arial,helvetica,sans-serif">Emil<br></font></font></font><br><div class="gmail_quote"><div><div class="h5">On Wed, Jul 18, 2012 at 1:30 PM, Bruce Wampler <span dir="ltr"><<a href="mailto:weavertheme@gmail.com" target="_blank">weavertheme@gmail.com</a>></span> wrote:<br>
</div></div><blockquote class="gmail_quote" style="margin:0 0 0 .8ex;border-left:1px #ccc solid;padding-left:1ex"><div><div class="h5">Sorry a bit slow with this - Chip asked for some ideas about responsive theme tests or guidelines. Here are some of the issues I believe to be important:<br>
<br>1. Sidebars - sidebars should nicely shrink with the rest of the page - things should stay proportional. At some point (maybe at about 480, maybe even below 600), the sidebar should autohide or everything gets too squished. I think this kind of behavior should be at the least RECOMMENDED for responsive themes, if not required.<br>
<br></div></div>One of the problems testing this behavior is that not all browsers respond to responsive div hiding - they need a manual refresh at each new width.. The content will shrink fine, but the responsive hides don't always auto-show.<div>
<div class="h5"><br>
<br>2. Images - images need to shrink as the screen does. This includes the header image.<br><br>3. Menus - menus need to resize nicely. This isn't always easy to do, and it is not uncommon to get a mess of unreadable, unusable stacked menu items.<br>
<br>4. Possibly unhide or move special areas as the width shrinks. Sidebars might switch from the side to the bottom, for example.<br><br>5. Video media - Video should either dynamically shrink with the screen (not easy), or at worst hide the overflow.<br>
<br>6. Same for iFrames.<br><br>7. Titles - titles should ideally shrink and wrap, not overwrite surrounding content. Actually, same for all content. The content should shrink or re-wrap, and not overwrite surrounding content or sidebars.<br>
<br>8. If themes have special handling for some devices (iOS or Android), it should be noted, but it is probably unrealistic to expect testers to have those devices to test on. Don't know how such things can be tested. Maybe if there are reviewers with access to such devices, they could have priority for testing such features. Don't know how many themes include that kind of support yet, but I imagine it will become more common. It might be interesting to discuss as recommends to use the existing iOS features that are available with the WP admin side. (I know they are there, but unfortunately don't really know if they can easily be used by themes. Seems like a good opportunity.)<br>
<br>Also, Opera has a mobile device simulator that could be of some use for testers of responsive themes.<span><font color="#888888"><br><br>Bruce Wampler<br>
</font></span><br>_______________________________________________<br>
theme-reviewers mailing list<br>
<a href="mailto:theme-reviewers@lists.wordpress.org" target="_blank">theme-reviewers@lists.wordpress.org</a><br>
<a href="http://lists.wordpress.org/mailman/listinfo/theme-reviewers" target="_blank">http://lists.wordpress.org/mailman/listinfo/theme-reviewers</a><br>
<br></div></div></blockquote></div><br></div><div><div class="h5">
_______________________________________________<br>theme-reviewers mailing list<br><a href="mailto:theme-reviewers@lists.wordpress.org" target="_blank">theme-reviewers@lists.wordpress.org</a><br><a href="http://lists.wordpress.org/mailman/listinfo/theme-reviewers" target="_blank">http://lists.wordpress.org/mailman/listinfo/theme-reviewers</a><br>
</div></div></blockquote></div><br></div></div></div></div></div><div><div class="h5"><br>_______________________________________________<br>
theme-reviewers mailing list<br>
<a href="mailto:theme-reviewers@lists.wordpress.org" target="_blank">theme-reviewers@lists.wordpress.org</a><br>
<a href="http://lists.wordpress.org/mailman/listinfo/theme-reviewers" target="_blank">http://lists.wordpress.org/mailman/listinfo/theme-reviewers</a><br>
<br></div></div></blockquote></div><br></div><div><div class="h5">
_______________________________________________<br>theme-reviewers mailing list<br><a href="mailto:theme-reviewers@lists.wordpress.org" target="_blank">theme-reviewers@lists.wordpress.org</a><br><a href="http://lists.wordpress.org/mailman/listinfo/theme-reviewers" target="_blank">http://lists.wordpress.org/mailman/listinfo/theme-reviewers</a><br>
</div></div></blockquote></div><br></div></div></div><div><div class="h5"><br>_______________________________________________<br>
theme-reviewers mailing list<br>
<a href="mailto:theme-reviewers@lists.wordpress.org" target="_blank">theme-reviewers@lists.wordpress.org</a><br>
<a href="http://lists.wordpress.org/mailman/listinfo/theme-reviewers" target="_blank">http://lists.wordpress.org/mailman/listinfo/theme-reviewers</a><br>
<br></div></div></blockquote></div><br></div></div></div>
</div><br>_______________________________________________<br>
theme-reviewers mailing list<br>
<a href="mailto:theme-reviewers@lists.wordpress.org">theme-reviewers@lists.wordpress.org</a><br>
<a href="http://lists.wordpress.org/mailman/listinfo/theme-reviewers" target="_blank">http://lists.wordpress.org/mailman/listinfo/theme-reviewers</a><br>
<br></blockquote></div><br></div>