Learning Aim C.  In this section we will look at how text, tables, forms and frames can be used in web pages.

Slides:



Advertisements
Similar presentations
Chapter 1: Introduction. Contents Whats New in Dreamweaver CS4? The Dreamweaver CS4 Interface Setting Up a Site Creating a Web Page Adding Text to Your.
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?
Dreamweaver Forms Overview. Forms – A Little Review Most user/webpage communication is one way, like this: Most user/webpage communication is one way,
KompoZer. This is what KompoZer will look like with a blank document open. As you can see, there are a lot of icons for beginning users. But don't be.
Authoring Languages and Web Authoring Software 4.01 Examine web page development and design.
Tutorial 6 Creating a Web Form
Images, Tables, lists, blocks, layout, forms, iframes
Microsoft Word Objectives: Word processing using Microsoft Word
Macromedia Dreamweaver 4 Foundation Level Course.
Tutorial 6 Working with Web Forms
Computing Concepts Advanced HTML: Tables and Forms.
Personal Independent Networking Project HTML Forms by Chris Smith.
Macromedia Dreamweaver 4 Advanced Level Course. Add Rollovers Rollovers or mouseovers are possibly the most popular effects used in designing Web pages.
Tutorial 6 Working with Web Forms. XP Objectives Explore how Web forms interact with Web servers Create form elements Create field sets and legends Create.
4.01B Authoring Languages and Web Authoring Software 4.01 Examine webpage development and design.
Pasewark & Pasewark 1 Access Lesson 4 Creating and Modifying Forms Microsoft Office 2007: Introductory.
Access 2007 ® Use Databases How can Microsoft Access 2007 help you to enter and organize information?
Access Lesson 4 Creating and Modifying Forms
Creating Web Page Forms
Lesson 8 Creating Forms with JavaScript
1 ADVANCED MICROSOFT WORD Lesson 15 – Creating Forms and Working with Web Documents Microsoft Office 2003: Advanced.
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.
 Using Microsoft Expression Web you can: › Create Web pages and Web sites › Set what you site will look like as you design it › Add text, images, multimedia.
