HTML
HTML (short for Hypertext Markup Language) is the basic language
in which all web pages are constructed. It is based on SGML
(Standardized Generalized Markup Language) which is an international
standard that describes text-formatting languages.iii
HTML is not a programming language, but rather a markup
language. Markup is derived from the publishing world. It describes
what production people do to a manuscript to tell a publisher
how the text, graphics, and other elements in a book should
appear in printed form.iv HTML documents consist
of content and tags. Tags are pairs of markers that are used
to indicate how certain types of text (or other content such
as graphics) should be displayed on your computer screen. Your
browser interprets the tags and the content contained between
the tags is displayed appropriately.
For example, the bold tag is <b>. The closing bold tag
is </b>. Therefore a web page with the following line…
<b> Welcome To My Web Page </b>
…would be displayed by your browser as…
Welcome To My Web Page
Notice there is no programming being done here. Just adding
tags to text. Of course you have to learn the tags. Check out
www.pageresource.com
for some useful HTML tutorials.
Want to see what the HTML code of this web page looks like?
It's easy to do. Right click anywhere on the screen with your
mouse. Assuming you are using you are using Internet Explorer
or Netscape to browse, select the option "view source." This
will pop open a new window that will display the source code
for the web page you are browsing.
For example, here is the front page of Yahoo.com as normally
seen by your IE browser:
And here is the same page viewed as raw HTML:
Since the HTML code consists of all text, it can be written
in an ordinary word processor or notepad. However, since it
is beneficial to see what your web page looks like while you
are developing it, many WYSIWYG tools have been developed to
facilitate the construction of web pages. Popular web development
packages are Macromedia Dreamweaver, Microsoft FrontPage, Microsoft Visual
Interdev and Adobe GoLive.
FrontPage 2003 (above) is a quick, efficient tool for developing
and managing small to medium size web sites.
Possessing a more robust tool set, Dreamweaver MX is a
solid choice for development of large-scale web sites.
So what is your web browser actually doing to request the information
about a web page? Let's follow through this diagram below:
In phase one, you type the address www.yahoo.com
in your browser address window and hit the enter key. Your browser
sends this request over your Internet connection (dial-up, cable,
DSL, etc.) to your ISP's server. Your ISP's server then relays
the request to Yahoo's web server. The Yahoo server then locates
the information for the page of the Yahoo site you requested
(in this case, the home page). In phase two, the Yahoo server
sends the requested information back to your ISP's server, which
in turn relays the information to your PC. Your browser interprets
the information and displays the Yahoo home page. This typical
Internet communication session is a client/server relationship.
Your browser functions as a client (a requestor and processor
of information). The Yahoo computer is the server, which serves
up requested data to the client.
HTML standards are controlled by World Wide Web Consortium
(W3C) which, among other things, sets standards for web languages.
When HTML was first launched, there were no standards. As the
web began to grow rapidly, standardization became essential
so that communications and e-commerce could flow smoothly. Keep
up with W3C news and standards at their web site – www.w3c.org.
Unfortunately, keeping HTML simple and standardized made it
a rather limited language. As web users began to crave more
exciting web content, Dynamic HTML (DHTML) was born.
DHTML
Oooohhh…Dynamic HTML…sounds exotic doesn't it? Well,
it is useful, but not particularly exotic. Many people think
that DHTML is another language. It isn't. DHTML is merely HTML
extended by using Cascading Style Sheets and scripting languages
(such as JavaScript and VBScript).
Cascading Style Sheets (CSS) - CSS was created to alleviate
one of the problems identified early on with HTML. In the original
HTML standard, content was linked to layout. With the development
of CSS, layout can now be controlled by the style sheet while
content continues to be controlled by the HTML code. This provides
the developer with more flexibility. Two major advantages of
CSS are the ability to precisely position content on a page
and the ability to layer content. Layering means the ability
to lay graphics and text over one another, giving developers
the ability to produce new and interesting effects.v
In addition, all aspects of font and text presentation (including
font family or type, style, size and weight) can be controlled
by the style sheet.vi
Scripting Languages - Scripting languages are programming
languages that are embedded between <script> tags in HTML
code. Unlike full-fledged programming languages, scripts do
not have to be compiled to run. The scripts must be sent to
an interpreter that translates the script code into an
executable format.vii This takes less time than compiling,
which is one of the main advantages to using scripts. The two
most popular scripting languages for the web today are JavaScript
and VBScript.
Scripts can be run in the browser on the client's computer
or on the web server. Scripts that are run on a server are referred
to as server-side scripts. Client-side scripts run in the browser.
Interpretation of client-side scripts occurs when the browser
downloads the web page.viii Scripts can be used to
make your sites more interactive.
JavaScript - Named for the Java language, JavaScript
is not Java. Java is full-featured programming language, not
a scripting language. Java, which was derived from C and C++,
can be used to create entire applications and control consumer
electronic devices. Netscape renamed its LiveScript product
JavaScript to capitalize on Java's growing popularity…purely
a marketing move. Although JavaScript is a programming language,
it is very different from Java. Examples of ways JavaScript
can be used to enhance interactivity of your site are as follows:x
- Provide user feedback as users navigate your site - buttons
that highlight as you move the mouse pointer over them are
an example
- Check validity of information entered into forms by the
user
- Do calculations required by forms in JavaScript on the client
PC, thereby avoiding server-side processing
- Open new windows and display alert boxes
- Put custom messages in the status bar of the browser window
Below is a portion of a JavaScript that produces a news ticker
in Internet Explorer. Notice that the coding is quite a bit
more complicated than raw HTML. This is because JavaScript is
an actual programming language and requires a basic knowledge
of looping, flow control, arrays, etc.
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
// news ticker function
var newslist=new Array();
var cnt=0; // current news item
var curr = "";
var i=-1; // current letter being typed
newslist[0]=new Array("Check out this JavaScript!","")
newslist[1]=new Array("Use this JavaScript to post news items
on your Web site","")
newslist[2]=new Array("Create a list of specials for the day","")
newslist[3]=new Array("Visit JavaScript Source","")
newslist[4]=new Array("The links can even be linked to other
pages","")
function newsticker()
{
// next character of current item
if (i < newslist[cnt][0].length - 1)
{
i++;
temp1 = newslist[cnt][0];
temp1 = temp1.split('');
curr = curr+temp1[i];
temp2 = newslist[cnt][1];
mtxt.innerHTML = "<small><a href='"+temp2+"'><font
color='#ff0000'>"+curr+"_</small></font></a>";
setTimeout('newsticker()',10)
return;
}
// new item
i = -1; curr = "";
if (cnt<newslist.length-1)
cnt++;
else
cnt=0;
setTimeout('newsticker()',3000)
}
// End -->
</script>
</HEAD>
VBScript - VBScript is a scaled-down version of the
Microsoft Visual Basic programming language. It was specifically
designed to be a fast, portable interpreter for use in web browsers
and applications.xi VBScripting can be used to do
many of the same things that you can accomplish with JavaScript.
VBScripting works quite seamlessly in conjunction with Microsoft
Active Server Pages (ASP), a server-side technology for running
server-side scripts.
Regardless of which realm of web development you will be working
in, you should have at least a passing familiarity with HTML,
CSS and scripting. Familiarity with at least one of the major
web development tools mentioned above is also highly recommended.
Now we will examine in more detail each of the four realms
of web development normally encountered in medium and large
size organizations.
