1. ARTDM 171, Week 14:
Forms
Gilbert Guerrero
gguerrero@dvc.edu
gilbertguerrero.com/blog/artdm-171/

2. Forms

3. What is a Web form?
• Any interaction where data is sent from
the userʼs browser
• Usually sent directly to the server
• Not a standard document request or a
“click”
• Basis of complex interactivity on the Web
• Allow you to ask your users questions and
receive answers

4. What is a Web form?
• Forms rely on scripts to process the
answers to questions
o Client-side: possible to use JavaScript to
provide canned feedback to users
o Server side: using CGI (common gateway
interface) or a script embedded in a PHP or
other dynamic page. CGI scripts are using
written in Perl.
o AJAX: latest trend combines client-side w/
server-side to anticipate users behaviors

5. Forms on the Web
• Common uses of forms on the Web:
o Site search box
o Newsletter subscription
o Login
o Feedback form / Contact form
o Shopping order forms and payment

6. Web forms in action
• Search: Google
• AJAX: Google Maps
Add Google search to your site use
Google Custom Search

7. Web forms in action
• Community and Art: Miranda July,
Learning to Love You More
• Experimental Art: Mouchette and
Mouchette.net

8. Creating a Contact Form in
Dreamweaver

9. Let's create a Contact Form
• This form will send data in an email message to
you.
• Use the PHP script supplied to process the data
• Fields used in the form
o name: text field that captures the user's name
o from: text field that captures the email address
o subject: text field for the message subject
o message: textarea field for the user's message
o action: hidden field that validates sending the message
o submit: button that submits the form

10. A Basic Form
<form action="thankyou.php" method="post"
name="contact">
<input type="text" value=""
name="name" id="name" />
<input type="submit" value="Send"
name="submit" id="submit" />
</form>

11. PayPal

12. Adding PayPal
• PayPal Integration Center
• Buy Now Buttons
• Shopping Cart
Example of a basic storefront using PayPal:
Teas by Kathleen

13. Final Projects

14. Timeline
March April May Last day of class
9 16 23 30 6* 13 20 27 4 11 18 25
Strategy
Present final projects
Research and discovery (two days)
Design
Interaction design
Validation
Visual design
Site development
Prototyping (Text-only HTML) Present
revisions
Layout and styling (CSS)
User interface dev
(images and backgrounds)
Production

15. Homework due May 4
• Finish working on your Contact Form and
add it to your final project site
• Read Metacrap: Putting the torch to
seven straw-men of the meta-utopia by
Cory Doctorow
• Read Chapter 5: Including Images and
Media in the Dreamweaver textbook
• Work on your final project. This week:
Add images and backgrounds

16. Thank you