• Problems

    This line enable URL Rewriting . It must be enabled via the RewriteEngine directive! and if your .htaccess file is going to use rewrite rules, you should always include this line. Otherwise, you can’t be sure if its enabled or not. The string “on” is case insensitive.


In this tutorial we are going to learn the basis of HTML .This guide is for completely for dummies  who had not listen about HTML

What is HTML?

To publish information for global distribution, one needs a universally understood language, a kind of publishing mother tongue that all computers may potentially understand. The publishing language used by the World Wide Web is HTML (from HyperText Markup Language). HTML gives authors the means to: Publish online documents with headings, text, tables, lists, photos, etc. Retrieve online information via hypertext links, at the click of a button. Design forms for conducting transactions with remote services, for use in searching for information, making reservations, ordering products, etc. Include spread-sheets, video clips, sound clips, and other applications directly in their documents.

What Is an HTML Document?

If you read the above section, you may have guessed that HTML—which stands for HyperText Markup Language—is just a bunch of text saved as a document type that your browser identifies as using HTML. If you see an image on a web page, it's simply referenced in the text of an HTML document and not physically included as part of the file. All an HTML document really does is provide a set of text-based instructions that a web browser can interpret. It use tags to tell the web browser to do things like display text, add image, and more. Going further more, HTML can be styled using CSS—which stands for cascading stylesheets
All HTML documents must start with a type declaration: <!DOCTYPE html>.
The HTML document itself begins with <html> and ends with </html>.
The visible part of the HTML document is between <body> and </body>.

What You Will Need

  • A plain text editor or any kind of text editor
  • Web browser
  • A desire to learn some html basic code 
Now you will see, you really don't need much to  learn HTML

Get Your Text Editor

In order to write HTML, you need a plain text editor If you want something free, you've got a lot of great options, including Notepad++ (Windows), Kod (Mac), or Sublime Text for either Windows and Mac.
Note: For the purposes of this tutorial, you should save all the files you create in your text editor with .html as your file extension—for example, "helloworld.html". You can edit a .html document in your plain-text editor of choice, but you can also view it in your browser. What you see when you open it in your browser will be very different than what you see when you open it in your text editor.

What Are Tags?

HTML includes element types that represent paragraphs, hypertext links, lists, tables, images, etc. Each element type declaration generally describes three parts: a start tag, content, and an end tag.Tags are used in HTML to specify certain elements on the page so the web browser knows how to render them. Here's what a set of tags look like: The element’s name appears in the start tag (written <element-name>) and the end tag (written </element-name>);
 Note:  note the slash before the element name in the end tag.
For example, the start and end tags of the UL element type delimit the items in a list: <UL> <LI><P> ...list item 1... <LI><P> ...list item 2... </UL>

<tag>This, and only this part of the document is affected.</tag>
Above  shows a sentence that’s encapsulated by two tags, a begin- and end tag. Everything in between is affected.


 Some HTML element types allow authors to omit end tags (e.g., the P and LI element types).
Note: for loner tags, <tag>, <tag />, and <tag></tag> all mean the same thing.
A few element types also allow the start tags to be omitted; for example, HEAD and BODY. The HTML DTD indicates for each element type whether the start tag and end tag are required. Some HTML element types have no content. For example, the line break element BR has no content; its only role is to terminate a line of text. Such empty elements never have end tags.
We’ll review some common tags in the next few steps.

Step One – HTML, HEAD & BODY -Structure Your Document
  • <HTML></HTML> A web page’s root element. The big daddy. The ancestor of all elements. The element that wraps its arms around all other elements.simply indicates the use of HTML code. They’ll show in every webpage, usually at start and end, and embrace practically all the other code, including the next two.
  • <HEAD></HEAD> Where metadata — information about the document — is placed. It should be the first element inside an <html> element.A <title> element is required within the head element. meta, style, base, link, and script can also be used.<head> is required and it should be used just once. It should start immediately after the opening <html>tag and end directly before the opening <body> tag.
  • <BODY></BODY>-The main content area of an HTML document. You must use this element and it should be used just once. It should start immediately after the closing  <head> tag and end directly before the closing <HTML>  tag.


Step Two –  <P>, <BR> & <FONT> Change First Look
  We’ve already said HTML was a markup language. This means as much as making text feel pretty. Remember, HTML dates back to when the web was a very text-y experience. Besides, the internet would’ve been far too slow to support YouTube. Here are some of the most common pretty-making tags.

HTML Paragraphs

HTML paragraphs are defined with the <p> tag:
Example
<p>This is a paragraph.</p>
<p>This is another paragraph.</p>

HTML Headings

HTML headings are defined with the <h1> to <h6> tags:
Example
<h1>This is a heading</h1>
<h2>This is a heading</h2>
<h3>This is a heading</h3>

  • <b></b> makes your text look bold
  • <i></i> makes you write in cursive
  • <u></u> underlines what you just wrote
  • <br> hits the break, making you continue on a new line

Step Three – Embedded Images with <IMG>
 HTML images are defined with the <img> tag. The source file (src), alternative text (alt), and size (width and height) are provided as attributes:
Example
<img src="link.jpg" alt="W3Schools.com" width="104" height="142">

Step Five – Links
 HTML links are defined with the <a> tag:
Example
<a href="http://www.makeownwebsitecode.blogspot.com.com">This is a link</a>

The link's destination is specified in the href attribute.
Attributes are used to provide additional information about HTML elements.

The above tags are the HTML tags. Your entire HTML document goes inside of those tags. All tags start with a less than symbol and end with a greater than symbol. They're called tags, in part, because those symbols make them look like tags. The starting tag simply has the term HTML inside of it, but you'll notice that the ending tag has a / before the term HTML. The / is what designates it is the closing tag. This tag tells your web browser that the first HTML tag is the start of the HTML document and the second /HTML closing tag is the end. Most tags look like this. For example, if you want to make text bold you might see this:

For a quick reference of some of the basic tag elements you can use in your document, this cheatsheet is a good place to start.

What Are Attributes?

 Attributes Elements may have associated properties, called attributes, which may have values (by default, or set by authors or scripts). Attribute/value pairs appear before the final ">" of an element’s start tag. Any number of (legal) attribute value pairs, separated by spaces, may appear in an element’s start tag. They may appear in any order.
 In this example, the id attribute is set for an H1 element: <H1 id="section1"> This is an identified heading thanks to the id attribute </H1>

The Structure of a Basic HTML Document

Now that you've got basic tag structure down, let's take a look at a basic HTML document's structure. You should know this is a very basic look and doesn't include absolutely everything you'll probably find in a fully developed HTML document, but it works just fine and keeps things nice and simple. Here's the very basic structure:
.
<!DOCTYPE html>
<html>
<title Understanding and Writing HTML- How to Make a  own  Web Site for free : The Complete Dummies Guide
</title>
<body>

<h1>This is a heading</h1>
<p>This is a paragraph.</p>

</body>
</html>
 
You'll notice that inside the HTML tags are HEAD and BODY tags. The HEAD tag encapsulates information that's not necessarily going to directly display on the page, such as the page title (which shows up as the window or tab title on your web browser), CSS styles, and other metadata. The BODY tag encapsulates information that will display on the page—your text, images, and rich media. The resulting HTML document opened in your web browser (just double-click the saved file or drag it into a browser window) will look like this:

This is a heading

This is a paragraph.


No comments:

Post a Comment