Section 17.1 Add an audio file using HTML Create a form using HTML Add text boxes using HTML Add radio buttons and check boxes using HTML Add a pull-down.

Slides:



Advertisements
Similar presentations
17 HTML, Scripting, and Interactivity Section 17.1 Add an audio file using HTML Create a form using HTML Add text boxes using HTML Add radio buttons and.
Advertisements

WEB DESIGN TABLES, PAGE LAYOUT AND FORMS. Page Layout Page Layout is an important part of web design Why do you think your page layout is important?
HTML 5 and CSS 3, Illustrated Complete Unit L: Programming Web Pages with JavaScript.
The Web Warrior Guide to Web Design Technologies
CIS101 Introduction to Computing Week 08. Agenda Your questions JavaScript text Resume project HTML Project Six This week online Next class.
Objective Understand web-based digital media production methods, software, and hardware. Course Weight : 10%
Copyright 2004 Monash University IMS5401 Web-based Systems Development Topic 2: Elements of the Web (g) Interactivity.
MSc. Publishing on WWW JavaScript. What is JavaScript? A scripting language devised by Netscape Adds functionality to web pages by: Embedding code into.
Web Page Behavior IS 373—Web Standards Todd Will.
Macromedia Dreamweaver 4 Advanced Level Course. Add Rollovers Rollovers or mouseovers are possibly the most popular effects used in designing Web pages.
JavaScript 101 Lesson 5: Introduction to Events. Lesson Topics Event driven programming Events and event handlers The onClick event handler for hyperlinks.
Tutorial 6 Forms Section A - Working with Forms in JavaScript.
2440: 141 Web Site Administration Web Server-Side Programming Professor: Enoch E. Damson.
WEB DESIGNING Prof. Jesse A. Role Ph. D TM UEAB 2010.
CST JavaScript Validating Form Data with JavaScript.
Chapter 9 Collecting Data with Forms. A form on a web page consists of form objects such as text boxes or radio buttons into which users type information.
Section 13.1 Add a hit counter to a Web page Identify the limitations of hit counters Describe the information gathered by tracking systems Create a guest.
1 Events Lect 8. 2 Event-driven Pages one popular feature of the Web is its interactive nature e.g., you click on buttons to make windows appear e.g.,
1 Web Developer & Design Foundations with XHTML Chapter 6 Key Concepts.
Section 2.1 Compare the Internet and the Web Identify Web browser components Compare Web sites and Web pages Describe types of Web sites Section 2.2 Identify.
1 CS 3870/CS 5870 Static and Dynamic Web Pages ASP.NET and IIS.
Server vs Client-side validation. JavaScript JavaScript is an object-based language. JavaScript is based on manipulating objects by modifying an object’s.
Dr. Azeddine Chikh IS444: Modern tools for applications development.
Chapter 5 Java Script And Forms JavaScript, Third Edition.
Chapter 6: Forms JavaScript - Introductory. Previewing the Product Registration Form.
© 2011 Delmar, Cengage Learning Chapter 9 Collecting Data with Forms.
Chapter 16 The World Wide Web Chapter Goals Compare and contrast the Internet and the World Wide Web Describe general Web processing Describe several.
© Cheltenham Computer Training 2001 Macromedia Dreamweaver 4 - Slide No 1 Macromedia Dreamweaver 4 Advanced Level Course.
XHTML Introductory1 Forms Chapter 7. XHTML Introductory2 Objectives In this chapter, you will: Study elements Learn about input fields Use the element.
INTRODUCTION TO FRONTPAGE. TOPICS TO BE DISCUSSED……….  Introduction Introduction  Features Features  Starting Front Page Starting Front Page  Components.
McGraw-Hill/Irwin © 2004 by The McGraw-Hill Companies, Inc. All rights reserved. Dynamic Action with Macromedia Dreamweaver MX Barry Sosinsky Valda Hilley.
4 HTML Basics Section 4.1 Format HTML tags Identify HTML guidelines Section 4.2 Organize Web site files and folder Use a text editor Use HTML tags and.
10 Adding Interactivity to a Web Site Section 10.1 Define scripting Summarize interactivity design guidelines Identify scripting languages Compare common.
JavaScript is a client-side scripting language. Programs run in the web browser on the client's computer. (PHP, in contrast, is a server-side scripting.
Adding User Interactivity – Lesson 51 Adding User Interactivity Lesson 5.
Section 4.1 Format HTML tags Identify HTML guidelines Section 4.2 Organize Web site files and folder Use a text editor Use HTML tags and attributes Create.
Lecture # 6 Forms, Widgets and Event Handling. Today Questions: From notes/reading/life? Share Personal Web Page (if not too personal) 1.Introduce: How.
Tutorial 7 Creating Forms. Objectives Session 7.1 – Create an HTML form – Insert fields for text – Add labels for form elements – Create radio buttons.
© 2010 Delmar, Cengage Learning Chapter 8 Collecting Data with Forms.
Extending HTML CPSC 120 Principles of Computer Science April 9, 2012.
JavaScript, Fourth Edition Chapter 5 Validating Form Data with JavaScript.
Dynamic Web Pages & JavaScript. Dynamic Web Pages Dynamic = Change Dynamic Web Pages are web pages that change. More than just moving graphics around.
Active Server Pages  In this chapter, you will learn:  How browsers and servers interacted on the Internet when the Internet first became popular 
Chapter 8 Collecting Data with Forms. Chapter 8 Lessons Introduction 1.Plan and create a form 2.Edit and format a form 3.Work with form objects 4.Test.
12 Developing a Web Site Section 12.1 Discuss the functions of a Web site Compare and contrast style sheets Apply cascading style sheets (CSS) to a Web.
JavaScript - A Web Script Language Fred Durao
Microsoft FrontPage 2003 Illustrated Complete Creating a Form.
HTML Form Widgets. Review: HTML Forms HTML forms are used to create web pages that accept user input Forms allow the user to communicate information back.
Introduction to JavaScript CS101 Introduction to Computing.
Sahar Mosleh California State University San MarcosPage 1 JavaScript Basic.
Chapter 2: Variables, Functions, Objects, and Events JavaScript - Introductory.
4 HTML Basics Section 4.1 Format HTML tags Identify HTML guidelines Section 4.2 Organize Web site files and folder Use a text editor Use HTML tags and.
JavaScript Introduction.  JavaScript is a scripting language  A scripting language is a lightweight programming language  A JavaScript can be inserted.
Copyright © Terry Felke-Morris WEB DEVELOPMENT & DESIGN FOUNDATIONS WITH HTML5 Chapter 9 Key Concepts 1 Copyright © Terry Felke-Morris.
HTML Overview Part 5 – JavaScript 1. Scripts 2  Scripts are used to add dynamic content to a web page.  Scripts consist of a list of commands that execute.
8 Chapter Eight Server-side Scripts. 8 Chapter Objectives Create dynamic Web pages that retrieve and display database data using Active Server Pages Process.
Copyright © Terry Felke-Morris WEB DEVELOPMENT & DESIGN FOUNDATIONS WITH HTML5 7 TH EDITION Chapter 14 Key Concepts 1 Copyright © Terry Felke-Morris.
HTML Forms. A form is simply an area that can contain form fields. Form fields are objects that allow the visitor to enter information - for example text.
INTRODUCTION JavaScript can make websites more interactive, interesting, and user-friendly.
Chapter 27 Getting “Web-ified” (Web Applications) Clearly Visual Basic: Programming with Visual Basic nd Edition.
Understanding JavaScript and Coding Essentials Lesson 8.
 ASP.NET provides an event based programming model that simplifies web programming  All GUI applications are incomplete without enabling actions  These.
