Week 10. Form controls Parent containing element for other form control elements Requires method...
-
Upload
abraham-morris -
Category
Documents
-
view
212 -
download
0
Transcript of Week 10. Form controls Parent containing element for other form control elements Requires method...
COMP 135Web Site Design
IntermediateWeek 10
Forms Form controls
<form> element Parent containing element for other
form control elements
Requires method and action attributes to process the information collected by the form
Actions are usually scripts processed by the web server; can also be used to create an electronic mail message
Form Input Control Elements Multiple ways to collect data
• <input> element• <select> element• <textarea> element
type attribute for <input> element determines both its behaviour and presentation
<input> element type determines type of element
text password checkbox radio file submit reset button
<select> element Use when checkboxes and radio buttons
become too inefficient
Choices defined by the <option> element• The label attribute can be used to present a shortened
version of an option when appearing in an optgroup
Can be grouped using the <optgroup> element • The label attribute can be used to identify the options
of an option group Multiple selections allowed by setting multiple attribute to value of “multiple”
<textarea> element Function identical to the <input type=“text”> element but allows for multiple lines of text to be entered
name Attribute Data collected from form controls are
associated to a value specified by the name attribute of the form control element that collected the information
The name value is like a variable that contains the form input value
<label> element Used for marking up a form control’s
descriptive text Has no presentation value unless
styled with CSS Provides two features:
• Usability Improvement for mouse users – clickable area
• Accessibility Make a form control’s purpose clearer for users
of assistive technologies
for attribute The glue that binds the text inside
the label element with the form control it is related (explicit association)
If you wrap a form control inside a <label> </label> you could skip the for attribute (implicit association)
Best practice: do both
What to Expect in Web Site Design Advanced
Web Servers• Apache, Microsoft IIS
Web Server Technologies:• PHP, MySQL, TLS/SSL
Survey of responsive image solutions JavaScript frameworks Web Applications
• CMS (Drupal, WordPress, etc)• Creating/modifying themes