Chapter 1 INTRODUCTION

1.1 Web Development

Today, websites are efficient tool of communication within society. For example, when
people need information about a company or an organization, most of them will almost
instantaneously think of its website.
A website is a collection of Web pages, images, videos and other digital assets that is
hosted on one or several Web servers, usually accessible via the Internet, Mobile phone or
a LAN.
The pages of websites can usually be accessed from a common root URL called the
homepage, and usually reside on the same physical server. The URLs of the pages
organize them into a hierarchy, although the hyperlinks between them control how the
reader perceives the overall structure and how the traffic flows between the different parts
of the sites.
A website requires attractive design and proper arrangement of links and images, which
enables a browser to easily interpret and access the properties of the site. Hence it
provides the browser with adequate information and functionality about the organization,
community, network etc.

1.2 About the project

The aim of this report is to explain the process of designing and building a website.
The website is called Rabh Helping Hands and the URL (Uniform Resource Locator) is:
https://rabhhelpinghands.com.
The author of the website is monika vyas and it is based on content related to special kids
where I am proving the details like schools, doctors etc available for physically and
mentally challenged children it contains case study and images to document this.
The website was built by hand coding XHTML (Extensible Hypertext Markup Language)
and CSS (Cascading Style Sheets). Designing is done in HTML and CSS. The CMS

PAGE 1

(content management system) here used is Wordpress. The Rabh helping hands website
developed using PHP (preprocessor hypertext language) as the Front End and MYSQL as
the Back End

1.3About workplace
Next Big Technology (NBT) is a premium web development and web design firm since
2009. NBT always aims at infusion of latest technologies for advancements of website
development. As a website applications development company we know how a website
can take off with proper design, programming! NBT is based at Jaipur, Rajasthan,
India with a team of 35+ Professionals with assorted skill sets. NBT is formulated to
serve society by providing Web products and IT services. We provide a full range of web
services with expertise in Website Design, Website Development, Website Maintenance,
Website Redesign, Offshore Outsourcing, Ecommerce Web Development, CMS Web
Development etc.
The owner of the company is Mr. Amit Shukla. I worked under Mr. Ajay Sharma
Manager of the company.
Next Big Technology is a website designing, web development, Software Consulting,
specializing in creating custom web designing, web development commerce
development, web solutions, search engine optimization & social media marketing
solutions. We provide quality web design solutions and create professional websites with
fresh and innovative web design ideas. we offer includes website design, redesign, CMS
(Content Management System), CSS web design, open source ecommerce websites,
personal web pages, custom template design, open source shopping carts, blogs, custom
web design, website maintenance, seo (search engine optimization) and much more.
Next Big Technology has gained a reputation of delivering quality services by the time
critical solution and its just because of our dedicated team. We deal in web development,
software development, mobile application development like android based application, IPhone application, blackberry application and other mobile application development,

PAGE 2

search engine optimization and other IT Solutions. Each project is taken up as an

important assignment and each client is given top priority, Quality is the key without
compromising on the costs and in this process, we strive to create and add value to the
businesses.

1.4About work done

I worked under the team lead by Mr. Ajay Sharma. My work during the internship
initially was to make HTML and CSS templates, then I worked on few WordPress
themes, where I worked in languages like PHP, JavaScript, HTML and CSS. The
BootStrap, AJAX and JQuery were also used in some coding parts.
The main idea behind the internship was to gain knowledge in web services, so to gain
experience I worked on my own website so that I can take it further in future. The theme I
used for rabhheplinghands.com is fully customized and I have used some WordPress
plugins to give it some professional look. I used plugins for Contact page, Testimonial,
SEO, etc.
I am also working on other site named monikavyas.com, Here, I have used the one-page
theme named I am one. It already has templates in it, so you only need to customize it
with help of HTML and CSS. To make more changed in your website you need PHP and
JavaScript that was completely used in the website rabhhelpinghands.com.

PAGE 3

Chapter 2 Project Introduction

2.1 Introduction
This chapter explains the details about the website that was designed during the
internship. The reason to choose the topic that I have included in the website is to aware
people about the special kids.

2.2 About Project

The aim of this report is to explain the process of designing and building a website.
The website is called Rabh Helping Hands and the URL (Uniform Resource Locator) is:
https://rabhhelpinghands.com.
The author of the website is monika vyas and it is based on content related to special kids
where I am proving the details like schools, doctors etc available for physically and
mentally challenged children it contains case study and images to document this.
The website was built by hand coding XHTML (Extensible Hypertext Markup Language)
and CSS (Cascading Style Sheets). Designing is done in HTML and CSS. The CMS
(content management system) here used is WordPress. The Rabh helping hands website
developed using PHP (preprocessor hypertext language) as the Front End and MYSQL as
the Back End.
rabhhelpinghands.com
Features:

Slider with bootstrap

Menu using bootstrap
Ajax table with dropdown
Google map
Testimonial plugin
Contact page plugin
Login membership page
Blog page
Responsive site
Easy navigation
PAGE 4

 SEO plugin used YOAST

2.2.1 Construction
The author

was

tasked with

constructing the website using XHTML

and CSS.

The former was used for structure and the latter for the styling of the website. This
method not only reduces the overall page size, it also easier to edit and maintain.
HTML

(Hyper Text

Markup Language)

should be written

i.e.

all

tags

in

lower case, correct nesting of tags and all tags to be closed properly. By using XHTML in
conjunction with a linked style sheet, the author has adhered to the W3C recommendation
that websites should now be built this way.
The author has used the div tag, as opposed to tables, to structure his layout this results
in a drastic reduction in the amount of code used. For optimal visual effect, the author has
nested the div tags to achieve his desired layout. For instance, the container div (as its
name suggests)

contains

all

other divs.

Each

separate part of

the layout

is

enclosed within its own div.

The author has used the (unordered list) and (list item) tags to structure his navigation.
Contained within the li tag is the tag this is used for jumping to different pages within
the website and on the internet as a whole. A simple navigation would look similar to
the following piece of code:
o Home
o Contact Us
The author has used a linked stylesheet to style his code this completely separates
style from

structure.

This

method enables

the whole site to

be styled by

a single stylesheet. Thus, any changes made to the stylesheet are replicated throughout
the site,

therefore making it

easier to update

and edit.

Also,

the author

has

used a small amount of CSS inline (within the actual element on the XHTML page)

PAGE 5

to indicate which page the user is on. The rest of the navigation makes use of
a simple text colour rollover. The vertical navigation on the left of the page also makes
use of colour rollovers. However, a rollover image has also been used. This image is
a small chevron placed vertically to the left of the text. When a mouse pointer hovers
over the text,