1 CSC160 Chapter 1: Introduction to JavaScript Chapter 2: Placing JavaScript in an HTML File.
CSC 121 Computers and Scientific Thinking Fall Event-Driven Programming.
introductionwhyexamples What is a Web site? A web site is: a presentation tool; a way to communicate; a learning tool; a teaching tool; a marketing important.
Web Programming Java Script-Introduction. What is Javascript? JavaScript is a scripting language using for the Web. JavaScript is a programming language.
Section 10.1 Define scripting
Section 17.1 Section 17.2 Add an audio file using HTML
Web Development & Design Foundations with HTML5 7th Edition
Section 10.1 YOU WILL LEARN TO… Define scripting
Presentation transcript:

Section 17.1 Add an audio file using HTML Create a form using HTML Add text boxes using HTML Add radio buttons and check boxes using HTML Add a pull-down menu using HTML Add a text area using HTML Section 17.2 Identify client-side scripting languages Create a rollover button using JavaScript Identify server-side scripting languages Debug code

17.1 Adding Interactivity Using HTML Guide to Reading Main Ideas You can use HTML code to insert multimedia elements into a Web page. Other HTML tags allow you to create forms. Key Terms animated GIF radio button pull-down menu text area pp

17.1 Adding Interactivity Using HTML Adding Multimedia Elements animated GIF Inserting an audio file or an animated GIF file is very similar to inserting an image file. You can set a text link by including text within the anchor tag set. animated GIF A sequence of GIF images that are all stored in a single file along with an image transition delay value that controls the time each image will stay on the screen. (p. 441) pp

