Forms and Applications Web Design Professor Frank.

Slides:

Advertisements

Similar presentations

23-Aug-14 HTML/XHTML Forms. 2 What are forms? is just another kind of XHTML/HTML tag Forms are used to create (rather primitive) GUIs on Web pages Usually.

Advertisements

Creating dynamic and accessible content in Drupal 7 using WAI-ARIA Sarah Pulis Web Accessibility Evangelist DruaplCon | Content Authoring |

Video, audio, embed, iframe, HTML Form

Supplement Creating Forms. Objectives Show how forms are used How to create the Form element HTML elements used for creating input fields.

COS 125 DAY 25. Agenda Assignment #7 Graded  2 A’s, 3 B’s, 2 C’s, 1 D, 2 F’s (late) and 5 non-submit Assignment # 8 Due Today Assignment #9 is posted.

COS 125 DAY 23. Agenda Assignment 6 Corrected  5 A’s, 1 B, 1 C and 1 D  Problems with using CSS for layouts Assignment 7 is due today Assignment 7 Assignment.

Tutorial 6 Working with Web Forms

Computing Concepts Advanced HTML: Tables and Forms.

COS 125 DAY 26. Agenda Assignment #7 Graded  10 A’s, 4 B’s, and 1 non-submit Assignment # 8 Due April 27 Assignment #9 will be assigned in WebCT by Tuesday.

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.

Creating Web Page Forms

1 CS101 Introduction to Computing Lecture 12 Interactive Forms (Web Development Lecture 4)

Tutorial 6 Forms Section A - Working with Forms in JavaScript.

  Just another way to collect pieces together (like div, section)  Anything can be in there  Formatting just like all other elements.

User Interface Design using jQuery Mobile CIS 136 Building Mobile Apps 1.

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.

© 2011 Delmar, Cengage Learning Chapter 11 Adding Media and Interactivity with Flash and Spry.

© 2008 IBM Corporation Emerging Internet Technologies Real World Accessibility with ARIA Becky Gibson Web Accessibility Architect.

HTML Forms What is a form.

1 Forms A form is the usual way that information is gotten from a browser to a server –HTML has tags to create a collection of objects that implement this.

© 2011 Delmar, Cengage Learning Chapter 9 Collecting Data with Forms.

Yahoo! User Interface (YUI) Library Natly Mekdara.

Overview of Previous Lesson(s) Over View  ASP.NET Pages  Modular in nature and divided into the core sections  Page directives  Code Section  Page.

XHTML Introductory1 Forms Chapter 7. XHTML Introductory2 Objectives In this chapter, you will: Study elements Learn about input fields Use the element.

HTML - Forms By Joaquin Vila, Ph.D.. Form Tag The FORM tag specifies a fill-out form within an HTML document. More than one fill-out form can be in a.

SERVER web page repository WEB PAGE instructions stores information and instructions BROWSER retrieves web page and follows instructions Server Web Server.

HTML5 & WAI-ARIA Forms with jQuery Validation Paul J. Adam Accessibility

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.

Accessible DOM scripting with ARIA Léonie Watson

 2008 Pearson Education, Inc. All rights reserved Introduction to XHTML.

LOGO FORMs in HTML CHAPTER 5 Eastern Mediterranean University School of Computing and Technology Department of Information Technology ITEC229 Client-Side.

IDK0040 Võrgurakendused I harjutus 05: Forms Deniss Kumlander.

1 © Netskills Quality Internet Training, University of Newcastle HTML Forms © Netskills, Quality Internet Training, University of Newcastle Netskills is.

  Just another way to collect pieces together (like div, section)  Anything can be in there  Formatting just like all other elements  Always name.

