these web professionals with the final product they might be responsible for
designer – Photoshop Pag Sketch
department – Storyboards
experience designer – PHP Scripts
programmer – HTML and CSS documents
does the W3C do?
Tim Berners -Lee founded World Wide Web Consortium in
the year 1994 to develop the web and its related technologies at Massachusetts
Institute of Technology. To adopt new technology standards and ensure the
compatibility and agreement among the industry W3C was created. Prior to this,
inconsistency between web pages and incompatible HTML versions were developed
by different vendors which depreciated the performance of the web. The
Consortium is governed by its membership, which comprises about 400
organizations. The list of members is available to the public. Members include
only businesses, nonprofit organizations, universities, and governmental
entities. There is no provision for individual membership. On the whole, W3C
monitors the web technologies. Some well known members of the organization are
IBM, Sun Microsystems, Adobe, Microsoft etc.
the web technology with its appropriate task:
HTML – Identifies text as a second-level heading
CSS – Makes all second level headings blue
PHP – Defines a new markup language for sharing financial information
XML – Checks a form field for a valid entry
is the difference between frontend and backend web development?
Front-end and back-end developers team up to create
the systems necessary for an application or website to function properly. The
term “front-end” refers to the user interface, while “back-end” means the
server, application and database that work behind the scenes to deliver
information to the user. The user enters a request from the interface and it is
verified and communicated to the server, which pulls the necessary data from
the database and sends it back to the user.
Front-end developers design and
construct the user experience elements on the web page or app including
buttons, menus, pages, links, graphics and more. Front-end developers also use frameworks such
as Angular, Ember,
Backbone, Foundation or React to communicate with back-end systems. Also called
client-side development, one of the main challenges of front-end development is
the rapid pace of change in the tools, techniques and technologies used to
create the user experience for applications and websites. The seemingly simple
goal of creating a clear, easy-to-follow user interface is difficult due to the
wide variety of mobile device and computer screen resolutions and sizes.
The backend, also called the server
side, consists of the server which provides data on request, the application
which channels it and the database which organizes the information. For
example, if you purchase a pair of shoes from a website, you are interacting
with the front end. After you select the item you want, put it in the shopping
cart and authorize the purchase, the information is kept inside the database
which resides on the server. There are enterprise-level databases like Oracle,
Teradata, Microsoft SQL Server, IBM DB2, EnterpriseDB and SAP Sybase ASE, as
well as other popular databases including MySQL, NoSQL and PostgreSQL. A few
days later when you check on the status of your delivery, the server pulls the
relevant information, updates it with tracking data and presents it to you
through the front end. Back-end programmers must have experience in
creating applications that can find and deliver data to the front end.
is the difference between a web-authoring program and an HTMLediting tool?
Web Authoring is a process where individuals use graphical
interface to create websites. The user creates a program that does the job by
editing and write what the user sees is what they get. The user does not use HTML
Code. When the user creates the content with the software program, the program
then creates the appropriate type of HTML code for the process of making a
website. Dreamweaver is a good example of this, as it allows us to design our
host of other stuff.
HTML editor is essentially just a plain text editor
that understands what HTML is supposed to look like and has features built in
to make construction of that HTML easier. HTML editing tool would be geared towards actual programmers. It’s
a tool that will generally come with code correction, snippets and plugins to
help us code properly. A web-authoring
program is a program which checks if the person trying to access, has the required
permissions or account on the web. Whereas, HTML is the structure or skeleton
of the web page which allows us to edit the HTML Code.
Let’s play a round of “Identify That
Acronym!” The following are a few basic web terms mentioned in this chapter.
Answers are in Appendix A.
HTML ______ The markup language used to describe web content
W3C ______ The organization that monitors web technologies
CERN ______ Particle physics lab where the Web was born
CSS ______ The language used to instruct how web content looks
HTTP ______ Protocol for transferring web documents on the Internet
IP ______ Internet Protocol
URL ______ The location of a web document or resource
NCSA ______ Home of Mosaic, the first graphical browser
DNS ______ Matches domain names with numeric IP addresses
FTP ______ A protocol for file transfer
“mobile web” complicates our jobs as web designers. List at least three unknown
factors you need to consider when designing and developing a site.
Ideas for creating new features on a website can
originate from anywhere. The very first step is to identify the need for an organization
internally to build a website and also the potential market available in the
intranet. In the analysis phase of the development we need to find out if or
how the website design is going to a success. Once the analysis has been
performed, a work plan document should be specified that contains three
particular factors i.e., time, task and resources. Also, we implement the
websites with few important factors like choosing the right domain name and URL.
Having a rich keyword in the URL can play a factor in ranking of websites. The
web site layout is the second factor to be considered because too much
information on a single page makes the website looks cluttered. Call to action
mechanism also helps website to convert into a potential customer website.
Keeping websites updated is also one of the factors that developers should take
care of. It’s important to build a website with search
engine optimization perspective. Doing so will help direct traffic to
future sites. Especially in today’s environment, major search
engines have given more leverage to map listings.
the technology or practice on the left with the problem it best addresses.
Progressive enhancement – Slow connection speeds Assistive reading and input
Server-side detection – Determining which device is being used
Responsive design – A variety of screen sizes
WAI-ARIA – All levels of browser capabilities
Site performance optimization – Assistive reading and input devices
accessibility strategies take into account four broad categories of
disabilities. Name at least three, and provide a measure you might take to
ensure content is accessible for each.
Web is an increasingly important resource in many aspects of life: education,
employment, government, commerce, health care, recreation, and more. It is
essential that the Web be accessible in order to provide equal access and equal opportunity to people with
disabilities. An accessible Web can also help people with disabilities more
actively participate in society. The Web offers the possibility of unprecedented access to information and
interaction for many people with disabilities. That is, the
accessibility barriers to print, audio, and visual media can be much more
easily overcome through Web technologies.
Web Accessibility Evaluation outlines
different approaches for evaluating websites for accessibility. It provide
general procedures and tips for evaluation in different situations, from
evaluation during website development to ongoing monitoring of existing sites.
Much of the focus on Web accessibility has
been on the responsibilities of Web developers. However, Web software also has a vital role in Web accessibility.
Software needs to help developers produce and evaluate accessible Web sites,
and be usable by people with disabilities.
One of the roles of the Web Accessibility
Initiative (WAI) is to develop guidelines and techniques that
describe accessibility solutions for Web software and Web developers. These WAI
guidelines are considered the international standard for Web accessibility.
Making a Web site accessible can be simple or
complex, depending on many factors such as the type of content, the size and complexity of the site, and the
development tools and environment.
Many accessibility features are easily
implemented if they are planned from the beginning of Web site development or
redesign. Fixing inaccessible Web sites can require significant effort,
especially sites that were not originally “coded” properly with
standard XHTML markup, and sites with certain types of content such
When developing or redesigning a site,
evaluating accessibility early and throughout the development process can
identify accessibility problems early when it is easier to address them. Simple
techniques such as changing settings in a browser can determine if a Web page
meets some accessibility guidelines. A comprehensive evaluation to determine if
a site meets all accessibility guidelines is much more complex.
There are evaluation tools that
help with evaluation. However, no tool alone can determine if a site meets
accessibility guidelines. Knowledgeable human evaluation is required to determine if a site is
would you use a waterfall chart?
A typical waterfall
chart is used to show how an initial value is increased and decreased by a
series of intermediate values, leading to a final value. A
performance-specific waterfall chart lets us see the series of actions that
occur between a user and server in order for that user to view a specific
individual page of the site. Each page resource from HTML to images, CSS,
waterfall shows the moment when each resource is called from the server
straight through to the moment when it has been downloaded and rendered in the
If we care about how fast the pages load, then we need
to have at least a basic understanding of waterfalls. That’s because waterfall
charts are a critical diagnostic tool for the web pages. Pages can be slow for
a myriad of reasons, from a sluggish back end to latency to unoptimized
third-party scripts that block the rest of the page from rendering. If the site
feels slow, we can quickly run our own tests, generate waterfalls, and get a
good idea of where the problem lies before flagging the problem.