Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

Responsive Text

frankieroberto.com

Post reply on HN
Print view View original

51–60 of 63 posts

Re: Responsive Text

#51

Post by monsterix »

Gring wrote: post #50

My problem with those responsive web sites is that they only react to changes of the browser window width, but not the height. For example, on this page, you can change the width so that we only see 3 short sentences. But if you change your browser height from 800x800 to 800x350, you still get the full, long text, but it's cut off in the middle, and there is a scroll bar. If the author's intent was to try hard to sho…

Absolutely. Responsive design is simply shifting two-column into one-column and getting away with it. That's not always a preferred way, I'd say.

http://news.ycombinator.com/item?id=3597932

Re: Responsive Text

#52

Post by mmahemoff »

A simple, standards-based way to implement this would be to use the HTML5 details and summary elements.

http://html5doctor.com/the-details-and-summary-elements/

You could make default the details to be "open" for big screens and closed, showing the summary only, for small ones. Downside is that you only get two levels if you stick to the spirit and letter of the standard.

Re: Responsive Text

#55

Post by Isofarro »

simonw wrote: post #7

We do something similar to this on Lanyrd - try shrinking the browser window on http://sxsw.lanyrd.com/ for example. The labels on the tabs change from "your sessions, your contacts' sessions, all sessions (1114), attendees (2594)" at the widest setting to "you, contacts, all, attendees" on narrower screens. It's implemented by wrapping a span with a class of "not-narrow-friendly" around the words that should be hidd…

How would you handle internationalisation with that approach?

Re: Responsive Text

#57

Post by webfuel »

simonw wrote: post #7

We do something similar to this on Lanyrd - try shrinking the browser window on http://sxsw.lanyrd.com/ for example. The labels on the tabs change from "your sessions, your contacts' sessions, all sessions (1114), attendees (2594)" at the widest setting to "you, contacts, all, attendees" on narrower screens. It's implemented by wrapping a span with a class of "not-narrow-friendly" around the words that should be hidd…

I like how you also did that with the dates (e.g. "Friday" goes to "Fri")

Unsolicited feedback: At the narrower widths, the sidebar (.secondary) would be better off falling after the main content (.primary) It might also work having "Filter by topic" turned into a drop down.

Re: Responsive Text

#58

Post by SWattam »

This is essentially the output phase of something I'm working on for my PhD. I've written a tool that can read salience-tagged CSV input and output a page of responsive text:

http://stephenwattam.com/projects/responsivetext/

The example's a bit crummy, but with some better input it should provide a useful base for visualising important text features.

Re: Responsive Text

#59

Post by lucb1e »

ImprovedSilence wrote: post #19
ot wrote: post #9

I may have a problem with OCD, but I would hate the idea that some content is hidden to me just because I'm browsing with the wrong screen/window size. Hiding redundant elements, navigational bars, maybe images, etc... is fine, but I'm definitely not comfortable with the idea of hiding content based on context.

Yeah, it's a very interesting idea, but I don't want half the article if I'm browsing on a mobile device. Besides, I thought the point of responsiveness was to REARRANGE data, not completely eliminate it. styling, yeah, go ahead and get rid of elements and color bars and what have you, shrink pictures, but please don't throw away words!

This was indeed the idea of the W3C when they wrote this. The page he links to even says that:

http://www.w3.org/TR/css3-mediaqueries/ "Among the media features that can be used in media queries are ‘width’, ‘height’, and ‘color’. By using media queries, presentations can be tailored to a specific range of output devices without changing the content itself."

The part "without changing the content itself" is pretty clearly not what he is doing here. Like dozens of others have said, just an interesting idea but not something that should be used like this in practice.

Re: Responsive Text

#60

Post by sbierwagen »

Isofarro wrote: post #55
simonw wrote: post #7

We do something similar to this on Lanyrd - try shrinking the browser window on http://sxsw.lanyrd.com/ for example. The labels on the tabs change from "your sessions, your contacts' sessions, all sessions (1114), attendees (2594)" at the widest setting to "you, contacts, all, attendees" on narrower screens. It's implemented by wrapping a span with a class of "not-narrow-friendly" around the words that should be hidd…

How would you handle internationalisation with that approach?

Presumably by telling non-English speakers to go piss up a rope.
Post reply on HN