Each and every language has a set of guidelines and policies that are required to be followed while working on it. HTML is no indifferent to this procedure. Developers working on this language have to be really careful with the policies as even the smallest mistake might get spotted and termed as HTML errors.
Avoiding them is a must for a robust solution. There are some common mistakes that are usually committed by developers either due to ignorance or due to haste. Below are listed 10 such common mistakes that generally occur, together with their solutions. The list will help bail you out of the scenario and make coding easier for you.
1. Improper Nesting of HTML Tags
A proper and synchronized nesting of HTML tags is of utmost importance for decent functioning of the code. Once a tag is opened, the order of its closing has to be in the reverse order, as to how it was opened. Novice developers tend to bypass this practical scenario and give these checks a miss. This can lead to situations where validation errors can occur and also the desired and proper style might not be adhered to. So, before moving ahead, check the proper syntax.
<div><p><a>This is my BPTH text</p></div></a>
<div><p><a>This is my BPTH text</a></p></div>
2. Wrong Use of Form Tags
It is sometimes confusing while working with forms and table elements. Many developers have the tendency to start with the table property first. This is due to the utter confusion as to which HTML tag to be used first. For them, underlined is the correct procedure.
3. Discordant Use of Lists
If you want to display the items on the web page in a more flexible fashion, then proper use of OL and UL tags should always be made. They follow a synchronized pattern of information display, which can be very beneficial. Avoiding line-breaks in the code will also be beneficial as search engines recognize list tags.
4. Exclusion of the ALT Attribute
The alt attribute is generally used in HTML documents to specify the alternative text for an image. The attribute helps search engines and people who use screen readers or have low-speed connections understand the purpose of an image. Using the alt attribute for keyword stuffing must be avoided as it not only affects your user’s experience but also your search engine rankings.
5. Improper Use of Codes for Bold and Italics
Codes for bold and italics in a syntax are termed as presentation tags, where <b> is used for bold and <i> is used for italics, usually. For styling with CSS, it would be much better to use different font styles. There are tags such as <strong> and <em> that can be used to lay stress at a proper place. The functions are similar to those of the previous mentioned ones. The only advantage: it makes the entire syntax neat and clean
6. Incorporation of Block Elements in the Inline Elements
Those familiar with using HTML know the fact that the elements of this language are displayed in block or in inline format by default. The block elements like divs and paragraphs contribute in making the structure of the document. The inline elements like, anchor and span tags whereas, are placed in such blocks. Thus, the inline elements should be placed within the blocks and not anywhere you please.
7. Making Use of Inline Styling
Inline styling is not considered to be good, as both CSS and HTML are about structuring and styling of documents, in a separate fashion. Thus, it will be improper to make use of the styling attributes in the HTML document directly. To make sure that this happens, it is advised to incorporate the styles within the style sheet.
8. Inclusion and Exclusion of the Borders
The border attribute is basically present to lend an extra presentation effect. Thereby, it must be altered with CSS, without bothering for the fact that it might be interrupting the default border.
<img src=”smiley.gif” alt=”” border=”0″ />
Correct way is by defining it via style sheets.
9. Incorporating Unnecessary Line Breaks
To give a line break in the paragraph and start the next sentence from the next line the
tag must be used at least once in a single line. A common tendency is to insert line breaks in between elements, which is not the proper way to carry out things. Use it wherever necessary and for moving to the next line.
This is my first paragraph
This will be my test description
<p>This is my first paragraph</p>
<p>This will be my test description</p>
10. Failing to Incorporate Header Tags
Header tags are basically used to spread a document and make sections in it together with the headings. and tags are mainly used for this purpose and there might be a requirement of placing the header at the right of the page. Thus it would be better to use the tags in the 1-6 order.
<strong>This is my BPTH Heading</strong><p>This is my abc description.</p>
<h1>This is my BPTH Heading</h1><p>This is my abc description.</p>
Making mistakes in the HTML and CSS file coding is a common scenario either due to carelessness or lack of experience. As a developer, it is very important to render a clean and neat code as it not only saves your time, but also hones your skills in completing a code easily and in a better way. The above-mentioned mistakes should help you out in managing your code.