Scribd Logo
Upload

Welcome to Scribd!

  • MC0064-02 Basic Web Development

    Uploaded by

    ssharma79
    249 views8 pages
    Text tags are content that is modified by a tag. Ampersand (&) is used to denote a special character for HTML content that may not belong to a 7-bit ASCII character set. HTML 4 includes mechanisms to control : border styles horizontal and vertical alignment of cell contents and cell margins.

    Original Description:

    Copyright

    © Attribution Non-Commercial (BY-NC)

    Available Formats

    DOC, PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    Report this Document
    Text tags are content that is modified by a tag. Ampersand (&) is used to denote a special character for HTML content that may not belong to a 7-bit ASCII character set. HTML 4 includes mechanisms to control : border styles horizontal and vertical alignment of cell contents and cell margins.

    Copyright:

    Attribution Non-Commercial (BY-NC)
    Download as DOC, PDF, TXT or read online from Scribd
    Flag for inappropriate content
    249 views8 pages

    MC0064-02 Basic Web Development

    Uploaded by

    ssharma79
    Text tags are content that is modified by a tag. Ampersand (&) is used to denote a special character for HTML content that may not belong to a 7-bit ASCII character set. HTML 4 includes mechanisms to control : border styles horizontal and vertical alignment of cell contents and cell margins.

    Copyright:

    Attribution Non-Commercial (BY-NC)
    Download as DOC, PDF, TXT or read online from Scribd
    Flag for inappropriate content
    of 8

    Name: Sudeep Sharma

    Roll Number: 510818304

    Learning Centre: 2882

    Subject : Basic Web Development

    Assignment No.: MC0064 – 02

    Date of Submission at the learning centre:


    31/05/2008

    Faculty Signature:
    MC0064-02
    BASIC WEB DEVELOPMENT

    1. Q- What are text tags? Explain their usage in HTML with an example for
    each.

    ANS- This is content that is modified by a tag. For example, if the tag were a
    document title, the HTML string <TITLE> UPTEC Computer Consultancy Ltd
    </TITLE> would display the text in the title in the bar at the top of a graphical
    browser’s windom.
    {</TAG NAME>}
    A closing tag name is denoted by a left angle bracket (<), followed by a forward
    slash (/), then the tag name, and finally a closing right angle bracket (>); curly
    braces indicate that this element dose not always occur.
    The ampersand (&) is another special HTML control character. It is used to
    denote a special character for HTML content that may not belong to a 7-bit ASCII
    character set. Such tagged items are called character entities. Some HTML
    element have no content. For example, the horizontal rule element (which uses the
    <HR> start tag) has no content; its only role is to create a line. Element with no
    content are called “empty element “, and they never have end tags.
    To create this HTML example, just start your text editor and type in the following
    HTML code and save it as example 1. Htm
    <HTML>
    <HEAD>
    <TITLE> A Hello world Example in HTML
    </TITLE>
    </HEAD>
    <BODY>
    Hello, ALL!
    </BODY>
    </HTML>
    Internet Explorer or Netscape Navigator will display this code as a simple web
    page.

    2. Q- Explain the mechanisms to control the table formatting by visual user


    agent.

    ANS- HTML 4 includes mechanisms to control :


    • border styles
    • horizontal and vertical alignment of cell contents
    • and cell margins
    Borders and rules
    The following attributes affect a table’s external frame and internal rules.
    Attribute definitions
    Frame=void | above | below | hsides | lis | rhs | vsides | box |border
    This attribute specifies which sides of the frame surrounding a table will be visible
    Possible values:
    • Void: No sides. This is the default value
    • .above: The top side only.
    • Below: The bottom side only.

    2
    • hsides: The top and bottom side only.
    • vsides: The right and left side only.
    • ihs: The left-hand side only.
    • rhs: The right-hand side only.
    • box: All four sides.
    • border: All four sides.
    .rules = none| groups| rows |cols| all
    This attribute specifies which rules will appear between cells within a table. The
    rendering of rules is user agent dependent.
    • none: no rules. This is the default value.
    • groups: Rules will appear between row groups and columm groups only.
    • rows: Rules will appear between rows only.
    Border= pixels
    This attributes specifies the width of the frame around a table .
    To help distinguish the cells of a table, we can set the border attribute of the TABLE
    element. Consider a pervious example:
    <TABLE border=”1”
    Summary =”This table charts the number lf cups of coffee consumed by each
    senator.”>
    <CAPTION> Cups of coffee consumed by each senator </CAPTION>
    <TR>
    <TH>NAME</TH>
    <TH>Cups</TH>
    <TH>Types of Coffee</TH>
    <TH>Sugar?</TH>
    <TR>
    <TD>T. Sexton</TD>
    <TD>10</TD>
    <TD>Espresso</TD>
    <TD>NO</TD>
    <TR>
    <TD>J.Dinnen</TD>
    <TD>5</TD>
    <TD>Decaf</TD>
    <TD>Yes</TD>
    </TABLE>
    In the following example , the user agent should show border five pixels thick on the
    left-hand and right-hand sides of the table, with rules drawn between each column.
    The following settings should be observed by user agent for backwards compatibility.
    • Setting border=”0” implies frame=”void and, unless otherwise specified,
    rules=”none”.
    • Other values of border imply frame=”border” and, unless otherwise specified,
    rules=”all”.
    • The value “border” in the start tag of the TABLE element should be
    interpreted as the value of the border attribute.
    Horizontal and vertical alignment
    Attribute definitions
    Align= left | center | right | justify |char

    3
    This attribute specifies the alignment of data and the justification of text in a cell.
    Possible values:
    • left: Left-flush data /Left-justify text.
    • center: Center data /enter-justify text.
    • right: Right-flush data /Right-justify text.
    • justify: Double-justify text.
    • char: Align text around a specific character.
    Valign =top | middle | bottom | baseline
    • top: Cell data is flush with the top of the cell.
    • middle: Cell data is centered vertically within the cell.
    • bottom: Cell data is flush with the bottom of the cell.
    • baseline: All cells in the same row as a cell whose valign attribute the value
    should have their textual data position so that the first text line occurs on a
    baseline common to all cells in the row.
    Char=character
    This attribute specifies a single character within a text fragment to act as an axis for
    alignment.
    Charoff=length
    When present, this attribute specifies the offset to the first occurrence of the alignment
    character on each line.
    Cell margins
    Cellspacing =length
    This attribute specifies how much space the user agent should leave between the left
    side of the table and the left-hand side of the leftmost columm,
    Cellpadding =length
    This attribute specifies the amount of space between the border of the cell and its
    content.
    If a table or given column has a fixed width, cellspacing and cell padding may
    demand more space than assigned. User agents may give these attributes precedence
    over the width attribute when a conflict occurs, but are not required.

    3. Q- How to include an image in a web page? What are the attributes for the
    same? Illustrate with an example.

    ANS- Src
    This attribute specifies the location of the image resource. Example of widely
    recognized image formats include GIF,JPEG, and PNG.
    longdesc
    This attribute specifies a link to a long description of the image.
    Name
    This attribute names the element so that it may be referred to from to style sheets or
    scripts. This attribute has been included for backwards compatibility. Applications
    should use the id attribute to identify elements.
    The IMG element embeds an image in the current document at the location of the
    element’s definition. The IMG element has no content; it is usually replaced inline by
    the image designated by the src attribute, the exception being for left or right-aligned
    images that are “floated “out of line.
    In an example, we defined a link to a family photo. Here, we insert the photo directly
    into the current document:

    4
    <BODY>
    <P>I just returned from vacation! Here’s a photo of my family at the lake: <IMG
    src=”http://WWW. some company. com/people/lan /vacation/family. png”alt =”A
    photo of my family at the lake.”>
    </BODY>
    The alt attribute specifies alternate text that is rendered when the image cannot be
    display be displayed. User agent must render alternate text when they cannot support
    image, they cannot support a certain image type or when they are configured not to
    display images.
    The following example shows how the longdesc attribute can be used to link to a
    rocher description:
    <BODY>
    <P>
    <IMG src =”sitemap. Gif” alt=”HP Labs Site Map” longdesc=”sitemap.html”>
    </BODY>
    The alt attribute provides a short description of the image. This should be sufficient to
    allow users to decide whether they want to follow the link given by the longdesc
    attribute to the longer description, here “sitemap.html”.
    Height and width control the size at which the graphic appears on the Web page.
    These attributes are options; use them only if you do not like the default size and need
    to resize the picture. The Web page adjusts the height and width of the sizes that you
    specify.
    When you use the HEIGHT and WIDTH attributes, make sure that you keep the same
    proportions as the original graphic; if not, the picture looks like you stretched it either
    horizontally or vertically. Resizing a graphic to be larger than the original is rare.
    For example, the following <IMG>tag display the picture in the file.
    Picture.gif as 30by 50 pixeis, regarless of the size of the stored picture: <IMG
    srt=”picture.gif” HEIGHT=”30”WIDTH=”50”>
    Using small graphics on Web pages is best.
    ALIGN controls how text flows around the graphic. Align has five possible values:
    TOP places one line of text even with the top of the image.
    MIDDLE places one line text at the middle of the image.
    BOTTOM places one line of text the bottom of image.
    LEFT and RIGHT are useful when you have paragraphs of text that you want to wrap
    around a graphic. For example, the following tag displays a picture on the left side of
    the Web page.
    <IMG SRC=”picture.fig”ALIGN=”LEFT”>
    HSPACE and VSPACE control the amount of white space the image.For the example
    in the Web pages.
    <IMG SRC=picture.gif”HSPACE=1125”VSPACE=1110”>
    BORDER indicates that a border should be placed the image, and controls the width
    of the border.
    <IMG SRC=”picture.gif”BORDER=”>
    ALT contains the text that appears while the picture is loaling, or if a user has a
    browser that does not display graphic. For example,
    <IMG SRC=”picture.gif:ALT=”Book cover of this week’s selection”>
    Only the SRC attribute, which specifies by specifies the filename, is necessary. All
    attributes are placed in the same <IMG> tag, separated by spaces. For example,
    <IMG SRC=”picture.gif” JEOGJT=”30” WIDTH=”50”
    ALIGN=”LEFT”HSPACE=”25”

    5
    VSPACE=”1110” BORDER=” “ALT=”BOOK cover of this week’s selection”>
    When readers click the”list of book club members” link, they jump to the book Club
    members location. You can add an anchor name to jump to an existing anchor in any
    Web page, like this:
    <A HREF =*http://WWW.sample.com/index.html#members”>list of book club
    members</A>

    4. Q- Explain the various features of style sheets supported by HTML 4.

    ANS- Flexible placement of style information


    Placing style sheets in separate files makes them easy to reuse. Sometimes it’s useful
    to include rendering instruction within the document to which they apply, either
    grouped rendering instructions within the document, or in attributes of the elements
    throughout the body of the document. To makes it easier to manage style on a site
    basis, this specification describes how to use HTTP headers to set the style sheets to
    be applied to a document.
    Independence from specific style sheet languages
    Thai specification doesn’t tie HTML to any particular style language. This allows for
    a range of such languages to be used, for instance simple once for the majority of
    users with highly specialized need. The example included below all use the CSS
    language, but other style sheet language would be possible.

    Cascading
    This is the capability provided by some style sheet language such as CSS to allow
    style information from sources to be blended together. These could be, for instance,
    corporate style guidelines, styles common to a group of documents. And style specific
    to a single document. Style sheets can be reused. The cascade defines an ordered
    sequence of style sheets where rules in later sheets have greater precedence than
    earlier ones. Not all style sheet languages support cascading.

    Media dependencies
    HTML allows authors to specify documents in a media-independent way. This allows
    users to access Web pages using a wide variety of devices and media, e.g., graphical
    displays for computers running Windows Macintosh OS, and X11, devices for
    television sets, specially adapted phones and PDA-based portable devices, speech-
    based browsers, and Braille- based tactile devices.
    Style sheets, by contrast, apply to specific media or media groups. A style sheet
    intended for screen use may be applicable when printing, but is of little use for
    speech-based browsers. This allows user agents to avoid retrieving inappropriate style
    sheets. Style sheet language may include features for describing media dependencies
    within the same style sheet.

    Alternate styles
    Authors may wish to offer readers several ways several ways to view a document. For
    instance, a style sheet for rendering compact document with small fonts, or one that
    specifies larger fonts for increased legibility. This specification allows authors to
    specify a preferred style sheet as well as alternates that target specific users or media.
    User agents should give users the opportunity to select from among alternate style
    sheets or to switch off style sheets altogether.

    6
    Performance concerns
    Some people have voiced concerns over performance issues for style sheets. For
    instance, retrieving an external style sheet may delay the full presentation for the user.
    A similar situation arises if the document head includes a lengthy set of style rules.
    The current proposal addresses these issues by allowing authors to include rendering
    instructions within each HTML element. The render information is then always
    available by the time the user agent wants to render each element.
    In many cases, authors will take advantage of a common style sheet for a group of
    documents. In this case, distributing style rules throughout the document will actually
    lead to worse performance than using a linked style sheet, since for most documents,
    the style sheet will already be present in the local cache. The public availability of
    good style sheets will encourage this effect.

    5. Q- What are the various issues that are to be considered for determining form
    content?

    ANS- The first in development a form is determining which information which


    information to include and how to present it, that is , how to break it down into
    mansgeable pieces. You then need to ensure that visitors can easily provide the
    information you want from them, which means that your form needs to be both
    functional and visually appealing.

    Information Issues
    When deciding which information to include and how to break it down, consider your
    purposes for creating the form. Begin by answering the following questions:
    • What information do I want? Customer contact information?
    • Why will visitors access the form? To order something on-line? To request
    information?
    • What information can visitors readily provide? Contact information of
    previous purchases?
    • How much time will visitors be willing to spend filling out the form?
    After determining what information you want and what information your visitors can
    provide, break the information into the smallest chunks possible.

    Usability Issues
    Usability refers to how easily your visitors can answer your questions. Some usability
    guidelines to consider when you are creating forms are as follows:
    Group Similar Categories
    When you group similar categories, the form appears less daunting, and visitors are
    more likely to fill it out and submit it.

    Make the Form Easy


    • Whenever possible, provide a list form which visitors can choose one or
    more items. Lists are easy to use, and they result in easy-to-process
    information.
    • Ask visitors to fill in only fill in only a small amount of text. This takes
    minimal time, and it provides you with data that is fairly easy to process .

    7
    Provide Incentives

    Provide visitors with incentives to fill out the form and submit it. Studies show that a
    penny or a stamp include in mailed surveys often significantly improves the response
    rate. Consider offering a change in a drawing for a free product, an e-mailed list of
    tips and tricks, or a discount on services.

    Design Issues

    A well designed form, helps and encourages visitors to give you the information you
    want. A good form is visually appealing, graphically helpful, and consistent with the
    remainder if the site. Here are some guidelines:
    • Use headings to announce each new group of information. This helps visitors
    move easily through the form.
    • Be sure to visually separate groups. This makes the forms easier to use
    because sections become shorter and easier to read through.
    • Use text emphases to draw the audience to important information.
    • Specify how visitors are to move through the form. Do not make your visitors
    scroll horizontally to access information. Consider making a narrow, longer
    form rather than a wider, shorter form to accommodate those who have lower
    monitor resolution.
    • Use arrows to direct visitors through the page. This can help visitors move
    through the page in a specified order.
    • Be sure that it is clear which check boxes and field go with the associated
    descriptive information. Use line breaks and spacing to clearly differentiate.
    • Specify which fields are optional.
    • Use a background image. Be sure, that the image does not outweigh the
    content and that the text adequately contrasts with the image.
    • Make all the text entry fields the same width and put them on the left if you
    have a vertical column of name and address information; this way all the text
    will align vertically and look much better.

    You might also like