HTML and FORMS.  A form is an area that can contain form elements.  Form elements are elements that allow the user to enter information (like text fields,

XHTML & Forms. PHP and the WWW PHP and HTML forms – Forms are the main way users can interact with your PHP scrip Typical usage of the form tag in HTML.

HTML Form Teppo Räisänen LIIKE/OAMK Basic Structure of a HTML Form The element defining a form is ’form’ Form’s most important attributes are The.

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.

HTML Forms A Preliminary Step into Dynamic Web Fred Durao

Button and Textbox. Input  Input objects are used to obtain input from the user viewing the webpage. They allow the user to interact with the Web. 

AJAX Compiled from “AJAX Programming” [Sang Shin] (Asynchronous JavaScript and XML)

IT Accessibility Committee Accessible Forms Prepared by the NYS Forum IT Accessibility Committee

Navigation and Presentation Design Peter Dolog dolog [at] cs [dot] aau [dot] dk Intelligent Web and Information Systems October 7, 2010.

Aria Roles Informing assistive technology. What are Aria Roles A way of conveying the role or state of content or functionality. Accessible Rich Internet.

Web Technologies Lecture 3 Web forms. HTML5 forms A component of a webpage that has form controls – Text fields – Buttons – Checkboxes – Range controls.

©SoftMooreSlide 1 Introduction to HTML: Forms ©SoftMooreSlide 2 Forms Forms provide a simple mechanism for collecting user data and submitting it to.

Tutorial 6 Working with Web Forms. 2New Perspectives on HTML, XHTML, and XML, Comprehensive, 3rd Edition Objectives Explore how Web forms interact with.

 Web pages originally static  Page is delivered exactly as stored on server  Same information displayed for all users, from all contexts  Dynamic.

HTML FORMS Basharat Mahmood, Department of Computer Science,CIIT,Islamabad,Pakistan. 1.

Week 8.  Form controls  Accessibility with ARIA.

OCR Nationals ICT – Unit 2 Task 4 Task Overview In this task you will create hyperlinks to link the pages together, link to other websites on the Internet.

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.

COS 125 DAY 17. Agenda  Assignment 7 not finished grading  Assignment 8 posted Due April 9  Capstone progress reports due  Quiz 2 Corrected 2 A’s,

Chapter 11 Adding Media and Interactivity. Chapter 11 Lessons Introduction 1.Add and modify Flash objects 2.Add rollover images 3.Add behaviors 4.Add.

Document Object Model Nasrullah. DOM When a page is loaded,browser creates a Document Object Model of the Page.

Internet & World Wide Web How to Program, 5/e Copyright © Pearson, Inc All Rights Reserved.

1 Web Engineering Forms Lecture 05. FORMS Its how HTML does interactivity. There are quite new feature in HTML5. But the fundamental idea does not change.

INTERNET APPLICATIONS CPIT405 Forms, Internal links, meta tags, search engine friendly websites.

HTML III (Forms) Robin Burke ECT 270. Outline Where we are in this class Web applications HTML Forms Break Forms lab.

FORMS Explained By: Jasdeep Kaur. Lecturer, Department of Computer Application, PGG.C.G., Sector: 42, Chandigarh.

1 Introducing Web Developer Tools Rapid application development tools ASP.NET-compatible web editors –Visual Studio.NET Professional Edition –Visual Studio.

Section 10.1 Define scripting

Web Systems Development (CSC-215)

Web Development & Design Foundations with H T M L 5

Forms, cont’d.

JavaScript Forms Adding User Input.

Presentation transcript:

Forms and Applications Web Design Professor Frank

Interactive Technologies Dynamic interactions Prompt feedback Feedback in context

Interactive Transactions

Technologies Add-on technologies – Flash, JavaScript Not as widely supported as HTML

Ajax Ajax = Asynchronous JavaScript and xml Relies on JavaScript Content is hidden from search engines

Ajax and Accessibility Screen readers can’t always “read” dynamic content Keyboard users might not recognize interface widgets PDAs/cell phones – Not enough horsepower to run technologies

New Accessibility Standards? ARIA – Accessible Rich Internet Applications Accessible Flash – in future

Designing Web Applications Restraint Simplicity

Design Patterns Recognizable patterns for interaction (ie drop- down menus) Proven effective Widely adopted

Design Patterns

Menus Collect data in standard format Select/drop-down Radio buttons Checkboxes

Input Fields/Text Areas Good for open-ended responses

Guiding Interaction Walk users through fields using instructions, labels, prompts, and design patterns, explaining what is expected and how the page works

Field Labels Explain information being requested tag associates a label with its element using the “id” attribute

Help and Instructions

Default Text

Provide Users Feedback