hybrid-pedagogy / openmusictheory

A growing, online "textbook" for music theory and aural skills
25 stars 16 forks source link

Make width a percentage instead of hard coded #56

Open eah13 opened 10 years ago

eah13 commented 10 years ago

This is obviously very subjective but relative width pages are more idiomatic. And I think they're easier to read YMMV :)

Before:

screenshot 2014-08-23 at 4 34 07 pm

After:

screenshot 2014-08-23 at 4 32 45 pm

bcmoseley commented 10 years ago

I agree. What do you think Kris and Bryn?

brynhughes commented 10 years ago

I like this, too. 

Bryn

On Sat, Aug 23, 2014 at 4:34 PM, Elliott Hauser notifications@github.com wrote:

This is obviously very subjective but relative width pages are more idiomatic. And I think they're easier to read YMMV :)

Before:

screenshot 2014-08-23 at 4 34 07 pm

After:

screenshot 2014-08-23 at 4 32 45 pm You can merge this Pull Request by running: git pull https://github.com/eah13/openmusictheory width Or you can view, comment on it, or merge it online at: https://github.com/hybrid-pedagogy/openmusictheory/pull/56 -- Commit Summary --

kshaffer commented 10 years ago

I prefer having a maximum width that adjust responsively for smaller windows (what this theme currently uses). Beyond a certain width, tracking lines becomes harder, and it is easier to lose your place reading. I think most cognitive typographers (I just made up that term, but there are such people) recommend 60–80 characters max for something meant for long-form reading. (This is already more than that.) And I know a lot of windows users with wide screens that open everything up in full screen. So I'd prefer keeping as is, if that's okay.

eah13 commented 10 years ago

@kshaffer that goal makes sense. It seems like the using em units may be what we need here:

http://www.w3.org/WAI/GL/css2em.htm

In this way you can set the height of the text and the width of the page to ratios of each other as opposed to pixels, enabling the responsiveness you're looking for. Happy to hack in this direction if it's a change you'd accept - the percentage I submitted above was just a 1 minute stab at responsive :).

~680 pixels wide is going to be very very small on an increasing number of devices with very large horizontal widths (some phones are up to 2000+ pixels wide now). With em we don't need to know or care about pixels at all, just ratios. Yay!

kshaffer commented 10 years ago

I think the responsive design already takes mobile into account. My phone displays it just fine, regardless of pixels. Also, since we're planning en the development site) as we wait for Boundless, I don't think we have to worry too much. As long as it works for our students (and Boundless doesn't take too long to get fully functional—I'll meet with them tomorrow to get an update), I don't think we need to get too precise with theme tweaking. If things change with Boundless, we should definitely explore theme universality (especially as regards accessibility) in more detail.

Kris

Kris Shaffer, Ph.D. Instructor of Music Theory University of Colorado–Boulder kris.shaffermusic.com Twitter: @krisshaffer

On Mon, Aug 25, 2014 at 12:31 PM, Elliott Hauser notifications@github.com wrote:

@kshaffer that goal makes sense. It seems like the using em units may be what we need here: http://www.w3.org/WAI/GL/css2em.htm In this way you can set the height of the text and the width of the page to ratios of each other as opposed to pixels, enabling the responsiveness you're looking for. Happy to hack in this direction if it's a change you'd accept - the percentage I submitted above was just a 1 minute stab at responsive :).

~680 pixels wide is going to be very very small on an increasing number of devices with very large horizontal widths (some phones are up to 2000+ pixels wide now). With em we don't need to know or care about pixels at all, just ratios. Yay!

Reply to this email directly or view it on GitHub: https://github.com/hybrid-pedagogy/openmusictheory/pull/56#issuecomment-53307193