Computer programmin basics lesson

Posts : 783 Poké : 100 Join date : 2013-01-21

Im gonna teach lessons. Feel free to ask questions.

Lesson 1: html

Lets start with the basics.

Vocab:
Html elements

An HTML element is an individual component of an HTML document. HTML documents are composed of a tree of HTML elements and other nodes, such as text nodes. Each element can have attributes specified. Elements can also have content, including other elements and text. HTML elements represent semantics, or meaning. For example, the title element represents the title of the document.

In use example:

<html>
<H1>
Hello
</h1>
</html>

Now lets look at the above. The ones within the greater and less than signs are the html elements. Always start your html code with <html> and end it with </html>.
The elements h1=header one. This will be larger than the normal print. The slash before the html elements means the end. You can practice this on this editor. Put an html code in top, what the outcome is shows on the bottom.

http://htmledit.squarefree.com/

I will give you more instructions in an hour.

Posts : 783 Poké : 100 Join date : 2013-01-21

Ok now im teaching you the next part.

Content:
Html headings(VERY IMPORTANT!)

Now im going to teach you about headings.
Headings are defined with the <h1> to <h6> html elements.
<h1> defines the most important heading. <h6> defines the least important heading.

Example

<h1>This is a heading</h1>
<h2>This is a heading</h2>
<h3>This is a heading</h3>

Use HTML headings for headings only. Don't use headings to make text BIG or bold.

Search engines use your headings to index the structure and content of your web pages.

Since users may skim your pages by its headings, it is important to use headings to show the document structure.

H1 headings should be used as main headings, followed by H2 headings, then the less important H3 headings, and so on.

HTML Lines
The <hr>tag creates a horizontal line in an HTML page.
Just put it between lines and create a horizontal space between lines.

Now very important to know is how to make comments. These are notes for you and others to view. It will not be translated by the computer but left there for others to view.

Here is how a comment is put:


Html tip:

How to View HTML Source
Have you ever seen a Web page and wondered "Hey! How did they do that?"

To find out, right-click in the page and select "View Source" (IE) or "View Page Source" (Firefox), or similar for other browsers. This will open a window containing the HTML code of the page.

We are going to move on, but a quick review:

<html> Defines an HTML document
<body> Defines the document's body
<h1> to <h6> Defines HTML headings
<hr> Defines a horizontal line
<!--> Defines a comment
Remember to put the slash at the end of each except for hr and comment.comment you copy it but leave out the exclamation.

Posts : 783 Poké : 100 Join date : 2013-01-21

Lets start off with us talking about paragraphs and line breaks, in between paragraphs.

Paragraphs follow the <p> element, with </p> at the end.
If you want a line break, you typr in <br> where ever you want the page break.

Posts : 783 Poké : 100 Join date : 2013-01-21

Here is what we are going over. This is a big lesson.

<b> Defines bold text
<em> Defines emphasized text
<i> Defines a part of text in an alternate voice or mood
<small> Defines smaller text
<strong> Defines important text
<sub> Defines subscripted text
<sup> Defines superscripted text
<ins> Defines inserted text
<del> Defines deleted text
HTML "Computer Output" Tags
Tag Description
<code> Defines computer code text
<kbd> Defines keyboard text
<samp> Defines sample computer code
<var> Defines a variable
<pre> Defines preformatted text
HTML Citations, Quotations, and Definition Tags
Tag Description
<abbr> Defines an abbreviation or acronym
<address> Defines contact information for the author/owner of a document
<bdo> Defines the text direction
<blockquote> Defines a section that is quoted from another source
<q> Defines an inline (short) quotation
<cite> Defines the title of a work
<dfn> Defines a definition term

Often <strong> renders as <b>, and <em> renders as <i>.

However, there is a difference in the meaning of these tags:

<b> or <i> defines bold or italic text only.

<strong> or <em> means that you want the text to be rendered in a way that the user understands as "important". Today, all major browsers render strong as bold and em as italics. However, if a browser one day wants to make a text highlighted with the strong feature, it might be cursive for example and not bold!
These are called formatting tags.

Copy and paste this into: http://htmledit.squarefree.com/

Code:: <!DOCTYPE html>
<html>
<body>

<p><b>This text is bold</b></p>
<p><strong>This text is strong</strong></p>
<p><i>This text is italic</i></p>
<p><em>This text is emphasized</em></p>
<p><code>This is computer output</code></p>
<p>This is<sub> subscript</sub> and <sup>superscript</sup></p>

</body>
</html>

» Back to Basics
» Teaching a lesson [F]
» Teaching a Terrible Tailow a lesson,
» Teaching a lesson - Oldschool style [F]