Unit – 2

Web Page Designing

Q1) Describe dynamic html?

A1) Dynamic HTML

DHTML stands for Dynamic HTML and is not to be confused with HTML. Some versions of Netscape Navigator and Internet Explorer higher than version 4.0 support dynamic HTML. The properties of HTML, JavaScript, CSS, and the DOM (Document Object Model, which is used to access individual elements of a document) are used to create DHTML, which aids in the creation of dynamic content.

It is made up of HTML, CSS, JS, and the Document Object Model (DOM). To make improvements to settings, properties, and methods, DHTML employs the Dynamic object model. It also employs scripting and is influenced by previous programming patterns.

After the entire page has been completely loaded or under a view operation, or otherwise static HTML pages on the same, DHTML allows various scripting languages in a web page to adjust their variables, which improve the effects, looks, and many other functions.

When a page is accessed, the code within the page is analyzed on the web server, and the resulting HTML is sent to the client's web browser. DHTML is used to build interactive and animated web pages that are created in real-time, often known as dynamic web pages, so that when such a page is accessed, the code within the page is analyzed on the web server and the resulting HTML is sent to the client's web browser.

Q2) Explain lists and table of html?

A2) Lists

Lists of data are defined using HTML Lists. One or more list elements can appear in any list. HTML lists can be divided into three categories:

Ordered List or Numbered List (ol)

By default, all list items in ordered HTML lists are labelled with numbers. It's also known as a numbered list. The <ol> tag begins the organized list, and the <li> tag starts the list objects.

Unordered List or Bullet List (ul)

All list items in an HTML Unordered list are labelled with bullets. It's often referred to as a bulleted list. The tag begins the unordered list, and the tag begins the list pieces.

Description List or Definition List (dl)

HTML Description List is a list format that HTML and XHTML also support. It's also known as a definition list, and it's similar to a dictionary or encyclopedia in that entries are ordered alphabetically.

The following three tags are included in the HTML specification list:

●      <dl>tag - The start of the list is defined by the name.

●      <dt>tag - A word is defined by a tag.

●      <dd>tag - The word meaning is defined by tag (description).

Table

To view data in a tabular format (row * column), use the HTML table tag. In a row, there can be several columns.

Using the <table> element and the <tr>, <td>, and <th> elements, we can construct a table to show data in a tabular format.

Table row is identified by the <tr> tag, table header by the <th> tag, and table data by the <td> tag in each table.

HTML tables are used to monitor the page's layout, such as the header section, navigation bar, body material, and footer section, among other things. To control the layout of the page, however, it is recommended that you use the div tag rather than the table tag.

Q3) Write about images, frames, forms?

A3) Images

The img tag in HTML is used to display a picture on a web page. The HTML img tag is an empty tag with only attributes; no closing tags are used in the HTML image element.

Attributes of img tag

The src and alt attributes of the HTML img tag are essential. The HTML image tag's attributes are listed below.

●      src - It's a required attribute that defines the image's source or direction. It tells the browser where to look on the server for the picture.

The picture may be in the same directory or on a different server.

●      alt - If the image can't be shown, the alt attribute specifies an alternative text. The alt attribute's meaning describes the picture in terms. The alt attribute is thought to be beneficial to SEO.

●      width - It's an optional attribute that specifies the image's width for display. It is not advised at this time. Instead of using the width variable, you can use CSS.

●      height - It is h3 the image's height. Iframe, image, and object elements are all supported by the HTML height attribute. It is not advised at this time. Instead of using the height variable, you can use CSS.

Frames

Frames allow us to split the browser window into multiple rectangular areas. Each area has its own html web page, which functions independently.

A frameset is a collection of frames that spans the entire browser. It instructs the browser on how to divide the browser window into frames and which web pages should be loaded in each frame.

The following table lists the different tags that can be used to create frames:

Forms

Forms are used to input the values. These values are sent to the server for processing. Forms use input elements such as text fields, check boxes, radio buttons, lists, submit buttons etc. to enter the data into it.

The following table describes the commonly used tags while creating a form:

Q4) What do you mean by CSS?

A4) CSS

Cascading Style Sheets (CSS) is an acronym for Cascading Style Sheets. It aids in the definition of HTML element presentation as a separate file known as a CSS file with the.css extension.

CSS allows you to adjust the formatting of any HTML element by making just one change. All changes will be immediately mirrored on all of the website's web pages where that feature appeared.

