Front-End Development — HTML5
Soon after graduation I was looking for an opportunity to work under great supervision that prepare me for companies and better future.
I searched LINKEDIN & FACEBOOK day and night but I didn’t found any good opportunity for work.
Then I started searching for Courses with Certifications to learn more about Web Technologies.
I found great Internship opportunity at Interns-Pakistan about Front-End Development that was designed very awesome & up-to-dated. I applied for Internship and got selected under Batch #18.
It was really excited moment for me that I got an email for selection and I found some great source of learning. I was just surprised because this internship was free of cost with certification and then journey begun.
What I learnt at Interns-Pakistan?
I started learning HTML5 from very beginning like from an introduction.
HTML5 — Stands for Hypertext Markup Language & it is most widely used language to write web pages. Below is code of starting of HTML5
<head> <title> </title> </head>
Code goes here…
There are six types of heading in HTML5 where <h1> defines the most important heading and <h6> defines the least important heading
<h1> First Heading </h1>
<h2> Second Heading </h2>
<h3> Third Heading </h3>
<h4> Fourth Heading </h4>
<h5> Fifth Heading </h5>
<h6> Sixth Heading </h6>
The <p> tags defines a paragraph. Each element that is in between <p> opening tag and </p> closing tag is paragraph
<p> This is Paragraph </p>
A webpage can contain various links that take you directly to other pages and even specific parts of a given page. These links are known as hyperlinks. A link is specified using HTML tag <a>. This tag is called anchor tag and anything between the opening <a> tag and the closing </a> tag becomes part of the link and a user can click that part to reach to the linked document. For example
<a href="https://Muhammadessa.tk">My Portfolio</a>
Commenting is a way that you can leave comments within your code without affecting the code itself. Commenting is also a convenient way to make code inactive without having to delete it entirely. You can start a comment with <!– and end a comment with –> like this:
<! — Comment goes here… — >
Images can improve the design and the appearance of a web page. The
<img> tag is empty, it contains attributes only, and does not have a closing tag. The first attribute is
src (source) attribute specifies the URL (web address) of the image. For Example:
<img src="url" alt="My Picture">
An unordered list is a collection of related items that have no special order or sequence. This list is created by using HTML <ul> tag. Each item in the list is marked with a bullet, For Example:
If you are required to put your items in a numbered list instead of bulleted, then HTML ordered list will be used. This list is created by using <ol> tag. The numbering starts at one and is incremented by one for each successive ordered list element tagged with <li>. An ordered list starts with the
<ol> tag. Each list item starts with the <li> tag. For Example:
HTML Forms are required, when you want to collect some data from the site visitor. For example, during user registration you would like to collect information such as name, email address, credit card, etc.
A form will take input from the site visitor and then will post it to a back-end application such as CGI, ASP Script or PHP script etc. The back-end application will perform required processing on the passed data based on defined business logic inside the application.
There are various form elements available like text fields, textarea fields, drop-down menus, radio buttons, checkboxes, etc.
<form> tag is used to defines a form that is used to collect user inputs: For Example
<form action = "Script URL" method = "GET|POST">
form elements like input, textarea etc.
Apart from common attributes, following is a list of the most frequently used form attributes:
Action: Backend script ready to process your passed data.
Method: Method to be used to upload data. The most frequently used are GET and POST methods.
Target: Specify the target window or frame where the result of the script will be displayed. It takes values like _blank, _self, _parent etc.
The most important form element is the
<input> element. The
<input> element can be displayed in several ways, depending on the type attribute. For Text type attribute:
<input type=”text” name=”fullname” value=”name”>
For Password type attribute:
<input type=”password” name=”password” value=””>
For Radio Button type attribute:
<input type=”radio” name=”colors”>
If you found this article helpful, Claps for more. Thanks