Back

HTML Best Practices, Part–2 (3 - part series)

# BestHTMLPractices

-By Adrianus Raditya

Oct 24 · 5 min read

Insight 1
Motion design in bumper for Second Chance

13. Download ySlow : Especially in the last few years, the Yahoo team has been doing some really great work in our field. Not too long ago, they released an extension for Firebug called ySlow. When activated, it will analyze the given website and return a “report card” of sorts which details the areas where your site needs improvement. It can be a bit harsh, but it’s all for the greater good. 

14. Wrap Navigation with an Unordered List: Use this method, for semantic reasons. Your job is to write the best possible code that you’re capable of. 

15. Once the Website is Complete, Compress! : By zipping your CSS and JavaScript files, you can reduce the size of each file by a substantial 25% or so. Please don’t bother doing this while still in development. However, once the site is, more-or-less, complete, utilize a few online compression programs to save yourself some bandwidth. 

16. All Images Require “Alt” Attributes : It’s very important, for accessibility and validation reasons. 

17. Use a CSS Reset: CSS Reset helps in making website almost all browser compatible by bringing all default css properties of different browsers to zero. 

18. Use Meaningful Title Tags: The <title> tag helps make a web page more meaningful and search-engine friendly. 

19. Use Descriptive Meta Tags : The description meta attribute describes the basic purpose of your web page (a summary of what the web page contains). For each web page, you should place a concise and relevant summary inside the meta description tag. 

20. Don’t try to spam your description: Don’t try to spam your description with repeated words and phrases because search engines are intelligent enough to detect that. Instead, just try to be simple and straightforward in explaining the purpose of your web page. 

21. Separate Content from Presentation: Your HTML is your content. CSS provides your content’s visual presentation. Never mix both. 

22. Minify and Unify CSS: A simple website usually has one main CSS file and possibly a few more for things like CSS reset and browser-specific fixes. But each CSS file has to make an HTTP request, which slows down website load times. 

A solution to this problem is to minify (take out unneeded characters such as spaces, newlines, and tabs) all your code and try to unify files that can be combined into one file. This will improve your website load times. 

23. Use Modular IE Fixes: You can use conditional comments to target Internet Explorer if you are having issues with your web pages. 

Example 

<!–[if IE 7]> <link rel=”stylesheet” href=”css/ie-7.css” media=”all”> <![endif]– 

24. Avoid using Deprecated HTML Tags: Deprecated HTML tags are HTML tags that are or will soon be removed from the HTML specification. It is recommended that you not use these HTML tags because they may become obsolete. 

Source : https://experiencedesignideas.wordpress.com/2012/11/24/html-best-practices-part-2-3-part-series/

 

Mumbai

Concluding message

A well-designed website for users with disabilities is a site that is more accessible to use for all types of users.

A well-designed digital business can easily explain the process of online buying and selling for users with disabilities and can add more value to the business.

Therefore, add some mint into the users’ cup of tea and provide an accessible zest to your digital assets by making it more compliant.

Feel free to get in touch with TECHVED Consulting!

From Ideation To Digital Transformation

We take care of all your needs

Contact Us

HTML Best Practices, Part–2 (3 - part series)

24 November 2012

13. Download ySlow : Especially in the last few years, the Yahoo team has been doing some really great work in our field. Not too long ago, they released an extension for Firebug called ySlow. When activated, it will analyze the given website and return a “report card” of sorts which details the areas where your site needs improvement. It can be a bit harsh, but it’s all for the greater good. 

14. Wrap Navigation with an Unordered List: Use this method, for semantic reasons. Your job is to write the best possible code that you’re capable of. 

15. Once the Website is Complete, Compress! : By zipping your CSS and JavaScript files, you can reduce the size of each file by a substantial 25% or so. Please don’t bother doing this while still in development. However, once the site is, more-or-less, complete, utilize a few online compression programs to save yourself some bandwidth. 

16. All Images Require “Alt” Attributes : It’s very important, for accessibility and validation reasons. 

17. Use a CSS Reset: CSS Reset helps in making website almost all browser compatible by bringing all default css properties of different browsers to zero. 

18. Use Meaningful Title Tags: The <title> tag helps make a web page more meaningful and search-engine friendly. 

19. Use Descriptive Meta Tags : The description meta attribute describes the basic purpose of your web page (a summary of what the web page contains). For each web page, you should place a concise and relevant summary inside the meta description tag. 

20. Don’t try to spam your description: Don’t try to spam your description with repeated words and phrases because search engines are intelligent enough to detect that. Instead, just try to be simple and straightforward in explaining the purpose of your web page. 

21. Separate Content from Presentation: Your HTML is your content. CSS provides your content’s visual presentation. Never mix both. 

22. Minify and Unify CSS: A simple website usually has one main CSS file and possibly a few more for things like CSS reset and browser-specific fixes. But each CSS file has to make an HTTP request, which slows down website load times. 

A solution to this problem is to minify (take out unneeded characters such as spaces, newlines, and tabs) all your code and try to unify files that can be combined into one file. This will improve your website load times. 

23. Use Modular IE Fixes: You can use conditional comments to target Internet Explorer if you are having issues with your web pages. 

Example 

<!–[if IE 7]> <link rel=”stylesheet” href=”css/ie-7.css” media=”all”> <![endif]– 

24. Avoid using Deprecated HTML Tags: Deprecated HTML tags are HTML tags that are or will soon be removed from the HTML specification. It is recommended that you not use these HTML tags because they may become obsolete. 

Source : https://experiencedesignideas.wordpress.com/2012/11/24/html-best-practices-part-2-3-part-series/

 

Our Archived Blogs