the text changes

colour

and the image

is

swapped for

that of

a flashing chevron. This is achieved by setting the image as a background image within
the li for the link and positioning it to the left.

2.2.2 Coding
The whole website has been hand coded in XHTML and CSS, it is beneficial, not only
to the person who wrote the code, but also to anybody who looks at the code, to
have a layout to some degree. For the XHTML, the author has left aligned all elements
except for the navigation areas. In addition, author has left white space after the start
and at the end of a div resulting in a uniform appearance of the code. In the case of
the CSS, the author has grouped elements together i.e. layout, navigation and form area
it

has

clearly

marked these sections.

and quick to locate the many

the XHTML

document

different

the author

This

makes

sections

that

has

the code easy

make

inserted a

look

at

up the stylesheet.

In

comment

to

next

to

each

closing div tag to highlight which div it belongs to. This is useful (especially when
nesting divs) as the bottom of the page can end up having several closing div tags. In
the CSS document the author has highlighted each section with an appropriate comment
i.e. side navigation for the vertical navigation. Furthermore, in the case of workarounds,
the author has stated what that certain piece of code is for.

2.2.3 Compatibility
For

a website to be acceptable it

was

necessary

to check that

it

works

in

multiple browsers. The browsers tested were:

Internet Explorer 6
Mozilla Firefox 1.07

PAGE 6

chrome
Opera 8

The website works fine in all of the above browsers.

2.2.4 Design Issues

The following chapter discusses the issues surrounding the design of the website, issues
such as, accessibility and different display settings. This stage of the development process
is fundamental to the success of the finished website. The navigation is easy to
use and because the website has a standard design across all pages, the whole site is easy
to navigate around. The author has also included a contact page which will generate him
some feedback as

to how well

his

site has

been

designed.

Accessibility

Making the website accessible as well as aesthetically pleasing is quite hard to do.
The author has, she feels, managed to strike a balance between the two. For instance,
the navigation and links within pages have a tab index assigned to them and the contact
form specifies which language it is written in.

2.2.5 Display Settings

The website has been tested in various display settings ranging from 380 x 480 through
to 1400 x 1050 and works well in all of them

2.2.6 Image Design

It was decided by the author to keep the design of the images simple as it was the content
of

the images

that

she desired people to

see,

and she didnt

want

any

fancy decorative features distracting them. Image size Apart from the header all images
have the same width

as

the website. The images

each
in

other

this

is

the photo gallery

to

promote uniformity
have their

across

own dimensions

and are discussed in a later paragraph.

PAGE 7

2.2.7 Compression
Not including the animated GIF, all the images used in the website are photographs,
therefore the best format for them is JPG. The author has kept them at a high resolution
as

she didnt

want

the images

she still managed to achieve a small

to

lose any of

their

clarity however,

file size

by

optimizing

them

in

Macromedia Fireworks.
Photo gallery demonstrates the ability to make images appear when a user positions
a mouse over a smaller image.
property

in

The photo gallery is possible thanks to the visibility

the attached style sheet.

to hover over a thumbnail

to

reveal

The photo gallery

a larger version

of

enables

the picture.

All

a user
small

thumbnail images are of the same size, and the larger images are of a similar size to each
other. Copyright All images used in the website are the authors own.

2.2.8 Search Engine Optimization

An important element of any website that is built today is that it is visible by the different
search engines available for users to search on. The author has built his pages in a search
engine friendly manner CSS enabled him to do this effectively. Other than the CSS
author has used the plugins available in WordPress to give it the visibility over search
engine. The author has included meta tags in every page of his website enabling any
search engines to index the site better. Meta tags such as: Keywords Description
Robots In addition to having keywords in the meta tag, the author has placed keywords
throughout his website. All keywords, whether they be in the main text or meta tag,
are relevant to the page that they are on.

2.2.9 External links

The website has one external link to the Facebook page of rabh helping hands. It includes
the links to schools and some government sites to provide the information related to
special children.

PAGE 8

2.2.10 Validation
The website is valid XHTML and was validated via the W3C website. The CSS did not
validate as according to the W3C website it could not be parsed correctly. All the forms
are validated including contact us form and login form.

2.2.11 Plugins
The author has used the plugins for the forms and other functions to make the site user
friendly as well as easy to maintain for the developer. It includes the plugins for FAQ
(frequently asked questions) page, contact us page, testimonials, login page etc.
Yoast is a plugin used to provide search engine optimization to the site. Some more
helpful plugin are also used to maintain the members information.

2.3 Scope
Recently the website has content related to Special kids who are suffering with cerebral
palsy, autism. The main idea behind making the website is make available the
information about cerebral palsy.

2.4 Features

Slider with bootstrap

Menu using bootstrap
Ajax table with dropdown
Google map
Testimonial plugin
Contact page plugin
Login membership page
Blog page
Responsive site
Easy navigation
SEO plugin used YOAST

PAGE 9

Chapter 3 Content Management System

3.1 Introduction- WordPress

WordPress is an online, open source website creation tool written in PHP. But in nongeek speak, its probably the easiest and most powerful blogging and website content
management system (or CMS) in existence today

PAGE 10

The CMS I am using for my project is WordPress. I have used both customized and
WordPress theme. WordPress is definitely the world's most popular CMS. The script is in
its roots more of a blog than a typical CMS. For a while now it's been modernized and it
got thousands of plugins, what made it more CMS-like.
The script as an Open Source is the first choice for most bloggers, but it can also be
successfully used for designing simple websites.

3.2 Advantages
Easy, easy, easy ...
WordPress does not require PHP nor HTML knowledge unlike Drupal, Joomla or Typo3.
A preinstalled plugin and template function allows them to be installed very easily. All
you need to do is to choose a plugin or a template and click on it to install.
It's good choice for beginners.

Community
To have a useful support, there must be a large community of users, who will be a part of
e.g. a discussion board.

Plugins
The script has over dozen thousands of plugins available on its website. They are the
reason WordPress is considered a CMS, not only a blogging script. Strong majority of the
plugins is available for free.

PAGE 11

Templates
On the scripts homepage you can view thousands of graphics templates, that can change
your website's look. You can find there both free and paid templates. The paid ones are
often more advanced as well as more interesting.

Menu management
WordPress menu management has extended functionalities, that can be modified to
include categories, pages, etc.

Non-standard fields
You can easily add fields to forms by yourself or using plugins. It will allow your blog or
subpages to have additional labels, categories or descriptions.

3.3 Disadvantages
Modification requires knowledge of PHP
Operations like removing a date field requires some understanding of PHP language. It is
the case for most of such modifications.

