Scribd Logo
Fazer o upload

Bem-vindo(a) ao Scribd!

  • Lab 3

    Enviado por

    Saqib Jawed
    28 visualizações13 páginas
    This document provides instructions for designing basic web pages using HTML. It discusses what a website is, introduces HTML as the language used to create web pages, and provides a step-by-step guide to getting started with basic HTML tags and structure. The steps include using a text editor like Notepad++ to write HTML code, saving files with a .html or .htm extension, and inserting basic HTML tags like <html>, <head>, <title>, and <body> to provide the framework for a web page. Attributes are also introduced as a way to provide additional information about tags.

    Descrição original:

    Direitos autorais

    © © All Rights Reserved

    Formatos disponíveis

    PDF, TXT ou leia online no Scribd

    Você considera este documento útil?

    Este conteúdo é inapropriado?

    Denunciar este documento
    This document provides instructions for designing basic web pages using HTML. It discusses what a website is, introduces HTML as the language used to create web pages, and provides a step-by-step guide to getting started with basic HTML tags and structure. The steps include using a text editor like Notepad++ to write HTML code, saving files with a .html or .htm extension, and inserting basic HTML tags like <html>, <head>, <title>, and <body> to provide the framework for a web page. Attributes are also introduced as a way to provide additional information about tags.

    Direitos autorais:

    © All Rights Reserved
    Baixe no formato PDF, TXT ou leia online no Scribd
    Sinalizar o conteúdo como inadequado
    28 visualizações13 páginas

    Lab 3

    Enviado por

    Saqib Jawed
    This document provides instructions for designing basic web pages using HTML. It discusses what a website is, introduces HTML as the language used to create web pages, and provides a step-by-step guide to getting started with basic HTML tags and structure. The steps include using a text editor like Notepad++ to write HTML code, saving files with a .html or .htm extension, and inserting basic HTML tags like <html>, <head>, <title>, and <body> to provide the framework for a web page. Attributes are also introduced as a way to provide additional information about tags.

    Direitos autorais:

    © All Rights Reserved
    Baixe no formato PDF, TXT ou leia online no Scribd
    Sinalizar o conteúdo como inadequado
    de 13

    EC-203

    LAB 3
    How-to Design Web Pages Using Basic HTML
    WHAT IS A WEBSITE?

    a collection of webpages, photos, articles, videos or any other digital media organized
    perfectly so that users can easy navigate around it and find the information which they came
    seeking.

    A website is hosted on web servers connected to Internet .Every website is identified with
    its uniques URL or IP address, even every digital media hosted on a website has its own
    URL ( Uniform Resource Locator ). Every website has its own top-level domain extension
    such as

    .com - Commercial websites


    HTML PROGRAMMING

    HTML ( Hyper Text Markup Language ) is the language used to create web pages.

    Almost everybody who is involved with the internet or web designing needs to have a
    basic understanding of how HTML works or HTML codes are written.

    An HTML file contains "markup tags" that tell the browser how to follow instructions
    within these tags.
    Step 1
    Editor

    First of all you need a editor program on which you will write your HTML codes.

    I recommend you to use Notepad++ ( a free program ), its very easy to use and you can
    easily manage your complex HTML codes with ease as it show HTML tags, attributes and
    contents with different colors. Then

    Download Notepad++

    Install Notepad++ and start it. The interface of this software could be something like this

    First that you should do immediately is to save it with any name with extension ".html" or
    ".htm". Here .html or .htm extension tells the Web Browser that its a HTML file.
    Step 2

    LET GET STARTED with the BASIC

    ● Every Web page starts with the <html> tag telling the web browser the start of the
    HTML document and ends with </html> which indicates the browser that it is the
    end of the HTML document, there are even more tags which you will be learning
    further, but one thing which you will see that these tags <html>, <body> etc are not
    displayed in the web browser. The browser only displays the content between the
    tags, but the tags themselves are hidden.
    ● Here is the Syntax of a <html> tag or we can say, the basic structure of the web
    page
    <html><head><title>xxxxxxxxxxxxxxxxxxxxxxx</title></head>

    <body>xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx </body></html

    Let me explain you the two types of tag before we go further:

    1. Container tag/Non-Empty tags - Container tags are also known as Non-Empty tags.
    These types of tags requires opening as well as closing.

    Example: <html>, <head>, <title>, <body>, <i> these types of tags requires closing.
    Every container tag is closed by giving a slash sign ( / ) just before the name of the tag

    Example: </html>, </head>, </title>, </body>,</i> are the examples of closing tags.

    2. Empty tag/Non-Container tags - Empty tags don't requires closing even if you have
    opened it.

    Example: <br>, <img>, etc


    3. Attributes - Every tag have their own attributes and each attribute provide additional
    information about any tag. Attributes are always used within the tag and in the following
    manner

    <tag attribute="value">

    The following example will make it clear - Suppose if you want to have background color
    of your web page as black then you will use "bgcolor" attribute within the <body> tag.
    Open Notepad++ and type the following code

    <html><head><title>Web Designing</title></head>

    <body bgcolor="black">

    <font face="Bradley Hand ITC" color="white" size="5">You are learning Web Designing</font>

    <font face="Cooper Black" color="green" size="4">You are learning Web Designing</font>

    <font face="broadway" color="red" size="6">You are learning Web Designing</font>

    <font face="Aerial" color="yellow" size="8"> You are learning Web Designing</font>

    <font face="Comic Sans MS" color="purple" size="10"> You are learning Web Designing</font>

    </body></html>
    ● As you can see main tags have "light blue" color
    ● contents that are displayed on web browsers have "black" color,
    ● attribute have "red" color while
    ● value of attributes have "purple" color.

    This is the main reason why we use Notepad++, you can easily distinguish all stuffs very
    easily.

    ● Open the saved file using any Web Browser.


    The following code could give this type of output

    Você também pode gostar