• HTML

    Hyper Text Markup Language Definition:

    It provides a means to describe the structure of text-based information in a document — by denoting certain text as links, headings, paragraphs, lists, and so on — and to supplement that text with interactive forms, embedded images, and other objects. HTML is written in the form of tags, surrounded by angle brackets. HTML can also describe, to some degree, the appearance of a document.

    Files and URLs containing HTML often have a  .html or  .htm filename extension. You will also see extensions such as .shtml, .css, .js, or .php these are all other coding options that advanced designers have available.

    HTML markup

    HTML markup consists of several key components, including elements (and their attributes), character-based data types, and character references and entity references. Another important component is the document type declaration.

    The Hello world program, a common computer program employed for comparing programming languages, scripting languages, and markup languages is made of 10 lines of code in HTML, albeit line breaks are optional:

    <!Doctype html>
    <html>
    <head>
    <title>Hello HTML</title>
    </head>
    <body>
    Hello World!
    </body>
    </html> 

    Elements

    Elements are the basic structure for HTML markup. Elements have two basic properties: attributes and content. Each attribute and each element's content has certain restrictions that must be followed for an HTML document to be considered valid. An element usually has a start tag <element-name> and an end tag </element-name>, ie: to start centering text <center> and then to end the centering </center>

    The element's attributes are contained in the start tag and content is located between the tags <element-name attribute="value">Content</element-name>, ie: <font color="#009900">This is my green font</font>. In this example the #009900 represents the HTML color code for a shade of green. It is safest to use a color code to guarantee the browser will recognize the color you desire, however, it is sometimes possible to put in the actual name of a color instead of the code.

    Some elements, such as <br>, a single return <p>, a double return, or <hr>, a horizontal line across the page, do not have any content and do not need a closing tag.

    Example of a forced line breaks using the <br> command:
    Baa baa black sheep, have you any wool?
    Yes sir, yes sir, three bags full!
    One for the master, one for the dame,
    And one for the little boy who lives
    down the lane.

    Example of a forced paragraph/double space break using the <p> command:
    Children's Nursery Rhyme and

    Poem from Love-Poems
     
     

    Example of <hr> command.



    Example of <hr color="purple"> command with color changed.

    Structural markup

    Structural markup describes the purpose of text. For example, <h2>Golf</h2> establishes:

    Golf

    as a second-level heading, which would be rendered in a browser in a manner similar to the "HTML markup" title at the start of this section. Structural markup does not denote any specific rendering, but most Web browsers have standardized on how elements should be formatted. Text may be further styled with Cascading Style Sheets(CSS). We will be working with CSS code during second semester.

    Presentational markup

    Presentation markup describes the appearance of the text, regardless of its function. For example <strong>strong</strong> indicates that visual output devices should render "strong" in bold text or <em>emphasis</em> renders "emphasis" text as italic. Commands such as these will not affect devices that read the text aloud.

    Hypertext markup

    HTML allows links from parts of the document to other documents. The code requires the use of an anchor element to create a hyperlink in the flow of text:<a>Wikipedia</a>. However, the href attribute must also be set to a valid URL so for example the HTML code, <a href="http://en.wikipedia.org">Wikipedia</a>, will render the word "Wikipedia" as a hyperlink.To link on an image, the anchor tag use the following syntax: <a href="url"><img src="image.gif"></a>