Graphics modification requires knowledge of CSS and HTML

Although there are plenty templates available on the homepage, most of them are very
alike. To create a unique look, you need to know CSS and HTML.

PAGE 12

Plugins and efficiency

To compete with Joomla! or Drupal, WordPress needs plenty of plugins to be installed.
Unfortunately, these plugins influence the script's efficiency and not in a good way.
Another problem arises when you need to choose a plugin for a specific functionality.
Among all the thousands of plugins, most of them have their clones. It means, that any
given functionality can be added by several different plugins created by different authors.
Sometimes choosing the right one may take quite some time.

PHP security
The script is not protected as well as other applications. It all depends on how sesitive is
the additional content of your page.

Tables and graphics formatting

Modifying tables or graphics format can be more complicated than in other applications
like Quick. CMS or Joomla.

SQL queries
Queries can be complex since all additional non-standard fields that make WordPress a
CMS, require additional syntax.

PAGE 13

Conclusions
WordPress is a very good script to create a simple website. It is one of the simplest to use
(definitely not simpler than Quick. CMS though) of all solutions available on the internet.
It's very good choose for a beginner's. Advanced users with advanced needs would have
to install many plugins to have what is a standard for Joomla or Drupal.

Chapter 4 LANGUAGE USED PHP

4.1 Introduction
PHP: Hypertext Pre-processor is a widely used, general-purpose scripting language
that was initially designed for web development to produce dynamic web pages. For this
purpose, PHP code is embedded into the HTML source document and interpreted by a
web server with a PHP processor module, which generates the web page document. As a
general-purpose programming language, PHP code is processed by an interpreter
application in command-line mode performing desired operating system operations and
producing program output on its standard output channel. It may also function as a
graphical application. PHP is available as a processor for most modern web servers and
as a standalone interpreter on most operating systems and computing platforms.
PHP was originally created by Rasmus Lerdorf in 1995 and has been in continuous
development ever since. The main implementation of PHP is now produced by the PHP
Group and serves as the de facto standard for PHP as there is no formal specification.
PHP is free software released under the PHP License.

4.2 History
PHP originally stood for personal home page. Its development began in 1994 when the
Danish/Greenlandic programmer Rasmus Lerdorf initially created a set of Perl scripts he

PAGE 14

called 'Personal Home Page Tools' to maintain his personal homepage, including tasks
such as displaying his resume and recording how much traffic his page was receiving.
He rewrote these scripts as C programming language Common Gateway Interface (CGI)
binaries, extending them to add the ability to work with web forms and to communicate
with databases and called this implementation 'Personal Home Page/Forms Interpreter' or
PHP/FI. PHP/FI could be used to build simple, dynamic web applications. Lerdorf
released PHP/FI as 'Personal Home Page Tools (PHP Tools) version 1.0' publicly on June
8, 1995, to accelerate bug location and improve the code. This release already had the
basic functionality that PHP has today. This included Perl-like variables, form handling,
and the ability to embed HTML. The syntax was similar to Perl but was more limited and
simpler, although less consistent. A development team began to form and, after months of
work and beta testing, officially released PHP/FI 2 in November 1997.
Zeev Suraski and Andi Gutmans, two Israeli developers at the Technion IIT, rewrote the
parser in 1997 and formed the base of PHP 3, changing the language's name to the
recursive initialism PHP: Hypertext Pre-processor. Afterwards, public testing of PHP 3
began, and the official launch came in June 1998. Suraski and Gutmans then started a
new rewrite of PHP's core, producing the Zend Engine in 1999. They also founded Zend
Technologies in Ramat Gan, Israel.php
On May 22, 2000, PHP 4, powered by the Zend Engine 1.0, was released. As of August
2008 this branch is up to version 4.4.9. PHP 4 is no longer under development nor will
any security updates be released.
On July 13, 2004, PHP 5 was released, powered by the new Zend Engine II. PHP 5
included new features such as improved support for object-oriented programming, the
PHP Data Objects (PDO) extension (which defines a lightweight and consistent interface
for accessing databases), and numerous performance enhancements. In 2008 PHP 5
became the only stable version under development. Late static binding had been missing
from PHP and was added in version 5.3.
A new major version has been under development alongside PHP 5 for several years.
This version was originally planned to be released as PHP 6 as a result of its significant

PAGE 15

changes, which included plans for full Unicode support. However, Unicode support took
developers much longer to implement than originally thought, and the decision was made
in March 2010 to move the project to a branch, with features still under development
moved to a trunk.
Many high-profile open-source projects ceased to support PHP 4 in new code as of
February 5, 2008, because of the GoPHP5 initiative, provided by a consortium of PHP
developers promoting the transition from PHP 4 to PHP 5.
PHP currently does not have native support for Unicode or multibit strings Unicode
support is under development for a future version of PHP and will allow strings as well as
class, method, and function names to contain non-ASCII characters.
PHP interpreters are available on both 32-bit and 64-bit operating systems, but on
Microsoft Windows the only official distribution is a 32-bit implementation, requiring
Windows 32-bit compatibility mode while using Internet Information Services (IIS) on a
64-bit Windows platform. As of PHP 5.3.0, experimental 64-bit versions are available for
MS Windows.

4.3 Licensing
PHP is free software released under the PHP License, which insists that:

4. Products derived from this software may not be called "PHP", nor
may "PHP" appear in their name, without prior written permission
from group@php.net. You may indicate that your software works in
conjunction with PHP by saying "Foo for PHP" instead of calling
it "PHP Foo" or "phpfoo"

PAGE 16

Chapter 5 Database MySQL Serve

5.1 Introduction
MySQL is a relational database management system (RDBMS) that runs as a server
providing multi-user access to number of databases. MySQL is officially pronounced
/maskjul/ ("My S-Q-L"), but is often also pronounced /masi kwl/ ("My Sequel").
It is named for original developer Michael Widenius' daughter My.
The MySQL development project has made its source code available under the terms of
the GNU General Public License, as well as under a variety of proprietary agreements.
MySQL was owned and sponsored by a single for-profit firm, the Swedish company
MySQL AB, now owned by Oracle Corporation.
Members of the MySQL community have created several forks (variations) such as
Drizzle, OurDelta, Percona Server, and MariaDB. All of these forks were in progress
before the Oracle acquisition (Drizzle was announced 8 months before the Sun
acquisition).
Free-software projects that require a full-featured database management system often use
MySQL. Such projects include (for example) WordPress, phpBB, Drupal and other
software built on the LAMP software stack. MySQL is also used in many high-profile,
large-scale World Wide Web products including Wikipedia, Google and Facebook.
MySQL is an open source, SQL Relational Database Management System (RDBMS) that
is free for many uses. However, MySQL found a broad, enthusiastic user base for its

