Career skills to jumpstart your future.

LightSpeed HTML Coding for Beginners | Part-1

Handcrafted by On
Learn HTML Coding Easily Within No Time

HTML Coding for Beginners

This blog post focuses on HTML Coding for Beginners.




What Is HTML?

 HTML stands for Hypertext Markup Language. HTML as a language is used to create web pages. Web pages are used to generate web pages. The latest version of it is HTML 5. HTML is the most straightforward coding language by far. All of the web pages on the Internet are created using HTML(just like this one). HTML was invented as a language in 1990 by Tim Berners Lee when he instituted the World Wide Web(WWW). 

Where to create HTML documents?

Web pages are created using HTML. Now, there are two types of HTML editors- Text Editors and What You See Is What You Get(WYSIWYG) Editors. Text Editors like Notepad and Wordpad require knowledge of HTML Coding. WYSIWYG Editors do not require knowledge of HTML Coding and are much easier and faster to use and create web pages. Adobe Dreamweaver and Microsoft FrontPage are two WYSIWYG Editors. It is recommended that you use Notepad ++ for Coding. (Personal Tip)

Before You Get Started 

Get used to few terms. These are just the basic terms and elements that will make up your HTML code. 

1. Home Page- The first page of a Web site.
2. HTML - A computer language used to create documents (Web pages) for display on the World Wide Web. 
3. HTML Elements- Building Blocks of HTML Documents. An HTML element consists of opening and closing tags, and the content between them.
4. HTML Tags- Identifiers of HTML Elements. They always begin with a less than sign ( < ) and end with a greater than sign ( > ).
5. Container Elements - HTML Elements that include both ON and OFF tags. (Referred later)
6. Empty Elements- HTML Elements that do not require an OFF label.
7. HTML Attributes - Extra bits of information that appear inside the opening tag of an element.
8. HEAD - Part of the HTML document containing information about the web page
9. BODY- Part of the HTML document containing everything displayed on the web page, including text, images, links, and graphics, etc.

Things to Remember


All elements have an ON tag. 
ON tags look like this- <head>
OFF tags are just the same as the ON tag, but they contain a / after the angle bracket. So, if the ON tag is <head>, OFF tag is </head>.

A HTML document always starts with a <html> tag and ends with a </html> tag.
The title of the document is in the HEAD element. 
Everything displayed on the web page is in the BODY element.
HTML is one of the only computer languages that do not give errors. Simply, the desired output won't be displayed on the web page.

PRO-TIP

Whenever you code, set the font size to a readable size. Don't waste time in formatting the HTML Document. It won't affect the web page(the code will). 


Let Us Get Started

  • First, open Notepad.
As we know, an HTML document always begins with a <html> tag.
  • Type <html>
Next, you need to name the web page. So, in the HEAD element, in the TITLE tag, you will call the web page.
  • Type 
<head> 
<title>
AChhaya (you can give the desired name)
</title>
</head>

Next, you will insert the desired text you want to include in the web page in the BODY element. We have entered any random text. 
  • Type
<head> 
<title>
AChhaya (you can give the desired name)
</title>
</head>
<body>
AChhaya is the no.1 blog you will ever see. Subscribe via email to receive alerts.
</body>

Now, you want to shift this text to the centre. You will use the < center> container tag for this.

  • Type before the text you want to center. In this case,
<head> 
<title>
AChhaya (you can give the desired name)
</title>
</head>
<body>
<center>AChhaya is the no.1 blog you will ever see. Subscribe via email to receive alerts.</center>
</body>

  • Done, now you have the desired text on your web page. 
  • An HTML document always ends with a </html> tag.
  • Type-
<head> 
<title>
AChhaya (you can give the desired name)
</title>
</head>
<body>
<center>AChhaya is the no.1 blog you will ever see. Subscribe via email to receive alerts.</center>
</body>
</html>

Done!

Click here for LightSpeed HTML Coding for Beginners Part-2. 

Now, you will check the output in a web browser. Click here for the tutorial on How To View An HTML document in a web browser.

Hi! I Love AI, DL and ML

Comments

Post a Comment

Popular posts from this blog

LightSpeed Basic Animation for Beginners in Flash 8 | Part-2

