Code Brewery: List bullets for your HTML
A set of bullets (downloadable) which can be used on web pages. I usually use definition container, definition term and definition description for lists in my posts and pages are that makes the page more semantic (and I’m a sucker for semantic web) and therefore this sweet little download helped me a lot. Hope it helps some others are well.
Practice graceful degradation technique when designing in HTML and CSS
Techniques for writing HTML and CSS code
The developments in the arena of HTML and CSS are so fast it is tough to ensure that the latest techniques are used while creating the code. What further complicates things for designers and developers is that browsers are updated randomly and different elements of HTML and CSS code are implemented at a different pace.
Graceful Degradation is a term used for
writng code where the code is first written catering for the latest techniques and then fixing things so that they work for older technologies
. For example you would code your website so that users are able to browse the website properly using the latest browser like Chrome 16.0.912.63 m. Once the code is written later you would write the code so that the website is displayed properly using other browsers like Firefox.
The opposite of Graceful Degradation is Progressive Enhancement.
When practicing Progressive Enhancement code is written so that it displays properly even if basic techniques are supported
(for example write the code for Internet Explorer 5.0) and then gradually update the code to take advantage for the latest techniques (like for accessing the website using Internet Explorer 9).
Both the techniques are practiced by developers and designers as both of them have their own advantages and disadvantages. Which one do you practice?
title and alt attributes of the img tag in HTML - Difference and usage
One of the question that crops up every now and then is what is the relevance of alt and title tag and how to use them.
You should use the alt and title attributes of the image (<img>) tag when coding in HTML carefully. Using the same content for alt and title tags is not a good practice. In fact some web developers and SEO professionals point out (in this discussion) that having same alt and title tag might lead to penalization for duplicate content.The fact that one of the factors that can help your website to rank better on search engine are the alt and title attributes of the image tag. Google webmaster discussion has a informative discussion on the importance of alt and title tag.
Comments on alt and title attributes for <img> tag
Lanbol (who is one of top bloggers) suggests in his post that alt attribute should be used for all the image tags. The content of the alt attribute should be such that if the user cannot see the image he can understand from alt attribute the what the image contains. According to Lanbol the title attribute should be used for only those images that are linked. Further the title attribute should add information to the image. You can read the full discussion here. In the end according to Lanbol - always add the ALT attribute to your images but include the TITLE attribute only if the image is a link.
Fadtastic post focuses on the importance of the alt and title attribute to improve accessability of the website. The post suggests that the
- alt and title attributes should be kept short
- should improve the user experience
- should play the role of additional text or caption describing the image.
The post dwells into and discusses the W3C specifications.
A post Search Engine Journal by Ann Smarty helped me clear up things. She refers to the Google Webmaster Groups discussion. She also points out that according to the Google webmaster tool blog post does admit that Google looks at the alt tag to understand what the image is about. Even Aaron Wall is cited saying that alt attribute is more important than others.
From Ann’s post I understood the following
- It is important to use alt and title attributes
- the title tag should add to the image information and it should short, catchy and consice
- both the tags are meant for visitors
- use keywords for in both the alt and title attributes however, take care that the keywords used are not the same
- the alt and title tag should not be the same
- keep the alt and title tags meaningful and relevant.
In the end the best advise is to use alt and title attributes meaningfully and smartly.
