Thursday, April 18, 2024

A Web Development Primer

You’ve learned HTML, and you’re good with graphics. You have a lot of content,
and people are coming to your site. You have it all, right?

Well, not exactly.

When the World Wide Web first became popular, HTML was the only language programmers
could use to create Web pages. They soon learned that HTML had some major limitations.
Although HTML presented the user with a "page" of information, the
Web page and the user had a limited amount of interaction; the experience was
like reading the front page of a newspaper on a computer monitor. Now most computer
users, whether they use Windows, Macintosh, UNIX, or a combination of the three,
are accustomed to graphical applications that provide interaction. They’re used
to clicking buttons, entering values into text boxes, and choosing from menus.
In fact, the only way to get useful work done with a computer is to interact
with it. The first generation of Web pages provided information to the users,
but the users couldn’t interact with the Web the way they could with their word
processors. If users wanted to interact with their Web pages, they had to send
the data to the server, which contained all the "smarts." The server
sent its results back to the Web page. This interaction required a great deal
of extra time, effort, and overhead, and the user interface was very constrained
compared to other popular applications.

Fortunately, the builders of the Internet and the World Wide Web recognized
these limitations. They soon realized that if the user was denied the capability
to interact with the Web page, the Web itself would become little more than
a collection of information, much like a library full of books. Although that
collection is very useful, users demand more from their computers than a duplication
of what they could find elsewhere.

The capabilities of HTML began to grow and become more powerful. Soon, designers
began to realize that they needed more than just HTML to make the Internet accessible
and useful to the masses. Corporations that wanted to develop enterprise solutions
or explore the profit potential of the Internet also began to pressure designers
to give them something more.

The Internet is basically a client and server environment, with 3 components
to the medium:

  • Client side technologies

  • Server side technologies

  • Networks

Each will be discussed in turn in this article. So when you’re ready,
grab a cup of coffee and carry on reading!

Client Side Technologies

Client side technologies are those that are interpreted (executed) by the user’s
browser. When you type a website’s address in your web browser, the latter will
make a request to the web server where your HTML files are stored, and the HTML
file is sent to the browser for viewing. The different technologies that are
included in the HTML page (such as CSS and JavaScript) are all executed on the
client browser. A limitation of client-side programming is that it is hard to
tell what browser/platform is being used, and it might turn out that some of
the client-side technologies are not supported (or not fully supported) by the
browser, with the result that your web page(s) might not display properly. The
section that follows will take you on a quick tour to discover the major client-side
technologies.

CSS (Cascading Style Sheets)

To understand CSS, it’s worth recalling the main purpose of HTML. The latter
was originally designed as a structural language, but with time and updates,
HTML has been used as a tool for presentation, making use of fonts, colors and
other visual elements. These days the purpose of CSS is to restore HTML to its
original structural language. In other words, cascading style sheets are a new
way of formatting your page layout, text, fonts, images, and almost anything
that controls the look and feel of your web page. It is included either in-line
with the HTML file or linked as a separate file which can then be used by different
HTML files. The advantage of separating the structure and look is that web pages
can be tailored for different users, browsers, and platform and an obvious benefit
is that updating becomes easier.

Let’s take a quick example at a usage of CSS. Suppose you want all your <H1>
tags to have a 10-point Verdana font. Instead of defining every all your <H1>
tags in your page with these preferences, you can just use CSS:

    H1 {font-family: Verdana; font-size: 10pt;)

CSS usage goes far beyond that. CSS is capable of spacing out the content of
a page down to the very last pixel… it can do the same when sizing text, giving
you complete control over the look and feel of your page. In fact, CSS will
replace some older HTML tags in future browser versions.

JavaScript

JavaScript is a scripting language developed by Netscape and supported as Jscript
in Microsoft Internet Explorer. The language was turned to ECMAScript, as a
cross-platform Internet standard for scripting, but we still use the most commonly
recognised JavaScript name. JavaScript should not be confused with Java. Despite
similarities in their names, these 2 languages are completely different from
each other.

JavaScript is a core web technology that every designer is encouraged to understand
well. It was born out of desire to let HTML authors write scripts directly in
their documents. JavaScript brings programming power within the reach of everyone
familiar with HTML.

JavaScript borrows its syntax from C/C++ and those familiar with C will feel
right at home. Those without any programming experience will find that JavaScript
is not the easiest language in the world to learn but it’s a far cry from having
to learn a programming language such as Java or C.

JavaScript is interpreted on the client-side (on the user’s browser),
and is shipped in every platform-specific version of Netscape Navigator 2 and
Internet Explorer 4. It can be used to enhance web pages in many ways, such
as validating forms, adding user interactivity, processing data or controlling
multiple frames. It handles events for the various HTML elements, an example
of which is allowing buttons to have OnClick event handlers. While
most people find use of JavaScript to be client-side only, JavaScript can also
be used in servers and authoring tools.

VBScript

Microsoft’s Visual Basic Script (VBScript) offers the functions of a programming
language and the simplicity of a technology streamlined for the Web. With VBScript,
you can bring your Web pages to life with real-time interaction; there’s no
more waiting for a server to respond to button clicks and mouse movements. A
click of a button gets an instant reaction, and the movement of the mouse over
an object brings the object to life.

When you enhance your Web pages with VBScript, you insert scripts directly
into your pages. Since VBScript is a subset of Microsoft’s Visual Basic, your
scripts resemble programs written in Visual Basic. If you aren’t a programmer,
don’t worry. The wonderful thing about VBScript is that it’s a very simple programming
language to learn and to use. Many Web publishers who aren’t programmers use
VBScript to enhance their Web pages.

Like most basic programming languages, VBScript is an interpreted language,
which is both good news and bad news. The good news is that you don’t need to
compile your scripts as you would with a program written in C or C++. Your scripts
are directly interpreted, line-by-line, when they’re executed in the user’s
browser. The bad news is that before anyone can run your scripts, he or she
needs a VBScript interpreter, which is part of the standard Internet Explorer
browser package. It’s installed automatically when you install Internet Explorer

DHTML

DHTML (or Dynamic HyperText Markup Language), is a collection of coding languages
such as HTML, CSS and JavaScript. It allows a web site developer to build dynamic
abilities into what would normally be a static web page. What this means is
that a web page may be changed after it has been loaded using DHTML. This provides
a basis for many useful capabilities, and can make web pages interactive, or
feel more alive. The major browsers that support DHTML are the fourth and fifth
generation versions of Microsoft
Internet Explorer
and Netscape
Navigator
.

Get the Free Newsletter!

Subscribe to Developer Insider for top news, trends & analysis

Popular Articles

Featured