PAGE 17

liberal licensing terms, perky performance, and ease of use. Its acceptance was aided in
part by the wide variety of other technologies such as PHP, Java, Perl, Python, and the
like that have encouraged its use through stable, well-documented modules and
extensions. MySQL has not failed to reward the loyalty of these users with the addition of
both sub selects and foreign keys.

References for the Graph

B.3. Changes in Release 3.23.x (Lifecycle Support Ended)
Fig 5.1 Version Development
PAGE 18

http://dev.mysql.com/doc/refman/4.1/en/news-3-23-x.html
B.2. Changes in Release 4.0.x (Lifecycle Support Ended)
http://dev.mysql.com/doc/refman/4.1/en/news-4-0-x.html
C.1. Changes in Release 5.0.x (Production)
http://dev.mysql.com/doc/refman/5.0/en/news-5-0-x.html#news-5-0-x
C.1. Changes in Release 5.5.x (Development)
http://dev.mysql.com/doc/refman/5.5/en/news-5-5-x.html#news-5-5-x
Databases in general are useful, arguably the most consistently useful family of software
productsthe killer product of modern computing. Like many competing products,
both free and commercial, MySQL isnt a database until you give it some structure and
form. You might think of this as the difference between a database and an RDBMS (that
is, an RDBMS plus user requirement equals a database).
A database adds another layer of security if used with its own password or passwords.
To create a database from PHP, the user of your scripts will need to have full
CREATE/DROP privileges on MySQL. That means anyone who can get hold of your
scripts can potentially blow away all your databases and their contents with the greatest
of ease. This is not such a great idea from a security standpoint. Furthermore, most
external Web hosts very sensibly wont let you do it on their servers anyway.
MySQL is one of the easiest databases to administer on all platforms and because its so
lightweight, it can run on even low powered PCs. Thus, PHP developers have long found
it convenient to throw a copy of MySQL on client machineseven on laptopsfor a
complete local Web development environment. Many developers learn to run their own
MySQL installations so they can work at home or on the road, using the OS of their
choice. Work teams also sometimes prefer developers to each use a separate local
MySQL installation, so that there is no single point of failure that could affect an entire

PAGE 19

development group. And many PHP-based Open Source projects assume complete
familiarity with MySQL database administration for all developers.
Unlike some other databases, it should be well within the capability of any PHP
developer to self-administer a MySQL database Many PHP-based application packages,
both commercial and Open Source, also require familiarity with a MySQL database to
install, run, and debug the Web app.

5.2 Support and Licensing

MySQL offers support via their MySQL Enterprise product, including a 24/7 service with
30-minute response time. The support team has direct access to the developers as
necessary to handle problems. In addition, it hosts forums and mailing lists, employees
and other users are often available in several IRC channels providing assistance.
Buyers of MySQL Enterprise have access to binaries and software certified for their
particular operating system, and access to monthly binary updates with the latest bugfixes. Several levels of Enterprise membership are available, with varying response times
and features ranging from how to and emergency support through server performance
tuning and system architecture advice. The MySQL Network Monitoring and Advisory
Service monitoring tool for database servers is available only to MySQL Enterprise
customers.
Potential users can install MySQL Server as free software under the GNU General Public
License (GPL), and the MySQL Enterprise subscriptions include a GPL version of the
server, with a traditional proprietary version available on request at no additional cost for
cases where the intended use is incompatible with the GPL.
Both the MySQL server software itself and the client libraries use dual-licensing
distribution. Users may choose the GPL, which MySQL has extended with a FLOSS
License Exception. It allows Software licensed under other OSI-compliant open source
licenses, which are not compatible to the GPL, to link against the MySQL client libraries.

PAGE 20

Customers that do not wish to follow the terms of the GPL may purchase a proprietary
license.
Like many open-source programs, MySQL has trademarked its name, which others may
use only with the trademark holder's permission.

5.3 Why PHP and MySQL?

The fourth quarter of 1998 initiated a period of explosive growth for PHP, as all open
source technologies enjoyed massive publicity. In October 1998, according to the best
guess, just over 100,000 unique domains used PHP in some way.
PHP has long nodded to the object programming model with functions that allow object
programmers to pull out results and information in a way familiar to them. These efforts
still fell short of the ideal for many programmers, however, and efforts to force PHP to
build in fully object-oriented systems often yielded unintended results and hurt
performance. PHP5s newly rebuilt object model brings PHP more in line with other
object-oriented languages such as Java and C++, offering support for features such as
overloading, interfaces, private member variables and methods, and other standard OOP
constructions.
PHP costs you nothing. MySQL is open-source licensed for many uses it is not and has
never been primarily community-developed software. PHP is easy to learn, compared to
the other ways to achieve similar functionality.
PHP and MySQL run native on every popular flavour of UNIX (including Mac OS X)
and Windows. A huge percentage of the worlds HTTP servers run on one of these two
classes of operating systems. PHP is compatible with the three leading Web servers:

PAGE 21

Apache HTTP Server for UNIX and Windows, Microsoft Internet Information Server,
and Netscape Enterprise Server (a.k.a. iPlanet Server).
PHP is a real programming language. PHP is pleasingly zippy in its execution, especially
when compiled as an Apache module on the UNIX side. The MySQL server, once started,
executes even very complex queries with huge result sets in record-setting time.

Chapter 6: HTTP Server Apache HTTP Server

6.1 Introduction
The Apache HTTP Server, commonly referred to as Apache (pronounced /pti/), is
web server software notable for playing a key role in the initial growth of the World Wide
Web. In 2009 it became the first web server software to surpass the 100 million web site
milestone. Apache was the first viable alternative to the Netscape Communications
Corporation web server (currently known as Oracle iPlanet Web Server), and has since
evolved to rival other Unix-based web servers in terms of functionality and performance.
The majority of web servers using Apache run a Unix-like operating system.[citation
needed]
Apache is developed and maintained by an open community of developers under the
auspices of the Apache Software Foundation. The application is available for a wide
variety of operating systems, including UNIX, GNU, FreeBSD, Linux, Solaris, Novell
NetWare, Mac OS X, Microsoft Windows, OS/2, TPF, and eComStation. Released under
the Apache License, Apache is characterized as open-source software.

PAGE 22

Since April 1996 Apache has been the most popular HTTP server software in use. As of
February 2010 Apache served over 54.46% of all websites and over 66% of the million
busiest.

