Scribd Logo
Upload

Welcome to Scribd!

  • Introduction To HTML and Planning Your Website

    Uploaded by

    Francis Solis
    10 views23 pages
    The document discusses basic web design principles and introduces HTML. It outlines seven principles of web design: balance, proximity, white space, contrast, focus, unity, and alignment. It then defines HTML as the language for web applications and pages. Several key HTML elements and tags are described such as <DOCTYPE>, <html>, <head>, <title>, <meta>, <body>. It differentiates between container tags, empty tags, and provides examples. Finally, it lists some common HTML tags and new media elements.

    Original Description:

    Original Title

    Introduction to HTML and Planning Your Website

    Copyright

    © © All Rights Reserved

    Available Formats

    PPTX, PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    Report this Document
    The document discusses basic web design principles and introduces HTML. It outlines seven principles of web design: balance, proximity, white space, contrast, focus, unity, and alignment. It then defines HTML as the language for web applications and pages. Several key HTML elements and tags are described such as <DOCTYPE>, <html>, <head>, <title>, <meta>, <body>. It differentiates between container tags, empty tags, and provides examples. Finally, it lists some common HTML tags and new media elements.

    Copyright:

    © All Rights Reserved
    Download as PPTX, PDF, TXT or read online from Scribd
    Flag for inappropriate content
    Download as pptx, pdf, or txt
    10 views23 pages

    Introduction To HTML and Planning Your Website

    Uploaded by

    Francis Solis
    The document discusses basic web design principles and introduces HTML. It outlines seven principles of web design: balance, proximity, white space, contrast, focus, unity, and alignment. It then defines HTML as the language for web applications and pages. Several key HTML elements and tags are described such as <DOCTYPE>, <html>, <head>, <title>, <meta>, <body>. It differentiates between container tags, empty tags, and provides examples. Finally, it lists some common HTML tags and new media elements.

    Copyright:

    © All Rights Reserved
    Download as PPTX, PDF, TXT or read online from Scribd
    Flag for inappropriate content
    Download as pptx, pdf, or txt
    of 23

    ://cdn.lifehack.org/wp-content/uploads/2017/03/23050043/170f1c61e47d72be1e4527a1105c9816.

    jpg
    Basic Web Design
    Principles
    Basic Web Design Principles
    Balance
     This concept has something to do
    with symmetrical and asymmetrical.
    Proximity
    - Is the placement of elements with
    logical relationship close to each
    other.
    White Spaces
    -Are literally blank spaces
    which are placed around web
    page elements .
    Contrast
    -Is a way to differentiate the
    elements of a web page.
    Focus
    -Is an element in the website
    which should get the attention of
    the viewer first.
    Unity
    -Is the sense of arrangement and
    harmony of all elements of the
    website.
    Alignment
    -Is the proper arrangement and positioning o
    the elements of the website.
    Shortcut keys
     Ctrl + A -- Select all contents of the page.
     Ctrl + B -- Bold highlighted selection.
     Ctrl + C -- Copy selected text.
     Ctrl + X -- Cut selected text.
     Ctrl + N -- Open new/blank document.
     Ctrl + O -- Open options.
     Ctrl + P -- Open the print window.
     Ctrl + F -- Open find box.
     Ctrl + I -- Italicize highlighted selection.
     Ctrl + K -- Insert link.
    INTRODUCTION TO
    HTML
    HYPERTEXT MARK-UP
    LANGUAGE
    Itis the official language for a
    web applications and web
    pages.
    What is a Doctype?
    A <!Doctype> is not an HTML Tag but it is a
    document declaration that help the web browser
    to display a webpage correctly

    <!Doctype Html>
    What is Meta?
    Metadata is information about data. The <meta>
    tag provides metadata about the html document
    which is placed in the head part and will not be
    displayed on the page.
    <meta charset=utf-8”/>
    TAGS AND ATTRIBUTES

    Tags
    Are the basic unit or building blocks
    of an HTML file.
    STRUCTURES OF A TAG
    Start tag- it is usually pairs of start and end
    tags.
    Attributes- They are used to provide additional
    information about the tag and go in name-
    value pairs is separated by an equal sign =
    <!Doctype html>
    <html>
    <head>
    <meta charset=”UTF-8”/>
    <title> COMPUTER 8 </title>
    </head>
    <body>
    WELCOME TO HTML <img src=“samplepic.gif>
    </body>
    </html>
    <!Doctype html>
    <html>
    <head>
    <meta charset=”UTF-8”/>
    <title> COMPUTER 8 </title>
    </head>
    <body>
    WELCOME TO HTML <img src=“samplepic.gif”>
    </body>
    </html>
    Content- Everything between the
    start and end tag.
    End Tag- It is used to signify the
    end of the tag and it have a /.
    <!Doctype html>
    <html>
    <head>
    <meta charset=”UTF-8”/>
    <title> COMPUTER 8 </title>
    </head>
    <body>
    WELCOME TO HTML <img src=“samplepic.gif>
    </body>
    </html>
    Container and Empty tags
    There are two types of tags namely; container and
    empty.
    Container tags have the start end tags together with the content.
    Example of container tags:

    <p> </p>
    Empty tags- stand alone and do not require
    end tags.
    <br>
    <hr>
    Html TAGS
     <p> </p> • <dd> </dd>
     <br>
    • <dl> </dl>
     <hr>
    • <dt> </dt>
     <ol>
     <ul> • <td> </td>
     <a> </a> • <th> </th>
     <b> </b> • <tr> </tr>
    New MEDIA ELEMENTS IN HTML

    <AUDIO> </AUDIO>
    <VIDEO> </VIDEO>
    <SOURCE> </SOURCE>
    <EMBED> </EMBED>
    <TRACK> </TRACK>

    You might also like