Adblock breaks this site

Basic HTML Guide (Look here)

Discussion in 'Web Programming' started by Xaltic, Feb 15, 2007.

Thread Tools

Thread Tools

  • Thread ID:
  1. Xaltic

    Xaltic Member
    Banned

    Joined:
    Feb 15, 2007
    Posts:
    70
    Referrals:
    0
    Sythe Gold:
    0
    Basic HTML Guide (Look here)
    Basic Guide to HTML

    An Introduction to HTML.

    For those of you who don't know HTML is a language used by Web pages.
    Web Pages are built using HTML, short for HyperText Markup Language. HTML documents are comprised of text and coding that instruct a Web Browser how to display the data. HTML documents are identified by their .html or .htm file extension. Because any Web Browser can read an HTML document, you do not need a special platform , such as Windows, UNIX, or Mac, to view the information.

    HTML Coding.

    HTML Coding consists of tags. Tags are individual instructions to the browser and are surrounded by brackets, < >. Many tags include an opening tag and a closing tag. When writing tags, you can use upper- or lowercase letters. To make the coding easy to read, most users type it in uppercase to distinguish the coding from regular text data on the page. Tags can also include attributes you can define, such as color values or measurements.


    Part 2

    Creating Your First HTML Page

    Contents:

    • Understanding HTML Document Structure
    • Start an HTML Document
    • Save an HTML Document
    • View an HTML Page
    • Add a Document Declaration
    • Add MetaData
    Understanding HTML Document Structure.

    All HTML documents are built on key elements that define a page's structure. Although every HTML page differs in content and layout, the underlying structure remains the same. Understanding the basic structure of a document can help you understand how to build and improve your own HTML pages.

    HTML Element:

    The <HTML> and </HTML> Tags are the main tags used to identify an HTML document. When a browser encounters these tags, it knows that anything within the two tags is part of an HTML document. With the latest version of HTML and newer versions of Web Browsers, the tags are not always necessary, but adding them is always good form. Older Web browsers expect to see the HTML element tags.

    Document Header

    You can use the document header to add basic information about your page. The document header tags, <HEAD> and </HEAD>, follow the <HTML> opening tag. You can use the document header to include title information, metadata, and base and script elements.

    MetaData

    Metadata is data that describes the material on your page, such as author information, any programs you used to create the page, a description of the page, and keywords for search engines. You can use the Metadata tags to add author and copyright information, too. You can place metadata between your document header tags.

    Title

    You can add a title to your document header to help other identify your page. For example, if you are building a web page for business, your company name is a good page title. Web browsers display the title in the browser window's title bar. You can use the <TITLE> and </TITLE> tags to define a page title. For best results, keep the title brief and to the point.

    Body

    The content of your page, including paragraphs, lists, and images, appears within the body of your HTML document. The body of the document is identified by the <BODY> and </BODY> tags. Anything you place between these tags appears on the document and in the browsers window. The body of the document includes blocks of text, headings, lists, tables, and forms.

    Start an HTML Document

    You can start an HTML document using a text editor or word processing program. You can use the sets of HTML tags to define the basic structure of your page.

    The <HTML>, <HEAD>, and <TITLE> tags are basic to Web pages. The <HEAD> and <TITLE> information doe not appear on the web page itself; however, the text you include between these tags declares the type of document and briefly describes the page. The text you place between these tags appears in the browsers window's title bar.

    Start an HTML Document:
    1. Open the text editor or word processing program you want to use.
    (I recommend WordPad or Notepad)

    2. Type <HTML>
    This tag declares the document is an HTML document.

    3. Press "Enter"

    4. Type <HEAD>
    This tag starts the information descibing the page, including any title text.

    5. Press "Enter"

    6. Type <TITLE>

    7. Type the title text for your page
    Title text describes the contents of the page and appears in the title bar of the Web Browser

    8. Type </TITLE>

    9. Press "Enter"

    10 Type </HEAD>
    This tag completes the document heading information for the page.

    11. Press "Enter"

    Note: You do not need to press "Enter" each time you start a new tag or add a close tag. However, placing tags on their own lines in the code can help you more easily identify your page structure.

    You should have this right now on your word pad:

    Code:
    <HTML>
<HEAD>
<TITLE>Your title here</TITLE>
</HEAD>
    Body Tags

    You can use the body tags, <BODY> and </BODY>, to add content to your page. Page content can include lines of text, paragraphs, bulleted and numbered lists, and more.

    12. Type <BODY>
    This tag starts the actual content of your webpage.


    13. Press "Enter"

    14. Type the body text you want to appear on the page. Body text is the content of your page, including lines of text, paragraphs, lists, and more.
    For practice, consider typing a simple paragraph for the body text.

    15. Press "Enter"

    16. Type </BODY>
    This tag closes the body portion of the page

    17. Press "Enter"

    18. Type </HTML>
    This tag closes the HTML declaration. You can now save and view your page in a Web Browser.

    Note: To save a file as a .html document do the following:
    Go to Save as. Find save as type (Bottom) and go to All Files and make your file name but make sure the ending is .html.

    You should have this now:
    Code:
    <HTML>