6.2 History
The pre-release versions (before 0.6.2) of the Apache web server software were created
by Robert McCool, who was heavily involved with the National Centre for
Supercomputing Applications web server, known simply as NCSA HTTPd. When
McCool left NCSA in mid-1994, the development of httpd stalled, leaving a variety of
patches for improvements circulating through e-mails. These patches were provided by a
number of other developers besides McCool: Brian Behlendorf, Roy Fielding, Rob
Hartill, David Robinson, Cliff Skolnick, Randy Terbush, Robert S. Thau, Andrew Wilson,
Eric Hagberg, Frank Peters and Nicolas Pioch, and they thus helped to form the original
"Apache Group". There have been two explanations of the project's name. According to
the Apache Foundation, the name was chosen out of respect for the Native American tribe
of Apache (Ind), well-known for their endurance and their skills in warfare. However,
the original FAQ on the Apache Server project's website, from 1996 to 2001, claimed that
"The result after combining [the NCSA httpd patches] was a patchy server. The first
explanation was supported at an Apache Conference and in an interview in 2000 by Brian
Behlendorf, who said that the name connoted "Take no prisoners. Be kind of aggressive
and kick some ass" Behlendorf then contradicted this in a 2007 interview, stating that
"The Apache server isn't named in honor of Geronimo's tribe" but that so many revisions
were sent in that "the group called it 'a patchy Web server'". Both explanations are
probably appropriate.
The system operates through the work of volunteers who specialize in certain areas of
coding. The Apache Group (AG) emphasizes decentralization and has a low
interdependency in the tasks they do. The AG is a multinational server, having developers
located in U.S., Britain, Canada, Germany, and Italy. Although Apache collaborates as a

PAGE 23

group, the work is done by individuals. Their decisions are a result of e-mail and quorum
voting system.
The very first version (0.6.2) of publicly distributed Apache was released in April 1995. A
new modular server architecture was written under the codename Shambhala, which
became version 0.8.0 released in mid July. The 1.0 version was released on December 1,
1995.
Version 2 of the Apache server was a substantial re-write of much of the Apache 1.x code,
with a strong focus on further modularization and the development of a portability layer,
the Apache Portable Runtime. The Apache 2.x core has several major enhancements over
Apache 1.x. These include UNIX threading, better support for non-Unix platforms (such
as Microsoft Windows), a new Apache API, and IPv6 support. The first alpha release of
Apache 2 was in March 2000, with the first general availability release on April 6, 2002.
Version 2.2 introduced a more flexible authorization API. It also features improved cache
modules and proxy modules.

6.3 Licensing
The software license under which software from the Apache Foundation is distributed is a
distinctive part of the Apache HTTP Server's history and presence in the open-source
software community. The Apache License allows for the distribution of both open and
closed source derivations of the source code.
The Free Software Foundation does not consider the Apache License to be compatible
with version 2 of the GNU General Public License (GPL) in that software licensed under
the Apache License cannot be integrated with software that is distributed under the GPL:

This is a free software license but it is incompatible with the GPL. The Apache Software
License is incompatible with the GPL because it has a specific requirement that is not in
the GPL: it has certain patent termination cases that the GPL does not require. We don't

PAGE 24

think those patent termination cases are inherently a bad idea, but nonetheless they are
incompatible with the GNU GPL.

However, version 3 of the GPL includes a provision (Section 7e) which allows it to be
compatible with licenses that have patent retaliation clauses, including the Apache
License. The name Apache is a registered trademark and may only be used with the
trademark holder's express permission.

Chapter 7: Java Scripting and JQuery

7.1 Introduction
JavaScript is a prototype-based scripting language that is dynamic, weakly typed and
has first-class functions. It is a multi-paradigm language, supporting object, imperative,
and functional programming styles.
JavaScript was formalized in the ECMAScript language standard and is primarily used in
the form of client-side JavaScript, implemented as part of a Web browser in order to
provide

enhanced user

interfaces and

dynamic websites.

This

enables programmatic access to computational objects within a host environment.

JavaScript's

use

in applications outside

Web

pages

for

example

in PDF documents, site-specific browsers, and desktop widgets is also significant.

PAGE 25

Newer and faster JavaScript VMs and frameworks built upon them (notably Node.js)
have also increased the popularity of JavaScript for server-side web applications.
JavaScript uses syntax influenced by that of C. JavaScript copies many names and
naming conventions from Java, but the two languages are otherwise unrelated and have
very different semantics. The key design principles within JavaScript are taken from
the self and Scheme programming languages.

7.2 History
JavaScript was originally developed by Brendan Eich of Netscape under the
name Mocha, which was later renamed to LiveScript, and finally to JavaScript mainly
because it was more influenced by the Java programming language. LiveScript was the
official name for the language when it first shipped in beta releases of Netscape
Navigator 2.0 in September 1995, but it was renamed JavaScript in a joint announcement
with Sun Microsystems on December 4, 1995, when it was deployed in the Netscape
browser version 2.0B3.
The change of name from Live Script to JavaScript roughly coincided with Netscape
adding support for Java technology in its Netscape Navigator web browser. The final
choice of name caused confusion, giving the impression that the language was a spin-off
of the Java programming language, and the choice has been characterized by many as a
marketing ploy by Netscape to give JavaScript the cachet of what was then the hot new
web programming language. It has also been claimed that the language's name is the
result of a co-marketing deal between Netscape and Sun, in exchange for Netscape
bundling Sun's Java runtime with its then-dominant browser.
JavaScript very quickly gained widespread success as a client-side scripting language for
web pages. As a consequence, Microsoft named its implementation of JScript to avoid
trademark issues. JScript added new date methods to fix the Y2K-problematic methods in

PAGE 26

JavaScript, which were based on Java'sjava.util.Date class. JScript was included

in Internet Explorer 3.0, released in August 1996.
In November 1996, Netscape announced that it had submitted JavaScript to Ecma
International for consideration as an industry standard, and subsequent work resulted in
the standardized version named ECMAScript.
JavaScript has become one of the most popular programming languages on the web.
Initially, however, many professional programmers denigrated the language because its
target audience was web authors and other such "amateurs", among other reasons. The
advent of Ajax returned JavaScript to the spotlight and brought more professional
programming attention. The result was a proliferation of comprehensive frameworks and
libraries, improved JavaScript programming practices, and increased usage of JavaScript
outside of web browsers, as seen by the proliferation of server-side JavaScript platforms.
In January 2009, the CommonJS project was founded with the goal of specifying a
common standard library mainly for JavaScript development outside the browser.

7.3 Features
The following features are common to all conforming ECMAScript implementations,
unless explicitly specified otherwise.

7.3.1 Imperative and structured

PAGE 27

