Storin t'Kel 2024-02-27 HTML: Common Mistakes version 0.98 Informative Blog Table of Contents 1. Introduction 1.1. First of a series of posts 1.2. What is it not for? 1.3. What is it for? 2. rickcarlino.com 2.1. HTML or XHTML Declaration? 2.2. Language of website 2.3. Self-closing element tags 2.4. Images alternate text 2.5. Javascript type/text 3. Afterthought 4. References 1. Introduction 1.1. First of a series of posts Welcome to a new series of posts in regards to the proper use of HTML and CSS. I hope to create a series of posts about this fascinating subject that is often overlooked and seen as unimportant by many people, but little do they know that the proper use of HTML or XHTML or CSS of any level is actually mandatory for any website. Now many people are using a CMS, and more often than not these CMS products make improper use of HTML, XHTML and CSS and often just mixes one up with the other. This is just plain wrong and foolish to do and it shows little care about these companies in regards to the most basic elements of web-design. 1.2. What is it not for? This is NOT a series of posts of bash other people or to bash their creations!!!! Let me be very clear about this. In fact, I suggest you take this as a tongue-in-cheek post attempting to correct people. So it is not to bash anyone, it is not to be negative about the looks of websites, it is only about the use of HTML and CSS, nothing more and nothing less. The sites I am using in these posts are actually awesome looking websites of owners who understand what websites should look like. So think of it using the best of the best as an example that even the best have flaws. 1.3. What is it for? This topic is for those who are serious in creating websites and coding it themselves by hand and who require live examples in order to understand the subject at hand. For this reason I will not address the HTML/XHTML and CSS subjects at the same time, I instead will do one at a time. This is for those who, like myself, check their codes using the W3C HTML[1] and W3C CSS[2] validators to ensure that their code implementation is correct and from there on they continue to design their websites. At the same time I hope the owners of the mentioned websites will look at these posts and correct the minor flaws, rendering the posts in question useless. 2. rickcarlino.com 2.1. HTML or XHTML Declaration? If we look at the website of Rick Carlino[3] we see an awesome website that is mainly text based, offering awesome posts! Having said this, I do urge anyone to visit the site. But let's look under the hood and look at the code. I strongly suggest to visit his website and look at the source yourself. This tells us that it is a HTML5 living standard HTML document. Any previous version has a doctype declaration similar to the one in my own source code. With this the browser understands that the website in question should be rendered in the HTML5 standard codes. In the case of my own website the doctype declaration states that any browser should render the page as XHTML 1.0 Strict and within it offers a link to the dtd file on w3.org[4] to recognize and check what is allowed and what not. 2.2. Language of website Not unimportant is the following, now that we know what type of document it is, and this is the language used on a website. Here is the first warning within the W3 HTML validator. Within the HTML tag we should declare the overall language of the website. This, in HTML5, is the proper language declaration and it obsoletes a different line we discover in the Head Elements. This was used in versions prior to HTML5 to tell the browser which language was being used on the website. Since HTML5 this has been obsoleted and therefore it is no longer required. 2.3. Self-closing element tags So here is a tricky one. One of the differences between XHTML and HTML is that in XHTML you close some tags with /> where in HTML > would suffice in some of the tags. The document is declared HTML5 which means that we do not do this: Instead we do this. It is really a minor thing, but it still is a warning in the HTML validator of W3C and with this it is something that should be addressed. Do not see this as the check engine light in the car of Penny. (let's see who gets this :P) In any case, all that ends in /> is no longer valid in HTML5 and therefore these closing methods should be addressed as such. Given that the website is created with a CMS, the code of the CMS should be changed to adapt to HTML5 instead. At the bottom of the page you'll also see something else of interest.