WEB DEVELOPMENT QUIZ QUESTIONS:

LEC #5
5 HTML Tables and Form

1. What are the elements used to define the structure of an HTML table?
An HTML table consists of one <table> element and one or more <tr>, <th>, and
<td> elements. The <tr> element defines a table row, the <th> element defines a table
header, and the <td> element defines a table cell.

2. Describe the purpose of a table caption and the table heading elements
Caption is used to provide a brief title or description for the table. Heading elements can be
useful for tables with many rows. The <caption> element is used to provide a brief title or
description of the table, which improves the accessibility of the table, and is strongly
recommended.

3. How are the rowspan and colspan attributes used.

These are used to specify the number of rows or columns a cell should merge.
The rowspan attribute is for merging rows and the colspan attribute is for merging
columns of the table in HTML

4. Create a table that correctly uses the caption, thead, tfoot, and
tbody elements. Briefly discuss the role of each of these elements.
thead is used to enclose a group of rows in a table as a header.
tfoot is used to enclose a group of rows in a table as a footer, such as last
row for summary.
tbody is for main body of the table.

5. What are the drawbacks of using tables for layout?

The first of these problems is that this approach tended to dramatically
increase the size of the HTML document. which lead to longer time to
download the file.
Second problem users face while using tables for markup, leads to the
markup that is not semantic.

6. What is the difference between HTTP GET and POST? What are the
advantages/disadvantages of each?

In GET method, values are visible in the URL. In POST method, values are
not visible in the URL.
GET has a limitation on the length of the values, generally 255 characters.
POST has no limitation on the length of the values.
GET Parameters remain in web browser history. POST Parameters are
not saved in web browser history.

Advantages and Disadvantages

GET:
Advantages of GET
• Data can be clearly seen in the address bar. This may be an
advantage during development
• The GET method can retrieve information identified by the request-
URl

Disadvantages of GET
• GET can’t be used to send word documents or images.
• The GET method cannot be used for passing sensitive information like
usernames and passwords.
• The length of the URL is limited.

POST
Advantages of POST
• You can send user-generated data to the web server.
• POST is a secure method as its requests do not remain in browser
history.
Disadvantages of POST
• It is not possible to save data as the data sent by the POST method is
not visible in the URL.
• You cannot see POST requests in browser history.

7. What is a query string?

A query string is a series of name=value pairs separated by
ampersands (the & character).

8. What is URL encoding?

URL encoding converts non-ASCII characters into a format that can be
transmitted over the Internet.

9. What are the two different ways of passing information via the URL?

GET Method
POST method

10. What is the purpose of the action attribute?

The action attribute defines the action to be performed when the form is
submitted. Usually, the form data is sent to a file on the server when the
user clicks on the submit button
11. In what situations would you use a radio button? A checkbox?
Radio buttons are useful when you want the user to select a single item
from a small list of choices and you want all the choices to be visible.
The checkboxes are often used by users when they need to choose between
two options such as yes/no or on/off. Checkboxes can be grouped together
by making them share the similar name attribute.

12. What are some of the main additions to form construction in

HTML5?
Pattern Attribute, Require Attribute, Attribute, Element.
Pattern Attribute: attribute helps in designing a regular expression pattern,
which ought to match with the pattern that is inputted by the user.
Required Attribute: With the help of the browser, this attribute warns the
user not to leave any field blank, by displaying a message in the browser.
Attribute: permits the browser to present predictive options for the
elements which are formed on the values that are entered earlier.
Elements: helpful in specifying the elements which can show in a drop-
down autocomplete style list for a particular text element.

13. What is web accessibility?

Web accessibility refers to process of making website easily accessible to
people with visual, auditor, cognitive and mobility disabilities.

14. How can one make an HTML table more accessible? Create an
example accessible table with three columns and three rows in which the
first row contains table headings.
By using the caption element, a user can know about the table before getting
to know about each cell that is present in the table. When there is situation
where the user needs to insert a long depiction, then it is advised for the
user to put the table with an element and use an element to provide the
illustration. To make a user quickly observe where the data cell is present in
a column or row, one needs to connect the cells with the help of textual
illustration in the header.

15. What are microformats? What is their purpose?