Why use CSS

These are the three most important advantages of CSS:

Font, color, background design, element alignments, border, and size tags had to be replicated on every web page before CSS. This was a lengthy procedure. For example, if you're building a large website with fonts and color details on every page, it'll be a time-consuming and costly process. CSS was developed to address this problem. It was a suggestion from the World Wide Web Consortium (W3C).

2.     Saves a lot of time

CSS style definitions are stored in external CSS files, so modifying only one file will alter the entire website.

3.     Provide more attributes

CSS offers more specific attributes for defining the look and feel of a website than plain HTML.

CSS Rules

The styles that we must build in order to create style sheets are known as CSS Rules. The presence of the associated HTML element is described by these rules.

CSS syntax can be summarized as follows:

Selector {property: value;}

Q5) What is XML DTD?

A5) XML: DTD

XML is a medium for storing and transporting data that is independent of software and hardware.

The eXtensible Markup Language (XML) stands for eXtensible Markup Language.

XML, like HTML, is a markup language that was created to store and transport data. It was also created to be self-descriptive.

Document Type Definition (DTD) is an acronym for Document Type Definition. It specifies the legal components of an XML document. It's used to specify the structure of a document using a list of legal elements and attributes.

Its main function is to describe an XML document's structure. It includes a set of legal elements that are used to describe the framework.

Checking validation

You must verify the validation before continuing with the XML DTD. If an XML document contains the correct syntax, it is said to be "well-formed."

A legitimate and well-formed XML document is one that has been checked against a DTD.

Description of DTD

<!DOCTYPE employee: It specifies that the document's root variable is employee.

<!ELEMENT employee: The employee element is described as having three elements: "firstname, lastname, and email."

<!ELEMENT firstname: It specifies that the firstname element is of type #PCDATA. (a data form that can be parsed).

<!ELEMENT lastname: It specifies that the lastname element is of type #PCDATA. (a data form that can be parsed).

<!ELEMENT email: It specifies that the email element is of type #PCDATA. (a data form that can be parsed).

Syntax

Basic syntax of a DTD is as follows:

<!DOCTYPE element DTD identifier

[

   declaration1

   declaration2

   ........

]>

Internal DTD

If elements are declared inside the XML files, the DTD is referred to as an internal DTD. The standalone attribute in the XML declaration must be set to yes to refer to it as internal DTD. This means that the declaration is self-contained and does not depend on a third-party source.

Syntax

The syntax of the internal DTD is as follows.

<!DOCTYPE root-element [element-declarations]>

element-declarations is where you declare the elements, where root-element is the name of the root element.

External DTD

The elements of an external DTD are declared outside of the XML format. The device attributes, which can be either a legal.dtd file or a valid URL, are used to access them. The standalone attribute in the XML declaration must be set to no to refer to it as an external DTD. This means that the declaration contains data from a third-party source.

Syntax

The syntax of the internal DTD is as follows.

<!DOCTYPE root-element SYSTEM "file-name">

where file-name is the name of the.dtd file.

Types

You may use device identifiers or public identifiers to refer to an external DTD.

System Identifiers

You may define the location of an external file containing DTD declarations using a device identifier. The following is the syntax:

<!DOCTYPE name SYSTEM "address.dtd" [...]>

As you can see, it includes the keyword SYSTEM as well as a URI reference to the document's location.

Public Identifiers

The following is a list of public identifiers that can be used to find DTD resources:

<!DOCTYPE name PUBLIC "-//Beginning XML//DTD Address Example//EN">

As you can see, it starts with the keyword PUBLIC and then moves on to a more specific identifier. An entry in a catalog is identified by a public identifier. Public identifiers may be in any format, however Formal Public Identifiers, or FPIs, are a popular choice.

Q6) Write the disadvantages of dynamic html?

A6) Disadvantages of Dynamic HTML

●      Learning DHTML necessitates a number of prerequisites. For example, the designer should be familiar with HTML, CSS, and JS before beginning with DHTML, which is a lengthy and time-consuming process in and of itself.

●      Different browsers have different implementations. As a result, if it worked in one browser, it may not operate the same way in another.

●      Also, after becoming extremely functional, DHTML necessitates the use of a few costly tools and utilities. Dreamweaver, for example, is a DHTML text editor.

Q7) Describe xml schemas?

A7) XML Schemas