17.1 Adding Interactivity Using HTML Creating a Registration Form radio buttons pull-down menus text areas You create a registration form in HTML with text boxes, using preset options, like radio buttons, check boxes, pull-down menus, and text areas. radio button An interactive control that allows a user to select only one option from a list of options; also known as an option button. (p. 442) pull-down menu See drop- down box. (p. 443) text area Form element that allows the user to enter as much text as desired; also known as a scroll box. (p. 443) pp

Adding Interactivity Using HTML It is not difficult to create a form using HTML. Knowing which HTML tags to use can help you adjust form elements when you create a form in FrontPage. Creating a Registration Form 17.1

pp Adding Interactivity Using HTML Activity 17A – Adding an Audio File Using HTML (p. 440) Activity 17B – Adding Text Boxes Using HTML (p. 441) Activity 17C – Adding Radio Buttons and Check Boxes Using HTML (p. 442) Activity 17D – Adding a Pull-down Menu Using HTML (p. 443) Activity 17E – Adding a Text Area using HTML (p. 444) 17.1

17.2 Adding Interactivity Using Scripting Guide to Reading Main Ideas Scripting languages are used to supplement the capabilities of standard HTML. Scripting languages are divided into client-side scripts and server-side scripts. Key Terms client-side script object event event handler function server-side script variables conditional statements pp

17.2 Adding Interactivity Using Scripting Client-Side Scripts client-side scripts Some scripting languages, known as client-side scripts, are designed to be transferred to the user’s computer along with the HTML code. client-side script A script that is executed by the user’s Web browser. (p. 446) pp

17.2 Adding Interactivity Using Scripting Client-Side Scripts JavaScript is a popular scripting language for client-side scripts. Its code is composed of several elements, including: Objects Events Event handlers object In JavaScript, an element in a browser window; it can have properties that define it. (p. 446) event Anything that causes an effect to occur; often triggered by a user’s action. (p. 447) event handler The part of the script that responds to an event and defines the action that will occur when the event takes place. (p. 447) pp

17.2 Adding Interactivity Using Scripting Client-Side Scripts More Java elements: Functions Variables Conditional statements function In JavaScript, code that performs a specific task or action. (p. 447) variable Used by scripts to identify a value that will change when the script is executed. (p. 447) conditional statement A type of code that allows a script to respond differently depending on the action taken by the user. (p. 447) pp

17.2 Adding Interactivity Using Scripting Server-Side Scripts Server-side scripts Server-side scripts are run from the Web server. Web designers often use CGI to create Web-based forms that users fill out and then submit to the server. server-side script A script that is executed on the Web server, with the output transferred to the user’s computer as a Web page. (p. 448) pp

Adding Interactivity Using Scripting Server-side scripts can be used to change static content into dynamic content. A server-side script can retrieve data based on the user’s input and then generate a Web page that displays in the user’s browser. Server-Side Scripts 17.2

pp Adding Interactivity Using Scripting An alert statement tells you when a particular action is not occurring as specified. Alert statements are useful to Web developers during the testing phase. They are not helpful, however, to visitors to the Web site. Therefore, alert statements should be removed before the site is published. Debugging Code 17.2

pp Adding Interactivity Using Scripting Activity 17F – Creating a Rollover Button Using JavaScript (p. 447) 17.2

Chapter 17 For more resources on this chapter, go to the Introduction to Web Design Web site at webdesign.glencoe.com.webdesign.glencoe.com Resources