Notes on a web journey

posted on: 29 March 2008

Sevencolors.org make over

filed under: @ 14:06:02 by 7colors

I finally completed the new layout and published it. I made some radical changes in colors and site structure. Everything is reachable from the home page. While before it was possible to read the latest five posts, now only one post is fully readable, the previous four posts are included only as title , category and tags. There is an archive page for all posts, while before the archives were part of the home page. The photos and studies pages are gone (but external links to photos or studies are not broken), now there is a flickr badge for the photos and all the links to the studies also on the home page. The links page is just not there anymore, that was something needed before Delicious came along...

The change in structure has simplified the use of the site, giving access to all the posts, pictures and studies from one place. I also decided on a major color change. During the testing of the new layout I found,as I knew I would, some things that needed to be fixed and others that could be made nicer. I moved the comments link from the bottom of the post to the top and substituted the text with an icon (still courtesy of http://famfamfam.com), for example.

I had some problems with the flickr badge because it comes with a Javascript call incapsulated between <table> and <tr> tags which does not validate since a row (<tr>) is supposed to have cells (<td>) inside. The Javascript does that but it's unreadable by the validator. Apparently, though, if the Javascript call is just inside <div> tags it produces a series of images (<img>) wrapped in anchors (<a>) that link to the photo on flickr, no <td>s. It's then possible to apply CSS to the div and img. It's not the best solution but it validates.

All in all I'm pretty happy with the result, I felt that a change in appearance was long overdue and that, after using the site as it was for more then two years, the structure could be improved.

Tags:

COMMENTS:

Post a comment

XHTML: You can use these tags: <a href="" title=""> <abbr title=""> <acronym title=""> <blockquote cite=""> <code> <em> <strike> <strong>

CSS,Javascript and Php studies

Anti spam email
A solution to writing an anti spam email contact link
filed under: Javascript
Background image
A background image randomizer that I used in the second version of this site.
filed under: Javascript/CSS
Javascript menu
A menu that uses Javascript and session cookies.
filed under: Javascript/CSS
MiniSite
Experimenting with CSS and Javascript.A simple but, in my opinion, nice navigation “system”. The MiniSite is a one page site.
filed under: Javascript/CSS
Photo display
Protect copyrighted photos: a simple but effective solution.
filed under: Javascript/CSS
Photo gallery
A photo gallery made for a friend
filed under: Javascript
PHP menu
A PHP menu that can be updated without having to re-publish all the pages is on.
filed under: PHP
Pop-up menu
A very simple pop up menu powered by Javascript. It works also if Javascript is disabled.
filed under: Javascript/CSS
RSS feed
How to write and use an RSS feed
filed under: rss-xml
Tag replacer
The Tag replacer explained and a link to it.
filed under: PHP
Tags search
A search form build and powered using Javascript and the DOM
filed under: Javascript