Handcrafted by On
Image
Basics in Animation for Beginners in Flash 8 Now that you know about the basics of Flash 8 and the two basic types of tweening, get to know about the few basic tools that you will need to make a basic Flash 8 movie. If you're new around here, check out the Part-1 of the Basics in Animation for Beginners in Flash 8 .    Check out our blog LightSpeedAC for more amazing content.  Before we get started, even if you're not new around here, I would recommend you to revisit the Part-1 to revise the basic constituents of Flash 8.  Let Us Get Started This blog post will focus on the main basic tools that you need to use to make a simple, yet good Flash movie/animation.  1. Pen Tool - The Pen Tool is used to draw precise paths, like straight lines and smooth curves. You can draw straight lines or curves with this tool, and later adjust the angle and length of straight-line segments and the slope of curves.  The steps to use the Pen Tool are:...
Read more

LightSpeed Intro to ConvNets

Handcrafted by On
Image
LightSpeed intro to ConvNets ________________________________________________ Unless you're experienced or have read the LightSpeed intro to DL, please see here before reading this. --------------------------------------------------------------------------------- In this post, you'll learn about- What are Convolutions? Why Convolutions work great (optional) Keras and TensorFlow (compulsory) How to make a Neural Network that can classify pictures depending on objects! What are ConvNets? Now, what are  ConvNets ? They are Neural Networks having Convolutions. Okay, so what are Convolution s ?  Convolutions, informally, are mathematical functions. Now, to convolve the above matrices, we take the second smaller matrix, then we imprint it on the first possible 2 by 2 chunk of the other as shown below. So, this will be the first value in the output matrix- = (4*1) + (2*0) + (0*0) + (3*1) = 7 Similarly, you may be able to calculate that the next ...
Read more

LightSpeed Basic Animation for Beginners in Flash 8 | Part-1

Handcrafted by On
Image
Basics of Animation in Flash 8 for Beginners  This blog will focus on the introduction to Flash 8 for Beginners, uses of Flash 8 in this ever-growing technological world. This blog will also include basic things that you need to know as a beginner in Flash 8 and the basic types of animations in Flash 8. If you're reading this blog post, you must have Flash 8 installed. You can get your 30-day free trial on Adobe's website and need to later buy it. You will be given a serial code. What is Flash 8? Macromedia Flash is a program that is used in creating interactive, and animated media such as motion graphics, videos, presentations and websites. You can control an object’s actions and behaviors using the Behavior panel and the Timeline. For more advanced control you can use Actionscript, Flash's programming language that is very similar to Javascript. Flash 8 or Macromedia Flash 8 was developed by Macromedia. Macromedia was acquired by Adobe in December of 2005. Sinc...
Read more

A honest review of the Data and Deployment Specialization

Handcrafted by On
Image
  What is the TensorFlow: Data & Deployment Specialization? The TensorFlow: Data and Deployment specialization is deeplearning.ai' s new group of courses and is intended to teach you how to practically use your DL skills to make practical applications. It is co-taught by Andrew Ng and Laurence Moroney, both seasoned veterans in AI and DL. I will give a detailed review of the first course below. I am trying to keep the content coming while doing the course myself! 1. Browser-Based models with TensorFlow.jS This course is intended to teach you how to set up a browser-based model using TensorFlow's browser equivalent- TfjS.  It shows the necessary JavaScript required for training models. It must be noted that tfjs is not direct TensorFlow! It's a different version, and they have few differences, which are correctly taught in the course. If you are used to Andrew Ng lectures, this isn't like that. The course assumes that you know Deep Learning, so most talks...
Read more

LightSpeed intro to Deep Learning

Handcrafted by On
Image
LightSpeed intro to DL In this post, you'll learn about- Basic necessities of DL theory Keras and TensorFlow (optional) How to make a Neural Network that can identify digits in a picture! Basic Necessities of Deep Learning Theory Now, what is Deep Learning ? It is, plainly the art of training Neural Networks . Okay, so what are Neural Networks? They are just another type of Machine Learning model, which apparently work like the brain. And now, two questions remain- 'What do they do?' and 'How do they work?' The answer to the first question is that they first predict some output for a problem using layers , with randomly initialized parameters. Then, after seeing how far they are from the actual truth, they change their settings to obtain lesser loss or distance from the truth.  Now for the second question, the answer is much less mystified and more mathematical. It computes a non-linear function (usually a ReLU of the (input if it's the fir...
Read more