The XML schema language is a way of expressing constraints in XML documents. There are several schema languages in use nowadays, such as Relax-NG and XSD (XML schema definition).

The structure of an XML document is described by an XML schema. It's similar to DTD, but it gives you more control over the XML structure.

Checking validation

If an XML document contains the correct syntax, it is said to be "well-formed." An XML document that has been validated against Schema is well-formed and correct.

Description of XML Schemas

<xs:element name="employee">: It specifies the employee element.

<xs:complexType>: It specifies that the 'employee' variable is of complex nature.

<xs:sequence> : It specifies that a complex form is made up of a series of elements.

<xs:element name="firstname" type="xs:string"/>: It specifies that the 'firstname' element is of the string/text kind.

<xs:element name="lastname" type="xs:string"/> :  It specifies that the 'lastname' element is of the string/text kind.

<xs:element name="email" type="xs:string"/> : It specifies that the 'email' element is of the string/text kind.

XML Schemas data types

In the XML schema, there are two kinds of data types.

simpleTypes

You can use simpleType to create text-based components. It has fewer attributes and child features, and it can't be left blank.

complexTypes

You may use the complexType to carry several attributes and components. It can be filled with additional sub elements or left bare.

Q8) What is DOM?

A8) DOM

Document Object Model is an acronym for Document Object Model. It establishes a protocol for document access and manipulation. The Document Object Model (DOM) is an HTML and XML document programming API. It specifies the logical structure of documents as well as how they are accessed and modified.

One of the main goals of the Document Object Model as a W3C specification is to provide a basic programming interface that can be used in a broad range of environments and applications. Any programming language can use the Document Object Model.

The XML Document Object Model (DOM) specifies a standard for accessing and manipulating XML data.

What does XML DOM

For an XML text, the XML DOM creates a tree-structure view.

The DOM tree provides access to all components.

We may change or remove their content, as well as add new elements. Nodes are the elements, as well as their content (text and attributes).

Properties of DOM

These are some typical DOM properties:

DOM Methods

Q9) Explain SAX?

A9) SAX

The XML-DEV mailing list-built SAX (Simple API for XML), an event-based sequential access parser API for XML documents. SAX is a method for reading data from an XML document that is an alternative to the Document Object Model's mechanism (DOM). Whereas the DOM works on the entire document, SAX parsers work on each piece of the XML document one at a time.

Unlike DOM, SAX does not have a formal specification. The Java implementation of SAX is regarded as the de facto standard. SAX processes documents in a state-dependent manner, as opposed to DOM, which processes XML documents in a state-independent manner.

Features

●      There is no internal framework established.

●      Clients have no idea what methods to call, so they simply bypass the API's methods and insert their own code inside.

●      It's an event-based parser that functions similarly to a Java event handler.

Advantages

1) It is straightforward and memory-friendly.

2) It is extremely fast and can handle large papers.

Disadvantages

1) The API is less intuitive since it is event-based.

2) Because the data is fragmented, clients never have access to the entire image.

Q10) Write the advantages of dynamic html?

A10) Advantages of HTML

●      As opposed to other interactive media such as Flash or Shockwave, the files are smaller and download faster.

●      It is backed by major browser companies including Microsoft and Netscape.

●      Extremely adaptable and simple to modify.

●      Viewers do not require any additional plug-ins to browse through DHTML-based web pages, nor do they require any additional specifications or software to view them.

Q11) What do you mean by html?

A11) HTML

HTML stands for Hyper Text Markup Language, which is a programming language used to create web pages and applications. Let's look at what the terms Hypertext Markup Language and Web page mean.

Hypertext - "Text inside Text" is what Hypertext is all about. A hypertext is a text that contains a connection. You've clicked on a hypertext when you click on a link that takes you to a new webpage. Hypertext is a method of connecting two or more web pages (HTML documents).

Markup language - A markup language is a programming language for applying layout and formatting conventions to text documents. The markup language enhances the interactivity and expressive nature of text. It can convert text into photos, tables, and links, among other things.

Web pages - A web page is a text written in HTML that a web browser interprets. An URL may be used to identify a web page. A static or dynamic Web page can be found. Static web pages can be created entirely with HTML.

As a result, HTML is a markup language that is used to create appealing web pages with the aid of styling and that display in a pleasing manner in a web browser. An HTML document is made up of several HTML tags, each with its own set of content.