JavaScript

supports

much

of

the structured

programming syntax

from C (e.g., if statements, while loops, switch statements, etc.). One partial exception
is scoping: C-style block-level scoping is not supported (instead, JavaScript has functionlevel

scoping).

JavaScript

1.7,

Like

C,

the let keyword.

however,

supports

JavaScript

block-level
makes

scoping

with

distinction

between expressionsand statements. One syntactic difference from C is automatic

semicolon insertion, in which the semicolons that terminate statements can be omitted.

7.3.2 Dynamic
dynamic typing
As in most scripting languages, types are associated with values, not with variables. For
example, a variable x could be bound to a number, then later rebound to a string.
JavaScript supports various ways to test the type of an object, including duck typing.

object based
JavaScript is almost entirely object-based. JavaScript objects are associative arrays,
augmented with prototypes (see below). Object property names are string
keys: obj.x = 10 andobj['x'] = 10 are equivalent, the dot notation being syntactic sugar.
Properties and their values can be added, changed, or deleted at run-time. Most properties
of an object (and those on its prototype inheritance chain) can be enumerated using
a for...in loop.

JavaScript

has

small

number

of

built-in

objects

such

as Function and Date.

run-time evaluation
JavaScript includes an eval function that can execute statements provided as strings at
run-time.

PAGE 28

7.3.3 Functional
First-class functions
Functions are first-class they are objects themselves. As such, they have properties and
methods, such as length and call () and they can be assigned to variables, passed as
arguments,return-ed by other functions, and manipulated like any other object. Any
reference to a function allows it to be invoked using the () operator.

Nested functions
"Inner" or "nested" functions are functions defined within another function. They are
created each time the outer function is invoked. In addition to that, the scope of the outer
function, including any constants, local variables and argument values, become part of
the internal state of each inner function object, even after execution of the outer function
concludes.

Closures
JavaScript allows nested functions to be created, with the lexical scope in force at their
definition, and has a () operator to invoke them now or later. This combination of code
that can be executed outside the scope in which it is defined, with its own scope to use
during that execution, is called a closure in computer science.

7.3.4 Prototype-based
Prototypes
JavaScript uses prototypes instead of classes for inheritance. It is possible to simulate
many class-based features with prototypes in JavaScript.

Functions as object constructors

Functions double as object constructors along with their typical role. Prefixing a function
call with new creates a new object and calls that function with its local this keyword

PAGE 29

bound to that object for that invocation. The constructor's prototype property determines
the object used for the new object's internal prototype. JavaScript's built-in constructors,
such as Array, also have prototypes that can be modified.

Functions as methods
Unlike many object-oriented languages, there is no distinction between a function
definition and a method definition. Rather, the distinction occurs during function calling
a function can be called as a method. When a function is called as a method of an object,
the function's local this keyword is bound to that object for that invocation.

7.3.5 Miscellaneous
Run-time environment
JavaScript typically relies on a run-time environment (e.g. in a web browser) to provide
objects and methods by which scripts can interact with "the outside world". In fact, it
relies on the environment to provide the ability to include/import scripts
(e.g. HTML <script> elements). (This is not a language feature per se, but it is common
in most JavaScript implementations.)

Variadic functions
An indefinite number of parameters can be passed to a function. The function can access
them through formal parameters and also through the local arguments object.

Array and object literals

Like many scripting languages, arrays and objects (associative arrays in other languages)
can each be created with succinct shortcut syntax. In fact, these literals form the basis of
the JSONdata format.

Regular expressions

PAGE 30

JavaScript also supports regular expressions in a manner similar to Perl, which provide a
concise and powerful syntax for text manipulation that is more sophisticated than the
built-in string functions.

7.4 Use in web pages

The most common use of JavaScript is to write functions that are embedded in or
included from HTML pages and that interact with the Document Object Model (DOM) of
the page. Some simple examples of this usage are:

Opening or popping up a new window with programmatic control over the size,
position, and attributes of the new window (e.g. whether the menus, toolbars, etc., are
visible).

Validating input values of a web form to make sure that they are acceptable before
being submitted to the server.

Changing images as the mouse cursor moves over them: This effect is often used
to draw the user's attention to important links displayed as graphical elements.

Transmitting information about the user's reading habits and browsing activities to
various

websites.

Web

pages

frequently

do

this

for web

analytics, ad

tracking, personalization or other purposes.

Because JavaScript code can run locally in a user's browser (rather than on a remote
server), the browser can respond to user actions quickly, making an application more
responsive. Furthermore, JavaScript code can detect user actions which HTML alone
cannot, such as individual keystrokes. Applications such as Gmail take advantage of this:
much of the user-interface logic is written in JavaScript, and JavaScript dispatches
requests for information (such as the content of an e-mail message) to the server. The
wider trend of Ajax programming similarly exploits this strength. A JavaScript

PAGE 31

engine (also

known

as JavaScript

interpreter or JavaScript

implementation)

is

an interpreter that interprets JavaScript source code and executes the script accordingly.
The first JavaScript engine was created by Brendan Eich at Netscape Communications
Corporation,

for

the Netscape

Navigator web

browser.

The

engine,

code-

named SpiderMonkey, is implemented in C. It has since been updated (in JavaScript 1.5)
to conform to ECMA-262 Edition 3. The Rhino engine, created primarily by Norris Boyd
(formerly of Netscape now at Google) is a JavaScript implementation in Java. Rhino,
like SpiderMonkey, is ECMA-262 Edition 3 compliant.
A web browser is by far the most common host environment for JavaScript. Web
browsers typically use the public API to create "host objects" responsible for reflecting
the Document Object Model (DOM) into JavaScript. The web server is another common
application of the engine. A JavaScript webserver would expose host objects representing
an HTTP request and response objects, which a JavaScript program could then
manipulate to dynamically generate web pages.
Because JavaScript is the only language that the most popular browsers share support for,
it has become a target language for many frameworks in other languages, even though
JavaScript was never intended to be such a language. Despite the performance limitations
inherent to its dynamic nature, the increasing speed of JavaScript engines has made the
language a surprisingly feasible compilation target.

7.5 Versions
The following table is based on a history compilation forum post, JQuery author's blog
post, and Microsoft's JScript version information webpage.

Versi Release
on

date

Equivalent to

Netscape Mozilla Internet

Navigator Firefox Explorer

Opera Safari

Google
Chrome

PAGE 32

1.0

1.1

1.2

1.3

March

2.0

1996

August

3.0

3.0

1996

June 1997

4.0-4.05

October

ECMA-262 1st +

1998

2nd edition

4.06-4.7x

4.0

Netscape

1.4

