Question Bank - It8078-Web Design and Management
Question Bank - It8078-Web Design and Management
Question Bank - It8078-Web Design and Management
com
UNIT-I
1. What is HTML?
Hypertext is ordinary text that has been designed with extra features such as formatting, images,
multimedia and links to other documents. Markup is the process of taking ordinary text and
om
adding extra symbols. Each of the symbols used for markup in HTML is a command that tells a
browser how to display the text. HTML is the technical term for the format used to create normal
web pages
<HTML>
.c
<HEAD>
<TITLE> This is the Title </TITLE>
</HEAD>
<BODY>
ul
…. Type the body of the program .
</BODY>
</HTML>
A comment in HTML, like comments in other computer languages, is something that is intended
.re
to be read by the programmers but to be ignored by the software processing the document. A
comment begins with the string of characters <!—which must contain no white space. A
comment ends with the string --> again with no white space.
Row spanning is used to merge (combine) two or more rows. Column spanning is used to merge
(combine) two or more columns.
om
• Web languages & protocols
• Web pages
• Home page
.c
• Web browsers
• Web sites
ul
8. How do you create links to sections within the same page?
pa
Links can be created using the <a> tag, with referencing through the use of the number (#) symbol. For
example, you can have one line as <a href=”#topmost”>BACK TO TOP</a>, which would result in the
words “BACK TO TOP” appearing on the webpage and links to a bookmark named topmost. You then
create a separate tag command like <a name=”topmost”> somewhere on the top of the same webpage so
that the user will be linked to that spot when he clicked on “BACK TO TOP”
jin
9. Is there any way to keep list elements straight in an HTML file?
By using indents, you can keep the list elements straight. If you indent each subnested list in further than
the parent list that contains it, you can at a glance determine the various lists and the elements that it
contains.
.re
No, hyperlinks can be used in the text as well as images. That means you can convert an image into a link
that will allow users to link to another page when clicked. Surround the image within the <a href=”
“>…</a> tag combinations
w
11. How do you change the number type in the middle of a list?
The <li> tag includes two attributes – type and value. The type attribute can be used to change the
w
numbering type for any list item. The value attribute can change the number index
With ordered lists, you can select to use some different list types including alphabetical and Roman
numerals. The type attribute for unordered lists can be set to disc, square, or circle.
To create text with different colors, use the <font color=”color”>…</font> tags for every character that
you want to apply color. You can use this tag combination as many times as needed, surrounding a single
character or an entire word
om
Although checkboxes don’t affect one another, grouping checkboxes together help to organize them.
Checkbox buttons can have their name and do not need to belong to a group. A single web page can have
many different groups of checkboxes
If two sets of HTML tags are overlapped, only the first tag will be recognized. You will find this problem
when the text does not display properly on the browser screen
.c
16. What if there is no text between the tags or if a text was omitted by mistake? Will it affect
the display of the HTML file?
ul
If there is no text between the tags, then there is nothing to format. Therefore no formatting will appear.
Some tags, especially tags without a closing tag like the <img> tag, do not require any text between them
18. How do you create a link that will connect to another web page when clicked?
jin
To create hyperlinks, or links that connect to another web page, use the href tag. The general format for
this is: <a href=”site”>text</a>
Replace “site” with the actual page URL that is supposed to be linked to when the text is clicked
19. What other ways can be used to align images and wrap text?
.re
Tables can be used to position text and images. Another useful way to wrap text around an image is to use
style sheets
The bullet color is always the same as that of the first character in the list item. If you surround the <li>
and the first character with a set of <font> tags with the color attribute set, the bullet color, and the first
character will be a different color from the text
w
21. What is the relationship between the border and rule attributes?
Default cell borders, with a thickness of 1 pixel, are automatically added between cells if the border
w
attribute is set to a nonzero value. Likewise, If the border attribute is not included, a default 1-pixel border
appears if the rules attribute is added to the <table> tag.
22. What happens if the list-style-type property is used on a non-list element like a paragraph?
www.rejinpaul.com
If the list-style-type property is used on a non-list element like a paragraph, the property will be ignored
and do not affect the paragraph.
The latest versions of Google Chrome, Apple Safari, Mozilla Firefox, and Opera all support most of the
om
HTML5 features.
<Video> and <Audio> are new tags which are included in HTML5 version. They are mainly used as a
replacement for Flash, Silverlight, and similar technologies to play multimedia items
.c
This tag represents a piece of self-contained flow content. It is mostly used as a single unit as a reference
the main flow of the document.
ul
26. What is the use of Canvas element?
The canvas element helps to build charts, graphs, bypass Photoshop to create 2D images and place them
directly into HTML5 code pa
27. What are the new FORM elements which are available in HTML5?
The new Form elements in HTML5 offers much better functionality than the earlier versions.
• It can store up to 10 MB data which is certainly more than what cookies have.
• Web storage data cannot be transferred with the HTTP request. It helps to increase the
performance of the application
w
Session Storage:
www.rejinpaul.com
It stores data of current session only. It means that the data stored in session storage clear
automatically when the browser is closed.
Local Storage:
Local storage is another type of HTML5 Web Storage. In local storage, data is not deleted
automatically when the current browser window is closed.
om
30. What is the Application Cache in HTML5 and why it is used?
The Application Cache concept means that a web application is cached. It can be accessible
without the need for internet connection.
31. Explain five new input types provided by HTML5 for forms?
.c
Following are the important, new data types offered by HTML5:
ul
2. datetime-local: This input type allows the user to select a date and time without time zone.
3. datetime: This input type allows the user to select a date and time with time zone.
4. month: It enables the user to select a month and year
5. email: These input fields used to contain an e-mail address.
pa
32. Explain the different types of list supported by HTML.
UNIT -II
A style sheet provides a great deal of control over the presentation of a document.
w
Allow the information in the document to be presented without change in a variety of ways
w
Both the document author and the person viewing the document can specify aspect of the document style
as it is displayed by the browser
The @import at-rule is used to input one style sheet fie into another one. For e.g @import
url(―common.css‖); will first read in rules from the file common.css before continuing with
om
The style sheets which has been stored in separate files and included in an HTML
documents through the use of a link element are known as external style sheets.
.c
When two consecutive block boxes are rendered (the first on top of the second), a special rule called
margin collapse is used to determine the vertical separation between the boxes. As the name implies, two
margins--the bottom margin of the first (upper) box and the top margin of the second (lower) box—are
collapsed into a single margin.
ul
5. What are embedded style sheets?
pa
A style sheet that is included in the content of a style element is known as an embedded style sheet
Rule Cascading
Inheritance
.re
A CSS rule has two main parts: a selector, and one or more declarations: The selector is normally the
HTML element you want to style. Each declaration consists of a property and a value. The property is the
w
The origin of a style sheet declaration is who wrote the declaration, the person who wrote the HTML
document , the person who is viewing the document, or the person who wrote the browser software that is
displaying the document. Specifically the origin can be one of the following. i) Author ii) User Agent iii)
w
Use
TEXT-INDENT
TEXT-ALIGN WHITE-SPACE
om
10. Explain Normal Flow Box Layout.
It is a browser’s standard rendering model (normal flow processing), where every HTML element
rendered by the browser has a corresponding regular box that contains the rendered content of the element
.c
The list-style-type property can be used to vary the default styles used for bulleted and numbered list
items. It can be applied to the li, ol, ul element type
ul
12. What are the types of positioning?
Font family is a collection of related fonts, and a font is a mapping from a character
jin
(Unicode Standard code point) to a visual representation of the character (a glyph).
i. ID Selectors
JAVA SCRIPT
A JavaScript statement is a command to a browser. The purpose of the command is to tell the browser
what to do. This JavaScript statement tells the browser to write "Hello Dolly" to the web page: document.
write ("Hello Dolly"); It is normal to add a semicolon at the end of each executable statement. Most
people think this is a good programming practice, and most often you will see this in JavaScript examples
on the web.
om
16. Why JavaScript has been called dynamically typed language?
JavaScript performs many conversions between data types automatically. It is also possible to store
different data types in the same variable which is not possible in other languages like Java and C++ which
are called statically typed languages. According to the data type stored the type of the variable is
determined and it is not necessary for variable type declaration. Hence JavaScript is called dynamically
typed language
.c
17. What is the use of typeof operator?
ul
typeof is an operator that provides information about the data type of a value stored in a variable and also
its use is to test that a variable has been defined before attempting to use it.
Block statement: that consists of set of statements enclosed in braces { } Keyword statement: that begin
with keywords such as var, if, for etc
jin
19. What is Node object?
Every element in a document tree refers to a Node object. Some nodes of the tree are
.re
The document object itself is considered to be DOM tree node with node type 9 and symbolic constant
w
The properties of document object are DOCTYPE, TITLE, BODY, COOKIE, URL, DOMAIN,
REFERRER, CREATEELEMENT(STRING), CREATETEXTNODE(STRING),
w
GETELEMENTBYID(STRING), GETELEMENTBYTAGNAME(STRING)
In the DOM event model, when an event occurs, an instance of a host object named Event is created. This
instance contains information about the event, including the type of event and a reference to the document
node corresponding to the markup element that generated the event which is called the event target.
The Event instance properties type and target provides this information.
om
Dynamic positioning allows you to tell the browser exactly where to put a block of content without using
tables.
.c
An Event Listener is simply a function that takes a single argument that is an instance of an Event. A call
to the addEventListener() method on a node object associates an event listener with a type of event
occurring on that node.
ul
25. What are the types of Events?
alert(String), confirm(String), prompt(String, String), open(String, String) close(), focus(), blur(), print()
.re
27. List out some common window object methods related to time.
i) setTimeout(String, Number)
w
ii) clearTimeout(Number)
iv) clearInterval(Number)
The combination of HTML plus JavaScript and the DOM is referred to as Dynamic HTML (DHTML),
and an HTML document that contains scripting is called a dynamic document.
www.rejinpaul.com
UNIT III
1. What is SASS?
SASS (Syntactically Awesome Stylesheet) is a CSS pre-processor which helps to reduce repetition with
CSS and saves time. It is more stable and powerful CSS extension language that describes style of
om
document cleanly and structurally.
Why to use SASS?
• It is pre-processing language which provides indented syntax (its own syntax) for CSS.
• It allows writing code more efficiently and easy to maintain.
• It is super set of CSS which contains all the features of CSS and is an open source pre-processor,
.c
coded in Ruby.
• It provides document style in good structure format than flat CSS.
•
ul
It uses re-usable methods, logic statements and some of the built in functions such as color
manipulation, mathematics and parameter lists.
2. List out some features of SASS?
•
pa
It is more stable, powerful and compatible with versions of CSS.
It is super set of CSS and is based on the JavaScript.
• It is known as syntactic sugar for CSS which means it makes easier way for user to read or
express the things more clearly.
jin
• It uses its own syntax and compiles to readable CSS.
• You can easily write CSS in less code within less time.
• It is an open source pre-processor which is interpreted into CSS.
.re
It is superset of CSS which helps designers and developers work more efficiently and quickly.
• As Sass is compatible with all versions of CSS, we can use any available CSS libraries.
• It is possible to use nested syntax and useful functions such as color manipulation, mathematics
w
• It takes time for developer to learn new features present in this pre-processor.
• If more number of people working on the same site, then will use the same preprocessor. Some
people use the Sass and some people use the CSS to edit the files directly. So it will become
difficult to work with site.
www.rejinpaul.com
om
stylesheets and can recognize vendor specific syntax and many CSS. SCSS files use the
extension .scss.
• The Indented is an older syntax and sometimes just called as Sass. Using this form of syntax,
CSS can be written concisely. SASS files use the extension .sass.
6. In how many ways you can use the SASS?
.c
You can use SASS in three different ways −
• As a command line tool
•
ul
As a Ruby module
• As a plugin for Rack enable framework
7. What are nested rules in SASS? pa
Nesting is combining of different logic structures. Using SASS, we can combine multiple CSS rules
within one another. If you are using multiple selectors, then you can use one selector inside another to
create compound selectors.
8. How to refer parent selector in the SASS?
jin
You can select the parent selector by using the & character. It tells where the parent selector should be
inserted.
9. How to write placeholder selector in SASS?
.re
SASS supports placeholder selector using class or id selector. In normal CSS, these are specified with
"#" or ".", but in SASS they are replaced with "%".
10. Mention the different types of operations on the SASS?
w
• String Operations
• Boolean Operations
w
• List Operations
11. What are number operations?
It allows for mathematical operations such as addition, subtraction, multiplication and division.
www.rejinpaul.com
om
Lists represent series of values which are separated using commas or space.
14. What are boolean operations?
You can perform boolean operations on Sass script by using and, or and not operators.
What are parentheses in SASS?
.c
Parentheses is pair of signs which are usually marked off by round brackets ( ) or square brackets []
which provides symbolic logic that affect the order of operations.
15. What is interpolation in SASS?
ul
It provides SassScript variables in selectors and property names using #{ } syntax. You can specify
variables or property names within the curly braces.
16. What is variable defaults? pa
You can set default values for variables by adding !default flag to the end of the variable value. It will
not re-assign the value, if it is already assigned to the variable.
17. What is import directive?
jin
It directly takes the filename to import and all the imported files will get combined in a single CSS file.
18. What is media directive?
It is used to share rules and relationships between selectors. It can extend all another class styles in one
class and can also apply its own specific styles.
w
It is is a collection of nested rules which is able to make style block at root of the document.
w
It is used to selectively execute the code statements based on the result of the evaluating an expression.
w
The @else if statements are used with the @if directive, whenever the @if statement fails then the @else
if statements are tried and if they also fails then the @else is executed.
www.rejinpaul.com
In @each directive, a variable is defined which contains the value of each item in a list.
24. What is @mixin directive?
om
It is used to define the mixins that includes optionally the variables and argument after the name of the
mixin.
25. What is @include directive?
It is used to include the mixin in the document and styles defined by the mixin can be included into the
current rule.
.c
26. What are mixin arguments?
The SassScript values can be taken as arguments in mixins which are given when mixin is include and
ul
are available as variable within the mixin.
27. Mention the two types of mixin arguments?
Variable arguments are used to pass any number of arguments to mixin. It contains keyword arguments
passed to the function or mixin.
w
Using function directive, you can create your own function and use them in your script context or can be
w
The CSS file that the SASS generates consists of default CSS style which reflects the structure of
document. The default CSS styling is good but might not be suitable for all situations.
www.rejinpaul.com
Nested style is default styling of SASS. This way of styling is very useful when you are dealing with
large CSS files.
34. What is expanded CSS style?
om
In expanded output styling, each property and rule has its own line. It takes more space compared to
nested CSS style.
CSS properties can be declared in two ways −
• Properties can be declared similar to CSS but without semicolon(;).
• colon(:) will be prefixed to every property name.
.c
35. What is shorthand for writing @mixin and @include directives?
You can use = for @mixin directive and + for @include directive which requires less typing and makes
ul
your code simpler, and easier to read.
36. Which command is used to watch the file and update the CSS whenever SASS file changes?What
are comments in SASS? pa
Comments take up entire line and enclose all the text nested under them and they are line-based in
indented syntax.
37. Which command is used to run SASS code from the command line?
jin
sass input.scss output.css
38. What are the CSS specifications for character encoding of stylesheets?How many types are there
in comments?
.re
http://adaptive-images.com
w
button styles
www.rejinpaul.com
40. What should be the set value of the background-size property such that image will fit in the
content area?
100%100%, If the background-size property is set to “contain”, the background image will scale and will
try to fit in the content area. Still, the image will keep its aspect ratio i.e. the proportional relationship
between the image’s width and height.
om
41. Which tag is used to let control over the viewport?
<meta>
.c
.affix, Affix plugin allows an element to become affixed i.e. sticky or locked to an area on the page. It
toggles position:fixed on and off, .alert-link is used on links inside alerts to add matching colored links.
ul
43. Which is a container for slide items?
.carousel-inner is a container for slide items, .carousel-caption creates a caption text for each slide in the
carousel, .carousel-control is container for next and previous links, .carousel-indicators adds little dots at
pa
the bottom of each slide
.clearfix clears floats, .close indicates a close icon, .checkbox ia a container for checkboxes, .col-*-* is a
jin
responsive grid (span 1-12 column), extra small devices phones (<786px), tablets (>=786px), medium
devices desktops (>=992px), large devices desktops (>=1200px).
To construct HTML for slideshow simply wrap the content or the images within unordered list element
with data-orbit. For enabling slideshow we will need to include jquery.js, foundation.js,
foundation.orbit.js or zepto.js within HTML.
.divider class is there to separate links in dropdown menu with thin horizontal border, .dl-horizontal lines
up the terms <dt> and descriptions <dd> in <dl> elements side-by-side, .dropdown creates a toggleable
menu that allows user to choose one value from predefined list.
w
.well adds a rounded border around an element with gray background color and some padding, .well-lg is
a large well i.e. for more padding, .well-sm is a small well with less padding.
.row class is for container for responsive columns, .small creates a lighter, secondary text in any heading,
.sr-only hides an element on all devices except for screen readers, .show class shows an element.
om
progress class is a container for progress bars, .progress-bar creates a progress bar, .progress-bar-success
creates a green progress bar and indicates success, .progress-bar-info shows light-blue progress bar
indicating information.
.c
.media aligns media objects like images or videos often used for comments in a blog post, .media-body
specifies the text that should appear next to media object, .media-list creates nested media lists, .media-
object indicates a media object
ul
50. Which shapes an image to a thumbnail?
.img-thumbnail shapes image to a thumbnail (borders), .img-rounded adds rounded crners to an image,
pa
.img-responsive makes an image responsive, .img-circle shapes an image to a circle, it is not supported in
IE8 and earlier versions
UNIT-IV
.re
1. What is a project?
The dictionary definitions put a clear emphasis on the project being a planned activity. A
project is a unique venture with a beginning and an end, conducted by people to meet
established goals within parameters of cost, schedule and quality
w
o It allows you to better structure and organize the tasks that need to be performed
o Well-developed approaches and tools are available for managing projects
o Easy-to-use software is available for scheduling and budgeting projects.
om
4. Define Feasibility Study.
It is based on an outline design of system requirements in terms of Input, Processes, Output,
Fields, Programs, and Procedures. This can be quantified in terms of volumes of data,
trends, frequency of updating, etc.
.c
Planning as a process involves the determination of future course of action, that is, why an
action, what action, how to take action, and when to take action. These why, what, how,
and when are related with different aspects of planning process.
ul
6. What are the phases in software development life cycle?
This investigates what the potential users and their managers and employers require as
features
and qualities of the new system.
9. What is management?
w
Management can be defined as all activities and tasks undertaken by one or more Persons
for the purpose of planning and controlling the activities of others in order to achieve
objectives or complete an activity that could not be achieved by others acting
w
independently.
10. What are the problems with software project from manager’s point of
view?(May/Jun2013)
www.rejinpaul.com
om
o
.c
o
o Estimate effort for each activity.
o Identify activity risks.
o Allocate resources.
ul
o Review / publicize plan9. Execute plan/ lower levels of planning.
• Risk Evaluation
13. Explain the steps in project planning with case studies example.
Define
• Project goal
w
• Project deliverables
• Project schedule
• Supporting plans
w
answer questions about projects, policies and programs, particularly about their
effectiveness and efficiency.
www.rejinpaul.com
om
nature of technical solutions that might consider.
.c
development project and all associated costs.
• TDEV = 3 ´ (PM)(0.33+0.2*(B-1.01))
ul
(B is 1 for the early prototyping model). This computation predicts the nominal
schedule for the project.
o
pa
17. What are the steps involved in Activity Planning?
Ensure that the appropriate resources will be available precisely when required.
o Avoid different activities competing for the same resources at the same time.
o Produce a detailed schedules showing which staff carry out each activity.
jin
o Produce a timed cash flow forecast.
This involves identifying the main tasks required to complete a project and then breaking
each of
these down into set of lower-level tasks.
Control uses the information supplied by the monitoring techniques in order to bring
project actual results in line with stated project performance standards.
w
Striking visual indication of those activities that are not progressing to schedule the more
the slip line bends, the greater variation from the plan.
One of the simplest and oldest techniques project progress is the Gantt -chart this is
essentially an
activity bar chart indicating scheduled activity dates and duration frequently augmented
with activity floats.
om
22. What are the services to be provided in contracts?
o Training
o Documentation
o Installation
o Conversion of existing files
.c
o Maintenance agreements
o Transitional insurance agreements.
ul
23. What are the objectives of managing people and organizing teams?(Apr2014)
o
o
pa
Identify some of the factors that influence people’s behavior in project.
Select and induct new staff into a project.
o Increase staff motivation.
o Improve group working.
o Use the most appropriate leadership styles.
jin
24. How to becoming a team?
o Forming- The members of the groups get to know each other and try to set up
.re
o
w
UNIT-V
w
1. Which rules you should have to follow for WordPress plugin development?
www.rejinpaul.com
om
b. Edit the Codex (documentation)
c. Help in the Forums
3. In which case we recommend WordPress to our client?
.c
b. If a site wants complex or innovative e-commerce
ul
c. In the case of enterprise intranet solution
4. Which steps you should can take if your WordPress file is hacked?
pa
a. Install security plugins like WP security
a. Category
.re
b. Tag
c. Link Category
d. Post-Formats
w
30,000
w
8. What if there is no text between the tags or if a text was omitted by mistake? Will it affect
the display of the HTML file?
If there is no text between the tags, then there is nothing to format. Therefore no formatting will
om
appear. Some tags, especially tags without a closing tag like the <img> tag, do not require any
text between them
You can specify a border color using style sheets, but the colors for a table that does not use style
sheets will be the same as the text color.
.c
10. How do you create a link that will connect to another web page when clicked?
To create hyperlinks, or links that connect to another web page, use the href tag. The general
ul
format for this is: <a href=”site”>text</a>
Replace “site” with the actual page URL that is supposed to be linked to when the text is clicked
11. What other ways can be used to align images and wrap text?
pa
Tables can be used to position text and images. Another useful way to wrap text around an image
is to use style sheets
13. Explain array creation in Java script with example. (APRIL/MAY 2011)
.re
Array can be defined in three ways i. Using the array constructor directly in a call with no
argument. E.G: VAR ARY1=NEW ARRAY(); ARY1[0]=4; ARY1[1]=TRUE; ARY1[2]=”OK
The primary component is a scripting engine, which includes a Javascript interpreter as well as
core ECMAScript functionality that must be present regardless of the scripting environment.
w
Global object is named window as global variables declared by your program are actually stored
as properties of this object. All built-in and host objects are also stored as properties of global
object
www.rejinpaul.com
Built-in objects of JavaScript are STRING, NUMBER, BOOLEAN, DATE, MATH, REGEXP.
om
i. Number
ii. String
iii. Boolean
.c
iv. Null
v. Object
ul
vi. Undefined
pa
jin
.re
w
w
w