On 12/20/2013 06:42 AM, [email protected] wrote:
>
> The new design is not beautiful on my Android phone's browser, but I
> was able to navigate. We might want to make some provision for
> accessing the HPR site on mobile devices with smaller screens.
>
This is relatively easy to do with a few @media queries in the css
like this:
@media only screen and (max-width: 360px) {
[...small-screen rules here...]
}
I overhauled the School of Music website (where I work) recently,
and also my own website, using static HTML and CSS and it's
completey usable on screens all the way down to about 260px wide.
http://music.louisiana.edu/faculty/jkulp.html and
http://jonathankulp.org
> Rarely are
> Graceful degradation or progressive enhancement done. Even
> by people that know better, and that have the resources to do it
> correctly. Please see attached files G+js.png and G-js.png.
>
This is an issue I had to deal with recently on one of the pages of
the music school website
(http://music.louisiana.edu/prospective.html), where I used
JavaScript to expand/collapse a bunch of extra content. A paranoid
no-js guy (!) on my Statusnet timeline pointed out to me that I was
actually using JS to *display* the content, thereby blocking him
from seeing it. I didn't realize this would be the case since
everything displayed in my elinks text browser, but thanks to his
tip I reversed reversed the JS/CSS rules to make a "no-JavaScript"
browser display everything, and a JS-enabled browser collapse all by
default. I hope this is an example of graceful degradation. :)
Anyway it's not to hard to test this kind of thing. When I was
working on this page I just disabled javascript in one of my
browsers and kept it in the other one, refreshing the page in each
one to see what would happen.
PRO TIP: for those who were not aware of this, in Firefox if you do
the key combination Ctrl+Shift+M it will emulate screens of
different sizes, great for testing CSS.
Jon
_______________________________________________
Hpr mailing list
[email protected]
http://hackerpublicradio.org/mailman/listinfo/hpr_hackerpublicradio.org
