Archive for the 'HTML and CSS' category

You are using Firefox, you want to use it at its best, you should go to the FireFox tweak guide.

Software programs to do anything you want with your PC if you are a bit more geeky than most but do not want to pay much. Freeware & shareware.

In the spotlight: Sony Alpha 900 Canon EOS 5D Mk II Nikon D700 FX Download Nero for free

Webcron is an automated task service at set hours. If you know Unix or Linux you already heard about the Crontab. Webcron is a Web adaptation of this well-known Crontab. But nothing complicated at all!

Webcron allows you to do tasks at set hours by looking for a page on your website. For example, save your database, therefore you only have to prepare a script database_save.php that saves the database to a file. Add then a task to you Webcron to do the http://www.domaine.com/sauvegarde_base.php request.

Very simple and recommended.

After a previous post about the reasons there are not to use the HTML tables (and to prefer CSS tables), I want to come back to this issue with my own experience.

When I went to the fifth version of this web site interface (the one you see at the time of posting this article), I tried to build the site theme using as much CSS as possible in order to ease future migrations and to lighten the result by separating content and styles. However, it soon appeared clear that the 3-column organization (with footer) i sone of the most difficult contruction for CSS tables and it always creates problems of rendering on different browsers.

This is why I decided to choose the best of both worlds. Let’s clarify this position. HTML tables are very simple to build and are correctly implemented in the vast majority of Internet browsers (their definition is so old now…). I decided to build the basic squeleton out of HTML tables. But I limited myself to the structure only. All the styling and formatting is done in CSS tags.

This is a very powerful solution. Use one technique for what it’s best. HTML tables allow easy definition of columns, clear grouping, etc. CSS tags allow splitting content and structure, defining clearly sizes, margins, paddings, borders, cell backgrounds, colours, etc. This gives a theme that is very tolerant (e.g. HTML tables behave well when an image is sized erroneously big -a quite common error- and forces the column dimensions). But the styling is very flexible in CSS.

If you are interested, I invite you to check the sources of this page and the associated CSS file.

You may have noticed a new logo appearing on our web site since the redesigned interface went online.

If your web browser supports it (Opera 9, FireFox, Internet Explorer 7), a similar orange icon may appear on the web address bar.

This is a feature that is good both for users and for web site designers. For the users, it provides a simple way to access to the information on our web site by allowing FireFox or Opera to directly collect the news from the web site without even opening the page. If you click on one of these RSS feed icons , your web browser should propose to subscribe to the feed. After that, you will be informed more directly about news on Roumazeilles.net even if you do not open the web site. You will never miss interesting headlines!

The RSS feed icon is a standardized way (proposed by FireFox) to easily point you to this fast access to the web site information. By itself, this is good news for the web designer because it gives a common recognition standard: I don’t have to explain (like I do here) the meaning of the icon, I don’t have to invent some explanation or title. It looks the same on all web sites supporting this feature.

Initially, it RSS feeds were created to syndicate content (to allow other sites to seamlessly include the content of Roumazeilles.net in their own pages). This is still possible (this is what is used by news management web sites like MyYahoo!, MyAOL, Google, or Bloglines), but it has been greatly extended by the creation of specific tools integrated in your own browser.

As you certainly noticed, we changed significantly the look-and-feel of our web site. The plastic surgeon used its scalpel to give a new face to the web site: reduce the size of the pages (faster downloads for you), improve readability (the white background increases the contrast), come back to a more sober graphic design (only a few graphic signs and homogeneous colours).

But there are some new functionalities too. The most important one is certainly the addition of the ability to send an email to your friends to let them know about a post that you would find particularly interesting (for whatever reason). Just before sending, do not forget to copy the code that is provided (it allows to protect us against robots that would be trying to send automated emails using this form). In any case, be reasonable and polite with your use of this nice little feature.

Just look at the link at the bottom of articles on the front page (or in the box at the bottom right for post pages).

N|vu is a web development application with a WYSIWYG interface that is aimed to be user friendly, easy and powerful. It is supposed to be a serious competition for major commercial tools like DreamWeaver (N|vu is a free download making it a good contender).

Unfortunately, since it comes from the Open Source world, N|vu tends to receive a lot of reviews, but not often from the professional web designers. This is why I appreciated a lot to find a specific review that is aimed at comparing N|vu with DreamWeaver and includes very real-life issues of every-day life of a web programmer/designer. It is not only scratching the surface (looking at the menus), but rather trying to extract the best of it (digging into CSS code generation, consistency of the interface, etc.)

If you consider using N|vu for your professional (or serious) HTML/CSS editing and web site design, I advise you to take 10 minutes to read this review. Even if it dates back to 2004, it contains very neat information.

finally, it’s happened! Microsoft announced officially the end of FrontPage (Microsoft Office SharePoint Designer 2007 and Microsoft Expression Web Designer will come in Spring to replace it).

As a matter of fact, FrontPage did not really succeed in penetrating the pro market for web designers. Its utterly simplistic approach to web design was obviously far behind some serious competitors (or leaders) like DreamWeaver. But, non-specialists now stop using it -essentially- because they no longer need it. Today, ready-to-install blogs (like WordPress, or Joomla or Mamba or SPIP) have already marginalized web site design, but solutions including both the blog software and the web hosting (like WordPress.com) allow to forget completely about both the tool and the installation. You can immediately start using it… without even looking at FrontPage.

So, FrontPage saw its public disappear. FrontPage lost its justification. We won’t cry.

This is the tough question that BrowserShots.org web site anwsers for you. They provide a simple way to test your web site in a large variety of configurations and browsers. This is a very nice idea founded on the voluntary help of computers installed all over the world (widely distributed architecture).

This way, you will know how Roumazeilles.net looks on a number of exotic (or not) browsers:

Recommended to any web designer.

Even if I am usually in favor of designing web sites using tables, I wanted to provide a link to an interesting article taking exactly the opposite position: Why tables for layout is stupid.

For those wondering, my preference goes to HTML tables because they are easier to implement the 3-column designs that I prefer (those are really difficult to grasp in pure CSS).

Mark James, a part-time web developper, produced more than a thousand slick little icons that are distributed freely on famfamfam.com. This work is licensed under a Creative Commons Attribution 2.5 License, which means that if you want to use them, you only have to remember to state clearly that Mark James is the author and to include a link back to his web site.

I like the silk icon collection, but there is also a very useful collection of 239 small country flags.