Live data from Hacker News

New Boston Globe website design

bostonglobe.com

21–30 of 111 posts

Re: New Boston Globe website design

#21

I think responsive design that changes when resized like this is a bit annoying and unexpected. When I'm using the page and I resize it, I lose my place on the page and all the content reflows. There's nothing in traditional media that works that way.

>> There's nothing in traditional media that works that way.

And that is exactly the point - it feels like we are finally waking up to what the web can really do that traditional media cannot. I'm sure in a few years having the content reflow will be something users expect of every website (not that it is something people do all the time - see the comment that guywithabike made).

Re: New Boston Globe website design

#26

It is worth checking out. Really neat how well it does go from big to small. Was this done with Javascript/jQuery?

Nope, by what I can see. Basically all CSS[3]. The JS they have seems to be for libraries like Modernzr (HTML5 related) and some other things.

Basically, in the CSS there is code like "@media screen and (min-width: 480px) {}" where everything within the curly braces is ONLY for browser windows that are > 480px. So, you can do all sorts of combinations like max-width: AND min-width:. When the window is resized it uses new rules.

AFAIK people refer to this as 'Responsive web design' and thankfully is being picked up by a lot of designers/developers. There's a ton of ready-made CSS frameworks and the like available for people to use.

(People, feel free to correct/clarify my explanation)

Re: New Boston Globe website design

#28

The real success here is not the fluid design (which is awesome). It's getting it through inside a traditional media company. I'd love to read a frank overview of that process as well as the design itself.

Bravo for this - what was the approach? Let's hear it!

Re: New Boston Globe website design

#29

I used a similar technique on my web-based timeline-software. The aim was for the timeline to work at almost any size. Not quite perfected it but getting close. If you want to play with the resizing, you can use this link - http://www.tiki-toki.com/timeline/entry/43/Beautiful-web-bas...

That app would be really cool if you could visualize data that imports from other sources. Imagine documenting your facebook pictures instantly through time via the site's meta data and links to the pictures themselves, etc.

Well done. I noticed that the navigation gets borked when the screen gets really small. I think the choice here is to show a different navigation menu (rollover menus?).

Re: New Boston Globe website design

#30

I used a similar technique on my web-based timeline-software. The aim was for the timeline to work at almost any size. Not quite perfected it but getting close. If you want to play with the resizing, you can use this link - http://www.tiki-toki.com/timeline/entry/43/Beautiful-web-bas...

I like the visual rhythm of days.

But just letting you know, background is way too busy :) Text is hardly readable in some parts. I have no idea what's going on and I'm a power-user who designed and used different types of UIs from MS-DOS shells to Kinect-based NUIs.

Text isn't selectable on the items in Safari which I think is a big deal. Hyperlinks on top right aren't underlined, I didn't even know they were hyperlinks before I hovered on them.

It's like a splash of colors of all sorts, different fonts and text in my face.

Post reply on HN