Firefox 3.5 released

1 July 2009 | Comments

The latest version of Firefox was released yesterday. Firefox 3.5 has improved performance and a host of other features. On the website, there’s also a useful Tips and Tricks page.

Of course, the main reason I like Firefox so much is its extendability and the availablility of third party Add-Ons. These have given me some genuine productivity improvements and the web developer section has some outstanding tools.

Aligning your CSS properties .... and using a few different ones

24 June 2009 | Comments [2]

Well, that was a slight surprise. I looked at the visitors statistics for this blog yesterday and discovered that more than 70% of you are not using Internet Explorer. As a result, I have decided to ‘align’ the CSS properties that I use with the browser stats on this blog – and start using some CSS properties that I would not normally use. By this, I mean properties that are supported by Firefox and Safari, for example, but perhaps not by IE. Users with browsers that do not support these properties will still see the website perfectly fine but will not see some of the styles that are produced by these ‘more advanced’ properties. After all, websites should not look exactly the same in all browsers.

I have started the process by sprinkling in some border-radius loveliness around the site. The border-radius CSS3 property allows you to add borders with rounded corners to elements by specifying a few simple rules in your style sheet. If you have a background colour on the element but no border you will get a rounded corner box. I will describe this in more detail in a later post but here’s a nice article that explains border-radius.

This is an example paragraph with the border radius property applied. If you are viewing this with Firefox and Safari, you will see that it has a pale green background with rounded corners. If using Internet Explorer, you will see straight edges.

Using these properties gives me a chance to experiment a bit with some newer CSS features that I’m sure will become mainstream. In this case, it also means that I can implement rounded corners in a few lines with minimal effort. Result!

Technorati :

Why web standards should be important to clients

22 June 2009 | Comments

There’s a nice summary of the benefits of web standards in an article called Tell your clients why web standards should matter to them on the That Web Guy Blog. Really, the points here are well-known and building websites using web standards is pretty much a no-brainer in my opinion. Nevertheless, there are many websites and web designers/developers out there who ‘don’t get it’. Perhaps the above article will convince a few more of them.

PS: There are some other good articles on the That Web Guy Blog. Nice design and layout as well!

Technorati :

Clearing floats with the overflow property

18 June 2009 | Comments [3]

Using the float property is a fundamental part of the tools that we use as web designers/developers when wrangling with CSS. Floating an image is probably one of the most common tasks when we want to align the image either left or right within a containing block [div or paragraph]. However, use of the float property comes with its own problems and chief amongst these is that often we need to ‘clear the float’ so that other elements [often the element that contains the floated element] behave in the way that we want. Here’s a method I have used recently.

Read more ...

jQuery for Designers

13 June 2009 | Comments

jQuery is a very popular JavaScript library that is relatively easy to use. However, if you want to explore jQuery further and really understand how it works, you will need to read the documentation and/or follow a few tutorials. That’s where jQuery for Designers from Remy Sharp might be useful! The website has a range of jQuery tutorials, each including a screencast and demo. In particular, the screencasts are great at providing an explanation of each JavaScript effect and how it was achieved.

Info: The screencasts are provided as Quicktime and Flash movies.

The latest tutorial is an Infinite Carousel which is the carousel effect seen on the Apple Mac Ads page. This is a neat way of highlighting a range of content items [in the Apple example, their adverts over the years] and has often been used with image galleries.

I am a big fan of screencasts because they explain each line of code. This makes it easier to understand the examples compared with a ‘normal’ tutorial, which sometimes assume a degree of knowledge. If you want to understand jQuery more [like me], why not give jQuery for Designers a try!