HTML and CSS Reference
In-Depth Information
Figure 1.4 Scrolling text with JavaScript (output of Example 1.1).
1.7 JavaScript and Its Role in Web
When you start learning JavaScript, JavaScript code will be embedded directly in the
content of an HTML page. Once we have covered the core programming constructs, you
will see how a document is structured by using the document object model (DOM), and
how JavaScript can get access to every element of your page. Finally you will be intro-
duced to cascading style sheets (CSS), a technology that allows you to design your page
with a stylized presentation. The combination of HTML, CSS, and JavaScript will allow
you to produce a structured, stylized, interactive Web page. As your knowledge grows,
so will your Web page, until it becomes necessary to create more pages and link them
together. And then you still have to be sure your visitors are having a pleasant experi-
ence, no matter what browser they are using, at the same time trying to manage the site
behind the scenes. To keep all of this in perspective, Web designers have determined that
there are really three fundamental parts to a Web page: the content, the way the content
is presented, and the behavior of that content.
1.7.1 The Three Layers
When a Web page is designed on the client (browser) side, it might start out as a sim-
ple HTML static page. Later the designer might want to add style to the content to
give the viewer a more visually attractive layout. Last, to liven things up, JavaScript
code is added to give the viewer the ability to interact with the page, make the page
do something. A complete Web page, then, can be visualized as three separate layers:
the content or structural layer, the style or presentation layer, and the behavior layer
(see Figure 1.5). Each of these layers requires careful planning and skill. Designers
are not necessarily programmers and vice versa. Separating the layers allows the
designer to concentrate on the part he or she is good at, while the programmer can
tweak the code in the JavaScript application without messing up the design. Of
course, there is often a blurred line between these layers but the idea of separating
content structure and style from behavior lends to easier maintenance, less repeti-
tion, and hopefully less debugging.
Search WWH ::

Custom Search