Server

5.5
(JScript
5.5),
1.5

November ECMA-262
2000

3rd

edition

6 (JScript
6.0

1.0

5.6),
7 (JScript

6.0

3.0-5

1.010.0.666

5.7),
8 (JScript
5.8)

1.6

November
2005

1.5 + array extras

+ array and string

1.5

generics + E4X

PAGE 33

1.7

1.6 + Pythonic

October

generators

2006

2.0

iterators + let

1.7
1.8

+ generator

June 2008 expressions + exp

3.0

11.50

ression closures

1.8
1.8.1

+ native

JSON support

3.5

minor updates

1.8.2

1.8.5

June

22, 1.8.1

2009

July
2010

minor

updates

27,

3.6

1.8.2
+ ECMAScript 5

11.60

compliance

Chapter 8: XHTML

8.1 Introduction
PAGE 34

XHTML (extensible Hypertext Markup Language) is a family of XML markup

languages that mirror or extend versions of the widely-used Hypertext Markup
Language (HTML), the language in which web pages are written.
While HTML (prior to HTML5) was defined as an application of Standard Generalized
Markup Language (SGML), a very flexible markup language framework, XHTML is an
application of XML, a more restrictive subset of SGML. Because XHTML documents
need to be well-formed, they can be parsed using standard XML parsersunlike HTML,
which requires a lenient HTML-specific parser.
XHTML 1.0 became a World Wide Web Consortium (W3C) Recommendation on
January 26, 2000. XHTML 1.1 became a W3C Recommendation on May 31,
2001. XHTML5 is undergoing development as of September 2009, as part of
the HTML5 specification.

8.2 Overview
XHTML 1.0 is "a reformulation of the three HTML 4 document types as applications of
XML 1.0". The World Wide Web Consortium (W3C) also continues to maintain the
HTML 4.01 Recommendation, and the specifications for HTML5 and XHTML5 are
being actively developed. In the current XHTML 1.0 Recommendation document, as
published and revised to August 2002, the W3C commented that, "The XHTML family is
the next step in the evolution of the Internet. By migrating to XHTML today, content
developers can enter the XML world with all of its attendant benefits, while still
remaining confident in their content's backward and future compatibility."
However,

in

2004,

the Web

Hypertext

Application

Technology

Working

Group (WHATWG) formed, independently of the W3C, to work on advancing ordinary

HTML not based on XHTML. The WHATWG eventually began working on a standard
that supported both XML and non-XML serializations, HTML5, in parallel to W3C

PAGE 35

standards such as XHTML 2. In 2007, the W3C's HTML working group voted to
officially recognize HTML5 and work on it as the next-generated HTML standard. In
2009, the W3C allowed the XHTML 2 Working Group's charter to expire, acknowledging
that HTML5 would be the sole next-generation HTML standard, including both XML and
non-XML serializations. Of the two serializations, the W3C suggests that most authors
use the HTML syntax, rather than the XHTML syntax.

8.3 Motivation
XHTML

was

developed

to

make

HTML

more extensible and

increase interoperability with other data formats. HTML 4 was ostensibly an application
of Standard (SGML) however the specification for SGML was complex, and neither web
browsers nor the HTML 4 Recommendation were fully conformant to it. The XML
standard, approved in 1998, provided a simpler data format closer in simplicity to HTML
4. By shifting to an XML format, it was hoped HTML would become compatible with
common XML tools. servers and proxies would be able to transform content, as
necessary, for constrained devices such as mobile phones. By utilizing namespaces,
XHTML documents could provide extensibility by including fragments from other XMLbased languages such as Scalable Vector Graphics and MathML. Finally, the renewed
work would provide an opportunity to divide HTML into reusable components (XHTML
Modularization) and clean up untidy parts of the language.

8.4 Relationship to HTML

There are various differences between XHTML and HTML. The Document Object
Model is a tree structure that represents the page internally in applications, and XHTML
and HTML are two different ways of representing that in markup (serializations). Both
are less expressive than the DOM (for example, "--" may be placed in comments in the
DOM, but cannot be represented in a comment in either XHTML or HTML), and

PAGE 36

generally XHTML's XML syntax is a little more expressive than HTML (for example,
arbitrary namespaces are not allowed in HTML). So, firstly one source of differences is
immediate: XHTML uses an XML syntax, while HTML uses a pseudo-SGML syntax
(officially SGML for HTML 4 and under, but never in practice, and standardised away
from SGML in HTML5). Secondly however, because the expressible contents of the
DOM in syntax are slightly different, there are some changes in actual behavior between
the two models.
Firstly then, syntax differences:

Broadly, the XML rules require that all elements be closed, either by a separate
closing tag or using self closing syntax (e.g. <br />), while HTML syntax permits
some elements to be unclosed because either they are always empty (e.g. <input>) or
their end can be determined implicitly ("omissibility", e.g. <p>).

XML is case-sensitive for element and attribute names, while HTML is not.

Some shorthand features in HTML are omitted in XML, such as (1) attribute
minimization, where attribute values or their quotes may be omitted (e.g. <option
selected> or <option selected=selected>, while XML this must be expressed
as <option selected="selected">) (2) element minimization may be used to remove
elements entirely (such as <tbody>inferred in a table if not given) and (3) the rarely
used SGML syntax for element minimization ("shorttag"), which most browsers do
not implement.

There are numerous other technical requirements surrounding namespaces and

precise parsing of whitespace and certain characters and elements. The exact parsing
of HTML in practice has been undefined until recently see the HTML5 specification
([HTML5]) for full details, or the working summary (HTML vs. XHTML).

Secondly, in contrast to these minor syntactical differences, there are some behavioral
differences, mostly arising from the underlying differences in serialization. For example:

PAGE 37

Most prominently, behavior on parse errors differ. A fatal parse error in XML
(such as an incorrect tag structure) causes document processing to be aborted.

Most content requiring namespaces will not work in HTML, except the built-in
support for SVG and MathML in the HTML5 parser along with certain magic
prefixes such as xlink.

JavaScript processing is a little different in XHTML, with minor changes in case

sensitivity to some functions, and further precautions to restrict processing to wellformed content. Scripts must not use the document.write() method it is not available
for XHTML. The innerHTML property is available, but will not insert non-wellformed content. On the other hand, it can be used to insert well-formed namespaced
content into XHTML.

CSS is also applied slightly differently. Due to XHTML's case-sensitivity, all CSS
selectors become case sensitive for XHTML documents. Some CSS properties, such
as backgrounds, set on the<body> element in HTML are 'inherited upwards' into
the <html> element this appears not to be the case for XHTML.

