HTML, CSS, and JavaScript are client-side technologies. These are extremely important for web applications, and a professional Java developer should have some knowledge about them. Nobody expects you to be an expert in Java and in web-client technologies at the same time, though this is not impossible. A certain understanding is desirable.
HTML is the textual representation of a structured text. The text is given as characters, as in any text file. Tags represent the structure. A start tag starts with a < character, then the name of the tag, then, optionally, name="value" attributes, and finally a closing > character. An end tag starts with </, then the name of the tag, and then >. Tags are enclosed into hierarchies; thus, you should not close a tag sooner than the one that was opened later. First, the tag that was opened last has to be closed, then the next, and so on. This way, any actual tag in the HTML has a level, and all tags that are between the start and end tags are below this tag. Some tags that cannot enclose other tags or text do not have end tags and stand on their own. Consider the following sample:
<html>
<head>
<title>this is the title</title>
</head>
</html>
The tag head is under html, and title is under head. This can be structured into a tree, as follows:
html
+ head
+ title
+ "this is the title"
The browser stores the HTML text in a tree structure, and this tree is the object model of the web page document, thus the name, Document Object Model (DOM) tree.
The original HTML concept mixed formatting and structure, and even with the current version of HTML5, we still have tags such as b, i, tt that suggest the browser to display the text between the start and end tags in bold, italics, and teletype, respectively.
As the name HTML, standing for Hypertext Markup Language, suggests, the text can contain references to other web pages in the form of hyperlinks. These links are assigned to texts using the a tag (standing for anchor) or to some form that may consist of different fields, and when the submit button of the form is pressed, the content of the fields is sent to the server in a POST request. When the form is sent, the content of the fields is encoded in the so-called application/x-www-form-urlencoded form.
The HTML structure always tried to promote the separation of structure and formatting. To do so, formatting was moved to styles. Styles defined in Cascading Style Sheets (CSS) provide much more flexibility for formatting than HTML; the format of a CSS is more effective for formatting. The aim to create CSS was that the design can be decoupled from the structure of the text. If I had to choose one of the three, I would opt for CSS as the one that is least important for Java server-side web developers and, at the same time, the most important for the users (things should look nice).
JavaScript is the third pillar of client-side technologies. JavaScript is a fully functional, interpreted programming language executed by the browser. It can access the DOM tree, and read and modify it. When the DOM tree is modified, the browser automatically displays the modified page. JavaScript functions can be scheduled and registered to be invoked when some event occurs. For example, you can register a function to be invoked when the document is fully loaded, when the user presses a button, clicks on a link, or just hovers the mouse over some section. Although JavaScript was first only used to create funny animations on the browser, today it is possible, and is a usual practice, to program fully functional clients using the capabilities of the browser. There are really powerful programs written in JavaScript, even such power-hungry applications as PC emulators.
In this book, we focus on Java and use the client-side technologies as much as is needed for demonstration technologies. However, being a Java web developer professional, you have to learn these technologies as well, to some extent at least, to understand what a client can do and to be able to cooperate with the professionals responsible for frontend technologies.