Scribd Logo
Upload

Welcome to Scribd!

  • Build Website Presentation

    Uploaded by

    g_group
    73 views12 pages
    how to make a webite

    Original Title

    Build.website.presentation

    Copyright

    © © All Rights Reserved

    Available Formats

    PPT, PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    Report this Document
    how to make a webite

    Copyright:

    © All Rights Reserved
    Download as PPT, PDF, TXT or read online from Scribd
    Flag for inappropriate content
    73 views12 pages

    Build Website Presentation

    Uploaded by

    g_group
    how to make a webite

    Copyright:

    © All Rights Reserved
    Download as PPT, PDF, TXT or read online from Scribd
    Flag for inappropriate content
    of 12

    Powerpoint Templates

    Page 1
    Powerpoint Templates
    Lets Build a Website
    by Sybil Prince Nelson

    Powerpoint Templates
    Page 2
    Basics
    What is HTML?
    HTML is the language used to create web pages. It tells your browser (like
    Internet Explorer or Firefox) what to display on a web page.
    What does HTML stand for?
    HTML stands for HyperText Markup Language.
    HypertextText with links to other pages. Can contain images and other things.
    Basically, a web page.Markup LanguageThe set of instructions that
    describe how text should be displayed. For HTML, these instructions are
    called tags.HTML = HyperText Markup Language = The tags that tell
    your browser what to display on a web page.
    How Does HTML Work?
    In an HTML tutorial for beginners it's all about the tags. Browsers, like
    Internet Explorer or Firefox, are used to display web pages. Tags tell your
    browser what to display on a web page. This is the HTML tag:
    <html>
    It's the main tag. It says, "Everthing after this is a web page." There are
    beginning and ending tags. They come in pairs:
    <html> </html>
    Your browser understands this. Your browser doesn't display tags. It displays
    only what is between the tags.

    Powerpoint Templates
    Page 3
    A Basic Webpage
    <!DOCTYPE html PUBLIC "-//W3C//DTD
    XHTML 1.1//EN"
    "http://www.w3.org/TR/xhtml11/DTD/xhtml1
    1.dtd">
    <html>
    <body>

    <h1>This is a heading</h1>

    <p>This is the paragraph text. This is more
    paragraph text. This is more paragraph text.
    </p>

    </body>
    </html>
    Powerpoint Templates
    Page 4
    Lets get a little fancier
    HTML Elements
    Most HTML elements have these four parts:
    A starting tag
    Example: <p>
    An ending tag
    Example: </p>
    The content between the starting and ending tags
    Example: "Once upon a time a girl with etc."
    Attributes (more about attributes in the next section)
    Example: style="background-color:yellow"
    Here's an example of an HTML element:
    <p style="background-color:yellow">Once upon a time a girl
    with beautiful long golden hair etc.</p>
    By the way there are a few elements that only have one
    tag. For example:
    The <br /> element causes the browser to skip to the next
    line. It's the "line break" tag. There are no contents or ending
    tag for these types of elements.

    Powerpoint Templates
    Page 5
    Still getting fancy
    HTML Attributes
    A HTML element can have attributes. An attribute gives
    more information about the contents of an element to the
    browser. Think of an attribute as quality or characteristic
    of the element. The attribute of an element is located in
    the starting tag.

    <p style="background-color:yellow">blah blah blah.</p>

    This particular style attribute tells the browser to make the
    background color of that paragraph yellow.

    If you know your HTML basics it will be much easier for
    you to learn what you need to know in order to build your
    website. If you are going to be creating websites for a
    while (there's a good chance you will be) tags, elements
    and attributes are things you want to be clear on.

    Powerpoint Templates
    Page 6
    Lets try it
    A friendly tool.

    Powerpoint Templates
    Page 7
    Ways to Build a Website
    There are several ways to build a
    website:
    Point and click software (fast, not
    flexible).
    Manually writing the HTML (important
    to learn, requires time). notepad, word,
    powerpoint
    Using an HTML Editor (efficient once
    learned, HTML knowledge helps).
    Using a template (easy, efficient, must
    use HTML)

    Powerpoint Templates
    Page 8
    Some helpful html language
    Email:
    HTML Code: <a href= "mailto:abc@mail.com" >Email Example</a>
    Images:
    HTML Code: <img src=picturename.gif" />

    Important: Where is this picture?
    Src stands for source. There are two ways to define the
    source of an image. First you may use a standard URL.
    (src=http://www.Tizag.com/pics/htmlT/pitcurename.gif) As your
    second choice, you may copy or upload the file onto your web
    server and access it locally using standard directory tree
    methods. (src="../picturename.gif") The location of this picture
    file is in relation to your location of your .html file.
    For more info on images:
    http://www.tizag.com/htmlT/images.php
    Powerpoint Templates
    Page 9
    Your MUSC space
    Step 1
    My computer < Map Network Drive
    Step 2
    Enter \\homeroom.musc.edu\netID
    Step 3
    For user name enter clinlan\netID
    Powerpoint Templates
    Page 10
    Lets Try it!
    Powerpoint Templates
    Page 11
    How to design your site
    Think about the function of your
    site
    Go for simplicity as opposed to
    clutter
    Avoid text fonts smaller than 11px
    Keep a consistent layout
    Every few edits, check your
    progress

    Powerpoint Templates
    Page 12
    Assignment
    Create a website that includes
    the following:
    Name
    Picture
    A short bio
    Personal/contact info
    Current classes
    Research interests
    CV
    Email me a link to your website

    You might also like