Posts filed under 'CSS'
Well, SHiFT isn’t happening this year… and yeah, believe me no one’s more sad about it than myself, well may two other crazy guys! But we couldn’t stand still so we’re helping SAPO in an astonishing event:

and trust me, we’re all aiming high, as high as we’re allowed to get all the Portuguese developers an amazing event, party and mash-ups contest!
The event is obviously inspired in the Yahoo Hackday which totally contagious us back in May in London when some of us managed to attend it. Since not all Portuguese can afford traveling as far, SAPO decided to recreate it!
We’re trying to include everyone that wishes to go, but since the seats are limited, I urge everyone who praises for his/her geekiness without shame to register at:
Time as come for all of you geeks in the closet to come out, so I really hope we can all meet up in November in Lisbon!!
September 21st, 2007
NY Times just released yesterday a new version of their digital home, the new design includes some new features that probably justify why the NY Times is such a reference on the news paper market. It’s not my all time favorite, that prize still goes for “El Pais“, I don’t really like to much crowded homepages, with too much information, but I recognize that an online newspaper homepage must fits for a diverse range of individuals needs, so I can live with it.
The feature that got my biggest attention, was the fact that there’s now an explicit relation between the newspaper (traditional media) and the blogosphere, in the sense that on the homepage you’ll now find an area where you can read the most blogged articles from the newspaper, and this way get a sense of what people are actually talking about and seize the discussion. It’s an important step for the newspaper, but in particular is also the recognition of the growing importance of blogs as a media platform.
From the redesign point-of-view, it’s interesting to see that the new layout stands on top of a 5 column layout, very rich, but also very concise in terms of the information it provides at first glance. The new design is brilliantly made in terms of user interface adaptability, doesn’t break with the old website concepts, it’s just an improvement, allowing users to easily adapt to the new layout by making no so obvious changes to the navigation and typography.
A funny thing, which I actually don’t know if it’s entirely new, is that although their main market is the paper business, they just have a new area dedicated to multimedia content, in particular videos. It’s a sign of times, it’s hard to live only of words in this ever more image/video rich world. It’s also a good sign of adaptability from the NY Times an certainly an example for the rest of the world newspapers, in a sense that their future depend of this kind of market adaptability.
The responsible (correct me if I’m wrong) for the redesign was Axentric, who had some time ago brought us the redesign of the also famous The Onion.
April 5th, 2006
Fluid as in layouts that respond to user interaction’s, when a user resizes a window or changes it’s content the layout accompanies such actions. I’ve seen several sites with some sort of fluid layouts in contents and I really enjoyed seeing the pages adapating when one resizes the browser window, so, I did some searching on the subject and found some nice tutorials/examples of how it could be achieved.
I got some ideas from Menno, in a particular post where he addresses Web Development of Applications using CSS. He suggests two approaches to obtain flexible layouts.
First approach you have one panel that uses all 100% space available from you browser, if you have two they have to split that amount in two (whether it’s equal or not depends on whatever you have in mind!), if you have tree or more panels you distribute the space for the amount of panels.
You can check Menno examples using this approach here, here and a nested version here.
On the second approach he suggested that when you have multiple panels, only one should be extendible, all the other should its size fixed, for instance you’ll have tree columns, you defined a fixed size for the ones on the sides (left and right) and you allow the pannel in the middle to extend itself with the window. Menno also created a simple example using this second approach, you can check it here.
I personally prefer the first approach, simplicity rules, and the user can effectively distinguish what’s going on. One rather interesting example of fluid layouts comes by the hand of Cameron Adams, in one of his experiments he plays with some CSS and javascript to conceive a page that dynamically changes layout according to window sizes, see it working here (don’t forget to
resize the window!), and discover how you can go from this layout:

to this:

May 25th, 2005