<HEAD>
<TITLE>Your title here</TITLE>
</HEAD>
<BODY>
This is a very boring paragraph where I'm randomly talking. I like pickles do you? A pickle is a cucumber, it sits in vinegar  until it turns sour and a deep green color. Finally when the pickle is done to perfection it is bottled in one of Chef Xaltics pickle jars.
</BODY>
</HTML>
    To view an HTML Page go to your Web browser, Then click file. Then click open. The dialog box then appears, Click browse. Go to your file you just saved. Click open. Click ok.


    A few things to know:

    • To create a new paragraph type: <p> Your paragraph </p>
    • To add a Line Break type: <br> Ladeda here
    • To add Preformatted Text type: <PRE> Preformatted text here </PRE>
    • To add a heading type: <H?> Heading here </H> *Replace ? with the heading level number you want to assign.
    • To add block quotes type: <BLOCKQUOTE> Quote </BLOCKQUOTE>
    • To insert a comment type: <!-- Yahoo -->
    • To Create a numbered list type: <OL>. Type <Li> for new list item then type </OL>
    • To create a bulleted list type: <UL> and type <LI> for every new item. Then type </UL>
    • To Bold your text type: <B> Text you want bolded </B>
    • To Italicize your text type: <I>Text you want Italicized</I>
    • To Underline your text type: <U> Text you want underlined </U>
    • To Change Font size type: <FONE SIZE="?"> Big text? Or maybe small?</FONT> *Replace ? with size.
    • To change text color type: <FONT COLOR="?"> YAY COLORED TEXT!! </FONT> * Change ? the the basic colors. example: red, blue, green purple etc. Or fill it in with the code for the color (Hex color)
    • To add a horizontal line type: <HR>

    I will continue to add to this Guide.

    Rate me pl0x?
    */10


    Sticky pl0x?

    Xaltic.



    ​

    ​
     
    Xaltic, Feb 15, 2007
    #1
  2. 0wnedwithgaxe

    0wnedwithgaxe Apprentice

    Joined:
    Jul 16, 2006
    Posts:
    919
    Referrals:
    0
    Sythe Gold:
    0
    Basic HTML Guide (Look here)
    Nice guide 9/10, maybe I'll start to learn HTML in the future.
     
    0wnedwithgaxe, Feb 15, 2007
    #2
  3. Xaltic

    Xaltic Member
    Banned

    Joined:
    Feb 15, 2007
    Posts:
    70
    Referrals:
    0
    Sythe Gold:
    0
    Basic HTML Guide (Look here)
    Thanks, And also, as a side note, Please post why you reduced/added points! Thanks.

    KEEP THE REVIEWS COMING IN PLEASE :)
     
    Xaltic, Feb 15, 2007
    #3
  4. cp

    cp ａｎ ｃａｔ
    Banned

    Joined:
    Jan 30, 2007
    Posts:
    3,278
    Referrals:
    6
    Sythe Gold:
    0
    Basic HTML Guide (Look here)
    7.813/10

    Not everything is detailed and described as the others.

    You should also have included some examples in the extra codes section.

    Nice guide though.
     
    cp, Feb 16, 2007
    #4
  5. Xaltic

    Xaltic Member
    Banned

    Joined:
    Feb 15, 2007
    Posts:
    70
    Referrals:
    0
    Sythe Gold:
    0
    Basic HTML Guide (Look here)
    Thanks for Reviewing.

    I'll try to update and keep everything as descriptive as possible. I'm making major update soon. Ill add examples too.

    Thanks for feedback.

    MORE REVIEWS PLEASE?
     
    Xaltic, Feb 16, 2007
    #5
  6. free_bullets

    free_bullets Active Member
    Banned

    Joined:
    May 25, 2005
    Posts:
    243
    Referrals:
    0
    Sythe Gold:
    0
    Basic HTML Guide (Look here)
    Isn't easier to use FrontPage? :p
     
    free_bullets, Feb 16, 2007
    #6
  7. Xaltic

    Xaltic Member
    Banned

    Joined:
    Feb 15, 2007
    Posts:
    70
    Referrals:
    0
    Sythe Gold:
    0
    Basic HTML Guide (Look here)
    Yes... But frontpage is an HTML editor. It just does the HTML for you.
     
    Xaltic, Feb 17, 2007
    #7
  8. trio

    trio Active Member
    Banned

    Joined:
    Jan 21, 2007
    Posts:
    223
    Referrals:
    0
    Sythe Gold:
    0
    Basic HTML Guide (Look here)
    pretty good 8/10
     
    trio, Mar 24, 2007
    #8
  9. hockeyman

    hockeyman Guest

    Referrals:
    0
    Basic HTML Guide (Look here)
    10/10 lol now i know html woot :)
     
    hockeyman, Mar 25, 2007
    #9
  10. zackcraig

    zackcraig Guest

    Referrals:
    0
    Basic HTML Guide (Look here)
    zackcraig, Mar 26, 2007
    #10
  11. shad0w~

    shad0w~ Guest

    Referrals:
    0
    Basic HTML Guide (Look here)
    9/10 im into html for a while now im learning about it.
     
    shad0w~, May 6, 2007
    #11
< Zack's Free InvisonBoard Coding | what programing should i learn 1st. >


 
 
Adblock breaks this site