CODING HUB

Thursday, November 26, 2020

Structure of HTML code

Here we will learn about the basic syntax of HTML code. So the basic syntax of HTML code is...

<!DOCTYPE HTML>

<html>

<head>

</head>

<body>

<h1> This is heading.</h1>

<p>Hello, How are you?</p>

</body>

</html>

Here, <html>, <p>, <head> etc are tags. Tags are simple elements that are enclosed in angled brackets. Each element has opening and closing tags and content in between these two tags. i.e.

<element-name> ...................Content....................... </element-name>

There are also some HTML elements that do not have any closing tags. These elements are called void elements. The only type of data that void elements are allowed to have are attributes. For example <br />, <hr /> , <col>, <img> etc.

In syntax DOCTYPE helps the browser to understand the version of HTML. DOCTYPE declarations are not HTML tags. <html> tag open the page. That means there should not be any tag used after closing html tag. <head> opens head section, which usually does not appear in main browser window but it contain page title name, information about HTML document, called meta data. It can import some styling sheets and scripts and in head tag you can also add favicons, icons.

<title> contain title of your HTML document that you want to appear at top. It does not show title on browser main window but on title bar. <body> have all content that a user can see or access. You can use different tags, style attributes in this tag. This content is visible on browser's main window.

Introduction to HTML

Before starting HTML course, I feel it's quite necessary to discuss some questions, that comes in mind and they are also important for us, that include why do we study HTML? Why HTML is important? What we can get from it? Why should we learn HTML? Is it difficult to learn HTML? Where can we code it? And many other questions like that.

HTML stands for "Hypertext markup language". It is not a programming language because there is no logic used in it's code. HTML use markup system composed of elements which represent specific content. Markup means by using HTML you can specify, declare what is presented to viewer and how it is represented. Visual representations are defined by cascading style sheet(CSS) which we will learn afterward, InshaAllah. But HTML also include some styling attributes like font, font-weight, color and many other.

HTML code comprises of tags. Each tag has it's own meaning and purpose. Tags are predefined that provide semantic meanings and machine readability to content in page.

<p> is a simple tag that is commonly used in HTML code. Here "p" is called element. Every text enclosed in angled brackets is called element and as whole it is a tag.

Understanding HTML can help you to work with web, you can create attractive responsive sites. However website editors use blogging tools, java script, CSS and other tools to create better content but you can design simple site using HTML and CSS. In coming blogs, you will learn about creating web pages, adding tags, list, tables images, videos and many other things in your web page. We can write HTML code in a simple notepad, you can also use different software like Notepad++, Visual studio code, Komodo Edit, Cofeecup HTML editor etc. Open your saved file in any browser.

Monday, November 9, 2020

HTML heading

HTML headings are the subtitles or titles that you want to display on your webpage. The use of headings and subheadings in any document often reflects a hierarchy of information. There are 6 heading tags which we generally use in our webpage. Obviously each tag has also closing tag. Each heading tag has different font size, font weight and things like that. There is a paragraph tag "p" which we use to write any paragraph or something like that. Paragraph will always starts from a new line and browser will automatically add some margin before and after paragraph.

Now take a look how we will write it in code. Basically HTML code is made up of some characters in the angled brackets, that are known are HTML elements. Each HTML element consist of closing and opening tags. Each HTML element has some specific information for browser between opening and closing tags. Hope you will get used to them.

Above code output:

Hope so you can understand this code. Best of luck.

Sunday, November 8, 2020

HTML

HTML is hyper text markup language. It is used to design documents displayed in web browser. It is assisted with cascading style sheets and scripting languages like JavaScript.

You can write html code in any notepad, notepad++ is preferred as I use it. But yeah there is many other editor type things in market and you can test them as well. So what you have to do, open notepad and write some lines of code, then save that file with extension .html in any folder. To see result, output, open your file in google or any other browser.

So here is basic syntax:

<!DOCTYPE HTML>

<html>

</header>

<body>

</body>

</html>

Html, header, title and other are tags. In HTML we are going to use lot of tags. No need to memorize all of tags because you get used to all of them by just practicing. Basic syntax given above should be correct. So enough for now. Take care :)