Horizontally aligned elements in forms

Geplaatst in Webdesign Reeds 3 reacties

Vertically aligned homepage items. These kind of horizontally aligned blocks is something we are seeing more and more these days. There are several sites that use this kind of positioning of elements for various goals. Blogger.com uses it to navigate through their quick tour feature on their homepage. Boltfolio.com and Flickr.com uses it for a similar goal. Musicstrands even integrated it’s whole navigation structure in horizontally aligned blocks. There are hundreds of sites using this layout method, properly or not.

Why am I blogging about this? Well because i’ve found another website making use of the technique, this time in an original and effective way. Take a look at the Squarespace Signup page. They applied this method to their subscription form.

At first it felt a little awkward but after taking a closer look it works wonderfully well. The steps are visually separated by numbers, followed by a small description below and then just a simple input field after which you automatically proceed to the next step. Clever and easy to use. The submit button is a big button below the form flanked by information about submitting the forms.

The only thing that bothers me as a webdesigner is that they didn’t use semantics to implement it. Properly use of list tags and styling and positioning with CSS would have made this technique perfect. If i find the time i’ll give it a try and see if this can be acomplished by semantically using <ol> tags and styling it with CSS.

But what with larger forms? Well … this technique obviously won’t work with big forms in which case the vertically aligned elements is still the way to go but personally i’m conviced that you should always reduce the number of elements of a form to an absolute minimum. Nothing is more annoying that filling in long forms, not to talk about validating the whole data after you hit the submit button.

I’ll be soon working out a tutorial on how to achieve this effect with pure CSS and semantics. Stay tuned and subscribe to my RSS Feed if you want to keep track of the new items on my blog.


Yahoo top searches for 2005

Geplaatst in Internet Nog geen reacties

Like every year Yahoo publishes it’s top searches of the year around christmas. This year is no different so here they are: the Yahoo! 2005 Top Searches.

Yahoo! 2005 Top Searches

2005 was a wild year in Search. Mariah Carey returned with a vengeance, while Britney Spears remained as popular as ever thanks to her new baby with future “Surreal Life” contestant Kevin Federline. Looking past the celeb culture hubbub, Hurricane Katrina and the Asian tsunami dominated news searches, while Apple’s iPod drew big Buzz as well.

Some things I noticed is the vast amount of celebrities in the overall top searches. Britney Spears taking the lead again, followed by 50 Cent, Mariah Carrey and other celebs. This year’s top 10 consists of 8 Celebs (Or 9 if you count Greenday as a celeb), one band and Cartoon Network. While last years Yahoo! Top Searches only featured 4 Celebs in the top 10 (with Paris Hilton on nr 1).

For some people this might seem like an evolution but to me these numbers prove nothing, except maybe that the biggest group of yahoo users are kids and teenagers.


Rocket Linkdump 18 dec 2005

Geplaatst in Blogging, Internet, Web 2.0, Webdesign Nog geen reacties

A Rocket Linkdump is a collection of the 5 newest links i’ve posted on the homepage here, in the “what i am reading” section. If you know of other interesting websites, books or articles related to this material you are most welcome to add them in the comments.

  1. Tim Berners Lee Blog

    Timbl’s blog as he likes to call it himself, big daddy has finally started his own blog and it’s damn interesting to read about his view on how the web is evolving.
  2. Netvibes Personal Homepage

    Netvibes is a customizable web 2.0 homepage solution that is just better than it’s competitors, just register for free and start straight away! It’s a marvel!
  3. Mooflex CMS

    Mooflex is a totally awsome CMS built with PHP and completely Ajaxified. It uses smarty templating and you need to check it out!
  4. Web 2.0 and usability

    D. Keith Robinson comments on usability and accessibility of what some of us like to call web2.0
  5. Access by design by Sarah Horton

    A great book about accessibility and usability on the web

RSS icon, one small step for Microsoft …

Geplaatst in Internet Nog geen reacties

RSS Feed iconBut one giant leap for uniformity! After the IE RSS team announced they will be adopting the Mozilla RSS icon as a standard indicator for RSS feeds now the Outlook team also announced they will be using our little orange fellow.

I’m really looking forward to Outlook 12 and the whole Office 12 suite, the new features and revamped interface look intimidating but if i’m to believe the word from bloggers it’s a really cleverly designed system. I actually might start to like Microsoft with the course they are taking recently.


Ruby on Rails 1.0 released

Geplaatst in Web 2.0, Webdevelopment Nog geen reacties

Ruby on Rails 1.0 has been released a few days ago. This is a big step forward for Ruby on Rails as it now should function as a stable environment for webdevelopers. I’ll be sure to check it out in the beginning of next year and i think it’s safe to state that 2006 will be the year of Web2.0 with Ruby on Rails taking the lead for now …

Via: Sitepoint.com