Web Design with HTML and CSS

Interactivity on the web

Lesson 10, Introduction to Interactivity 213

The next part of this lesson provides an overview of working with JavaScript technology, and
you will create an interactive photo gallery.

JavaScript basics

JavaScript is a scripting language that has its own syntax and structure. A full description
of JavaScript and how to use it is beyond the scope of this book. This lesson provides a
brief introduction, but there several books and training courses where you can learn about
JavaScript. Some references are listed below.

JavaScript References

These are a few resources we recommend for learning JavaScript.

Eloquent JavaScript: An Modern Introduction to Programming

Eloquent JavaScript provides an introduction to the JavaScript programming language and

programming basics that you can apply to other languages. This HTML version includes

interactive examples and a way to use interactive code.

http://eloquentjavascript.net/

JavaScript Bible

This book is a JavaScript reference guide written for designers who want to improve their

programming skill-set.

DOM Scripting: Web Design with JavaScript and the Document Object Model

This book by Jeremy Keith was written with a designer audience in mind and focuses on how

to add enhancements to your web pages.

In this lesson, you will gain a basic understanding of how JavaScript interacts with HTML,
which will serve as a foundation you can apply to more advanced scripting languages, such
as PHP. In the following steps, you will work with a simple form to understand some of the
basic concepts of JavaScript.

1 In your text editor, choose File > Open and navigate to your web10lessons folder.
Choose the subscribe.html fi le, and then click Open. To ensure you have a backup copy
of this fi le, you’ll save the document with a new name.

2 Choose File > Save As and name this fi le subscribe_work.html. Be sure to save this fi le
in the web10lessons folder.
Take a moment to examine the HTML code; note that it is completely created with
HTML and as such, lacks functional interactivity.