Microformats are helpful in representing familiar block of data, with help fo
small models of HTML attributes and markup. Here the familiar data can be
the people, news articles, events etc.

16. What is schemna.org and how does it relate to semantic markup?

Schema markup, which can be found at Schema.org, is a semantic
vocabulary of microdata that you add to your website's HTML so that search
engines can better read and understand your content.

6 Web Media

1.How do pixels differ from halftones?

Pixels: Any text and images on the mobile screen or desktop is displayed
with small squares of colored light called pixels which are arranged in two
dimensional grids.
Halftones: The images and text printed on page with small overlapping dots
are known as halftones.

2. How do raster images differ from vector images?

A vector image is not composed of pixels but instead is composed of
objects such as lines, circles, Bezier curves, and polygons.
In a raster image (also called a bitmap image) the smaller components are
pixels. That is, the image is broken down into a two-dimensional grid of
colored squares. A raster image has a set number of
pixels, dramatically increasing or decreasing its size can dramatically affect
its quality. Raster images can be manipulated on a pixel-by-pixel basis by
painting
programs such as Adobe Photoshop, Apple Aperture, Microsoft Paint, or the
open-source GIMP. The main advantage of vector images is that they are
resolution independent,
meaning that while both vector and raster images are displayed with pixels
(Or dots), only vector images can be shrunken or enlarged without a loss of
Quality.
3. Briefly describe the RGB, CMYK, and HSL color models.
RGB - Red-Green-Blue color model

CMYK - Cyan-Magenta-Yellow-Key (or blacK) color model. CMYK is used for

colored printouts. In colored printing, color is created by overlapping cyan,
magenta, yellow.

HSL - Hue-Saturation-Lightness color model

4.What is opacity? Provide examples of three different ways to set it in

CSS.
Opacity gives the degree of transparency of color. The concept of opacity is
used to identify what colors "behind it".
.square2 { background-color:green; opacity:0.75; } .square3 { background-
color: reba(0,255,0,0.50);//o.50 is opacity } .sqaure4{ background-
color:hsla(110,100,40,0.5); }

5.What is the purpose of the artist color wheel?

To better show the relationships between colors. Used for creating different
color combination very easily which is a bit difficult in RGB, CMYK, and HSL.

6. What is color depth? What is its relationship to dithering?

Refers to the maximum number of possible colors that an image can
contain.
7. With raster images, does resizing images affect image quality? Why or
why not?
Yes, because raster images are composed of pixels. The size of the image
depends on many factors like pixel dimension of the image, the monitor
size, and computer display resolution of the image.

8. Describe the main features of the JPEG file format.

 • Lossy compression
• 24-bit
• True-color file format
• The files size is less which in turn reduces the downloading time.
• Compatible. Picture quality is high with small degree of compression.

9. Explain the difference between lossy and lossless compression.

Lossless means that no pixel information is lost in compression. No loss in
information. The original data can be recovered since there is no loss of
data. Used in the application this can tolerate the difference between
original and reconstructed data.
Lossy means that pixels are eliminated and lost in compression. Loss of
information. The original data cannot be recovered after compression. Can
only be used in the application where there is not much importance in
gaining back the original data.

10. Describe the main features of the GIF file format.

8-bit
256-color limit
Lossless compression
11. Describe the main features of the PNG file format.
It uses lossless compression technique. 8-bit indexed coloring. Supports full
24-bit true color. Supports 8 bits of transparency.

12. What is anti-aliasing and what issues does it create with transparent
images?
Refers to the visual "smoothing" of diagonal edges and contrast edges via
pixels of intermediate colors along boundary edges. There is a severe
interaction between anti-aliasing and binary transparency

13. Describe the main features of the SVG file format.

The scalable vector Graphics is a vector file format, which is supported by
all desktop browsers.
• Does not lose quality when resized.
• Do not look realistic, but good for line art, charts, and logos.
• Free open source. Can be easily created using XML files.
14. Explain the relationship between media encoding, codecs, and
container formats.
Media encoding is the compression of audio and video files. Codecs are the
compression/decompression software. Container formats specifies how the
audio and video information is stored in a file, and how the different
information within it is synchronized.