8.5 Adoption
The similarities between HTML 4.01 and XHTML 1.0 led many web sites and content
management systems to adopt the initial W3C XHTML 1.0 Recommendation. To aid
authors in the transition, the W3C provided guidance on how to publish XHTML 1.0
documents in an HTML-compatible manner, and serve them to browsers that were not
designed for XHTML.
Such "HTML-compatible" content is sent using the HTML media type (text/html) rather
than the official Internet media type for XHTML (application/xhtml+xml). When
measuring the adoption of XHTML to that of regular HTML, therefore, it is important to

PAGE 38

distinguish whether it is media type usage or actual document contents that is being
compared.
Most web browsers have mature support for all of the possible XHTML media types. The
notable exception is Internet Explorer versions 8 and earlier by Microsoft rather than
rendering application/xhtml+xml content, a dialog box invites the user to save the content
to disk instead. Both Internet Explorer 7 (released in 2006) and Internet Explorer 8
(released in March 2009) exhibit this behaviour. Microsoft developer Chris Wilson
explained in 2005 that IE7s priorities were improved browser security and CSS support,
and that proper XHTML support would be difficult to graft onto IEs compatibilityoriented HTML parser however, Microsoft added support for true XHTML in IE9.
As long as support is not widespread, most web developers avoid using XHTML that is
not HTML-compatible, so advantages of XML such as namespaces, faster parsing and
smaller-footprint browsers do not benefit the user.

8.6 Versions
XHTML 1.0
December 1998 saw the publication of a W3C Working Draft entitled Reformulating
HTML in XML. This introduced Voyager, the codename for a new markup language
based on HTML 4, but adhering to the stricter syntax rules of XML. By February 1999
the name of the specification had changed to XHTML 1.0: The Extensible HyperText
Markup Language, and in January 2000 it was officially adopted as a W3C
Recommendation. There are three formal DTDs for XHTML 1.0, corresponding to the
three different versions of HTML 4.01:

XHTML 1.0 Strict is the XML equivalent to strict HTML 4.01, and includes
elements and attributes that have not been marked deprecated in the HTML 4.01

PAGE 39

specification. As of May 25 2011, XHTML 1.0 Strict is the document type used for
the homepage of the website of the World Wide Web Consortium.

XHTML 1.0 Transitional is the XML equivalent of HTML 4.01 Transitional, and
includes the presentational elements (such as center,font and strike) excluded from
the strict version.

XHTML 1.0 Frameset is the XML equivalent of HTML 4.01 Frameset, and
allows for the definition of frameset documentsa common Web feature in the late
1990s.

The second edition of XHTML 1.0 became a W3C Recommendation in August 2002.

Chapter 9 CSS and BOOTSTRAP

9.1 Introduction
A CSS (cascading style sheet) file allows you to separate your web sites (X)HTML
content from its style. As always you use your (X)HTML file to arrange the content, but
all of the presentation (fonts, colors, background, borders, text formatting, link effects &
so on) are accomplished within a CSS.
At this point you have some choices of how to use the CSS, either internally or
externally.
INTERNAL STYLESHEET
First we will explore the internal method. This way you are simply placing the CSS code
within the <head></head> tags of each (X)HTML file you want to style with the CSS.
The format for this is shown in the example below.

PAGE 40

<head>
<title><title>
<style

type=text/css>

CSS

Content

Goes

Here

</style>
</head>
<body>
With this method each (X)HTML file contains the CSS code needed to style the page.
Meaning that any changes you want to make to one page, will have to be made to all.
This method can be good if you need to style only one page, or if you want different
pages to have varying styles.

EXTERNAL STYLESHEET

Next we will explore the external method. An external CSS file can be created with any
text or HTML editor such as Notepad or Dreamweaver. A CSS file contains no
(X)HTML, only CSS. You simply save it with the .css file extension. You can link to the
file externally by placing one of the following links in the head section of every
(X)HTML file you want to style with the CSS file.
<link rel=stylesheet type=text/css href=Path To stylesheet.css />
Or you can also use the @import method as shown below
<style type=text/css>@import url(Path To stylesheet.css)</style>
Either of these methods are achieved by placing one or the other in the head section as
shown in example below.
<head>
<title><title>
<style

type=text/css> @import

url(Path

To

stylesheet.css)</style>

PAGE 41

</head>
<body>

By using an external style sheet, all of your (X)HTML files link to one CSS file in order
to style the pages. This means, that if you need to alter the design of all your pages, you
only need to edit one .css file to make global changes to your entire website.
Here are a few reasons this is better.

Easier Maintenance

Reduced File Size

Reduced Bandwidth

Improved Flexibility

CASCADING ORDER

In the previous paragraphs, I have explained how to link to a css file either internally or
externally. If you understood, than I am doing a good job. If not dont fret, there is a long
way to go before we are finished. Assuming you have caught on already, you are
probably asking, well can I do both? The answer is yes. You can have both internal,
external, and now wait a minute a third way? Yes inline styles also.

Inline Styles
I have not mentioned them until now because in a way they defeat the purpose of using
CSS in the first place. Inline styles are defined right in the (X)HTML file along side the
element you want to style. See example below.
<p style=color: #ff0000>Some red text</p>

PAGE 42

Inline styles will NOT allow the user to change styles of elements or text formatted this
way
So, which is better?
So with all these various ways of inserting CSS into your (X)HTML files, you may now
be asking well which is better, and if I use more than one method, in what order do these
different ways load into my browser?
All the various methods will cascade into a new pseudo stylesheet in the following
order:
1.

Inline Style (inside (X)HTML element)

2.

Internal Style Sheet (inside the <head> tag)

3.

External Style Sheet

As far as which way is better, it depends on what you want to do. If you have only one
file to style then placing it within the <head></head> tags (internal) will work fine.
Though if you are planning on styling multiple files then the external file method is the
way to go.
Choosing between the <link related=> & the @import methods are completely up to you.
I will mention that the @import method may take a second longer to read the CSS file in
Internet Explorer than the <link related=> option. To combat this see Flash of unstyled
content

USERS WITH DISABILITIES

The use of external style sheets also can benefit users that suffer from disabilities. For
instance, a user can turn off your stylesheet or substitute one of there own to increase text
size, change colors and so on. For more information on making your website accessible
to all users please readDive into accessibility

PAGE 43

POWER USERS
Swapping stylesheets is beneficial not only for users with disabilities, but also power
users who are particular about how they read Web documents.

BROWSER ISSUES
You will discover as you delve farther into the world of CSS that all browsers are not
created equally, to say the least. CSS can and will render differently in various browsers
causing numerous headaches.

PAGE 44