Web Design Dreamweaver Semester 2 ATBs. ATB #1 What is a web site?
XP Tutorial 6New Perspectives on HTML and XHTML, Comprehensive 1 Creating Web Page Forms Designing a Product Registration Form Tutorial 6.
Lesson 13: Building Web Forms Introduction to Adobe Dreamweaver CS6 Adobe Certified Associate: Web Communication using Adobe Dreamweaver CS6.
Copyright © Texas Education Agency, All rights reserved. 1 Web Technologies Website Development with Dreamweaver.
WEB FORM DESIGN. Creating forms for a web page For your web project you have to design a form for inclusion on your web site (the form information should.
Chapter 5 Java Script And Forms JavaScript, Third Edition.
Project Four Forms Discuss form processing Describe the difference between client-side and server-side form processing Add a horizontal rule to a Web page.
© 2011 Delmar, Cengage Learning Chapter 9 Collecting Data with Forms.
© 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.
HTML II. Factors to consider in designing a website. Organizing your files. HTML Tables. Unordered Lists. Ordered Lists. HTML Forms. Learning Objectives.
10 Adding Interactivity to a Web Site Section 10.1 Define scripting Summarize interactivity design guidelines Identify scripting languages Compare common.
Creating a Web Site to Gather Data and Conduct Research.
Website Development with Dreamweaver
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.
 2008 Pearson Education, Inc. All rights reserved Introduction to XHTML.
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.
 Whether using paper forms or forms on the web, forms are used for gathering information. User enter information into designated areas, or fields. Forms.
Macromedia Dreamweaver 8-- Illustrated Introductory 1 Macromedia Dreamweaver 8 Unit H Collecting Data with HTML Forms.
Dreamweaver MX. 2 Overview of Templates n Forms enable you to collect data from ______. n A form contains ________ such as text fields, radio buttons,
HTML : Forms, Frames Instructor: Mr. Ahmed Al Astal ITGD4104 Department Requirement for senior student University of Palestine Faculty of IT.
Tutorial 6 Working with Web Forms. XP Objectives Explore how Web forms interact with Web servers Create form elements Create field sets and legends Create.
Tutorial 6 Working with Web Forms. 2New Perspectives on HTML, XHTML, and XML, Comprehensive, 3rd Edition Objectives Explore how Web forms interact with.
1 HTML Forms
Microsoft FrontPage 2003 Illustrated Complete Creating a Form.
HTML Forms. Slide 2 Forms (Introduction) The purpose of input forms Organizing forms with a and Using different element types to get user input A brief.
4.01B Authoring Languages and Web Authoring Software 4.01 Examine webpage development and design.
WEB FORM DESIGN. Creating forms for a web page For your web project you have to design a form for inclusion on your web site (the form information should.
Tutorial 6 Working with Web Forms. 2New Perspectives on HTML, XHTML, and XML, Comprehensive, 3rd Edition Objectives Explore how Web forms interact with.
Creating Web Page Forms COE 201- Computer Proficiency.
HTML Forms.
Internet & World Wide Web How to Program, 5/e Copyright © Pearson, Inc All Rights Reserved.
Learning Aim C.  Creating web pages involves many considerations.  In this section we will look at the different software tools you can use and how.
Integrating Components and Dynamic Text Boxes with the Animated Map– Lesson 101 Integrating Components and Dynamic Text Boxes with the Animated Map Lesson.
Tutorial 6 Creating a Web Form
HTML Tutorial. What is HTML HTML is a markup language for describing web documents (web pages) HTML documents are described by HTML tags Each HTML tag.
Dreamweaver - Forms questionnaire, register, login, etc.
Ashima Wadhwa Java Script And Forms. Introduction Forms: –One of the most common Web page elements used with JavaScript –Typical forms you may encounter.
Creating and Processing Web Forms
Create and edit web pages 4
Objectives Design a form Create a form Create text fields
Building a User Interface with Forms
Section 10.1 YOU WILL LEARN TO… Define scripting
Unit I: Collecting Data with Forms
Create and edit web pages 2
Presentation transcript:

Learning Aim C

 In this section we will look at how text, tables, forms and frames can be used in web pages.

 All websites contain a certain amount of text.  The recommended way to format the text on a website is to use CSS (described later in the unit), rather than use individual text formatting options as you would in a word processing program.  However, individual text formatting can be applied using to tool bar at the bottom of the Dreamweaver® editing window.

 Tables are useful not only for displaying tabular information but can also be used to lay out your web page.

 You can create simple forms easily with Adobe® Dreamweaver®, but to process the form entries once the user has completed them, you need to create programs which run on the web server that hosts the site.  This is beyond the scope of this unit.  However, it is useful to know how to create forms.  Also you can use JavaScript in web pages to make sure the entries in a form are correct before it is sent to the server.  For example, if a form field requires the user to enter a date, JavaScript can be used to check if the date is valid and display an error message to the user if it is not.

 There are a number of different types of input methods you can use on a form, the simplest being a text field.

 Text areas provide a larger, multi-line area into which text can be entered.

 A radio button is a type of user interface feature which allows users to select only one option, not multiple ones.  For example, a pair of buttons labelled Male and Female would allow a user to indicate their gender, and so only one button can be selected.

 You can also add check boxes to your form.  Unlike radio buttons, any number of these can be checked.

 A drop-down box from which a user can select a single item.

 Your form needs to end with a 'Submit' button. If you have a client-side script that validates the form, clicking the Submit button will link to the validation script.  Clicking the button will also submit the form to the web server where the data the user has entered can be processed.  Insert a button using the same method as the other input methods.  You usually leave the label blank for a button.

 In the past, frames were widely used to split web pages into sections, but they have now been replaced by better ways of formatting a page, such as cascading style sheets (CSS).  Frames are essentially two or more web pages displayed together to give a layout effect, such as a header or a side bar.