Like it or hate it, but any business owners who want to make their businesses go digital would need a website. However, since all websites or web pages in browser displays are written in HTML, as a business owner, you would need to know the basic understanding of HTML. This knowledge will help you accomplish basic web page problems by yourself. Therefore, you can pay a web developer or a web designer only when you want to do something bigger or complex with your web. Here are some things that you can start with when you want to understand the HTML basics.
HTML Tags
Tags are the base of all HTML formatting. It usually starts and ends with a bracket whilst the words inside the bracket will tell the browser what the element should do on the webpage. However, a tag needs an opening and a closing tag to complete the element. For instance, when you want to create a paragraph of text, then you will need a <p> tag and a </p> tag. For example, if you want to create a paragraph with the text “I am a paragraph,” the HTML will look like this:
<p>I am a paragraph</p>
Of course, there are lots of different types of tags, but you can opt to learn things that you will need the most.
Formatting Text
Another most common practice of HTML is to add and format text in which you can do it quick and easy with HTML. For example, to make some text bold, you can use the <b> tag or maybe you want to emphasize the text with italics, then you can use the <i> tag.
You can also use the <strong> tag if you want to make it bold for emphasis or you can use the semantic <em> tag if you want to make italics with emphasis.
- Example of sentence: Follow sound business trends, not fashion trends.
- The result will look like this in HTML: Follow sound <strong>business trends<strong>, not <em>fashion trends</em>.
Other tags that you might want to know are the text H1, H2, H3, and many more. H1 is mostly used for the largest and the most important headers, like a page title. H2 and H3 are commonly used for section headers, like in paragraph. More tags, such as H4, H5, H6 are less common, but they are usually used in very long, complex articles or pages with multiple levels of organization.
Add an Image
A web without an image will look boring; therefore, besides placing text, you should also put at least an image. All you need is the file location, usually on your server and then you can insert any image. So, let’s take a look at the example below:
Say, you have an image named image1.jpg, which is saved in your site’s images folder. So, as an example, the location of the image will be at http://yoursite.com/images/image1.jpg. If you want to embed it in a page, there is an HTML code that you can use for that:
The code above will notify the browser to load an image with the img tag. Moreover, inside the image tag, we tell the browser the source using src=”source”. As you can see, all the command is in the <> brackets. So, you can also adjust the size, border, and more.
Link to another Page
To link text, an image, or any other element, you can use the <a> tag which allows for multiple attributes, similar to the img tag. The main thing you need to understand is that you should put </a> with a link attribute before the element you want to link and a closing tag at the end.
You can take a look at the example below:
The original site: http://yoursite.com/sales
The link in the HTML: <a href=http://yoursite.com/sales>Click here to view the sales page</a>.
In the example above, we want to create a sentence that says “Click here to view the sales page”. Once you click the words in the sentence, you will be directed to the sales page. Remember that the period is outside of the closing </a> tag, so it would not be linked. While the href attribute will tell the browser that anything inside the <a> tags should link to that URL.
So, why don’t you try it on your own? You can start from the basic one, as explained before. But, feel free to seek any help from any professional web developers or web designers if you find difficulties. Good luck!