1 / 18

Using Nested Symbols To Generate Web Pages

Using Nested Symbols To Generate Web Pages. Scott Luebking. Usability Mistakes When Handling User Form Errors. Returned page has only error messages User has to return to previous web page and remember errors Returned page has error messages only at top

nerita
Download Presentation

Using Nested Symbols To Generate Web Pages

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript


  1. Using Nested Symbols To Generate Web Pages Scott Luebking

  2. Usability Mistakes When Handling User Form Errors • Returned page has only error messages • User has to return to previous web page and remember errors • Returned page has error messages only at top • User has to search for the field with error • Occasionally form on returned page with error messages doesn’t have values initially entered by users • User has to re-enter data

  3. Symbolizing A Form • Need ability to integrate user’s initial form values into error message web page • A function introduces temporary symbols of format <<symbol-name>> into a form • double << and >> helps reduce potential conflict

  4. Symbolizing Text and Radio • Text field • <INPUT NAME=ph> • <INPUT NAME=ph VALUE=<<FORM-ph>> > • Any pre-existing VALUE attribute is deleted • Radio field • <INPUT TYPE=RADIO NAME=p VALUE=z> • <INPUT TYPE=RADIO NAME=p VALUE=z <<FORM-p=z>>> • Any CHECKED attribute is deleted • Checkbox field • Like radio field

  5. Symbolizing Textarea and Select • Textarea field • <TEXTAREA NAME=a></TEXTAREA> • <TEXTAREA NAME=a><<FORM-a>></TEXTAREA> • Text in textarea container is removed • Select field • <SELECT NAME=z> <OPTION VALUE=a> • <SELECT NAME=z> <OPTION VALUE=a <<FORM-z=a>> > • Any SELECTED attribute in OPTION is deleted

  6. Additional Major Benefit To Symbolizing A Form • Could just specify values in form after determining what the errors are • While symbolizing, the function can also gather information about the fields which can be useful for error checking • types of fields • maximum size of text or password fields • expected values for RADIO, CHECKBOX or SELECT fields

  7. Simplified Symbol Process • Symbolize form and gather information about the fields • Check user data using information about fields • If data errors • Create a symbol table • Put symbols in symbol table containing user-specified values for types of fields • FORM-firstname => “John” • Replace temporary symbols in form with values in symbol table

  8. Using SymbolsFor Error Messages • The concept of symbols in forms can also be used for handling error messages • Symbols can be placed in the form where error messages would go • <<ERROR-zip>> <INPUT NAME=zip SIZE=5>

  9. General Symbol Process • Create a symbol table • Symbolize form and gather information about the fields • Check user data using information about fields • Put symbols for errors messages in symbol table • ERROR-zip => “Please specify a zip code. <P>” • If data errors • Put symbols in symbol table containing user-specified values for types of fields • FORM-firstname => “John” • Replace symbols in form with values in symbol table

  10. Benefits of Using Symbols For Error Messages • Code which is checking data and generating error messages doesn’t need to know where the error message is going on the page • Can change location of error message and not worry about changing the data checking code

  11. Various Error Message Formats PLAIN ERROR MESSAGE ERROR-zip => “Please enter zip code.<P>” Result: Please enter zip code. BOXED ERROR MESSAGE ERROR-zip => <TABLE BGCOLOR=“YELLOW”> <TR> <TD> <STRONG>Please enter zip code.</STRONG> </TD> </TR> </TABLE> Result: Please enter zip code.

  12. Using Nested Symbols Symbols ERROR-zip => <TABLE BGCOLOR=“<<ERROR-BACKGROUND>>“> <TR> <TD> <STRONG>Please enter zip code.</STRONG> </TD> </TR> </TABLE> ERROR-BACKGROUND => YELLOW Resulting HTML <TABLE BGCOLOR=“YELLOW”> <TR> <TD> <STRONG>Please enter zip code.</STRONG> </TD> </TR> </TABLE> Can easily change background color by changing symbol

  13. More Nested Symbols ERROR-zip => <<BEGIN-ERROR>> Please enter zip code. <<END-ERROR>> BEGIN-ERROR => <TABLE BGCOLOR=“<<ERROR-BACKGROUND>>“> <TR><TD> <STRONG> END-ERROR => </STRONG> </TD> </TR> </TABLE> ERROR-BACKGROUND => YELLOW

  14. More Nested Symbols ERROR-zip => <<BEGIN-ERROR>> Please enter zip code. ( 3 / <<ERROR-COUNT>>) <<END-ERROR>> ERROR-COUNT => 7 • Shows which number the error message is of all the error messages • The ERROR-COUNT symbol doesn’t need to be specified until after all the error messages are created.

  15. Additional Ways To Use Symbols • Web page configuring • <BODY BGCOLOR=“<<project-page-background>>” > • <<project-left-menu>> • User identity • Portal page for <<user-full-name>> in <<user-city>>. • Time-sensitive greeting • greeting => ( “Good morning”, “Good afternoon”, ...) • User-specific information / functionality • <<additional-manager-info>> • <<info-for-developer>>

  16. More Ways To Use Symbols • Data from databases • <<retrieved-article>> • <<student-list>> • <<subject-search-results>> • Multiple languages • day-of-week-text => (“Monday”, “Montag”, ...) • Symbols can also be used to generate web pages which don’t have forms

  17. Symbols and XML • Each has benefits: • Symbols can be a easier concept to learn • Symbols can be faster to process • XML supports much more complicated information structures • The two methodologies can support each other: • The output from processing symbols can be passed to XML processors • XML can be used to create strings to store in symbol tables

  18. Summary • Symbols can help improve the usability of web pages which are reporting user form errors • Symbols can be very useful when generating certain types of dynamic web pages • Symbols and XML can support each other • A dynamic web page generator (DWPG) perl class • form symbolizer • symbol table creator for user-entered data • symbol processor • macro processor

More Related