1 / 19

Labels and Tags

Labels and Tags. June 6, 2014. Grammar. A set of components and rules that define a method/means of communication among objects. Components are the lexical elements of the language Rules are expressed in the syntax of the language Every language has a grammar! Programming languages

lilith
Télécharger la présentation

Labels and Tags

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. Labels and Tags June 6, 2014

  2. Grammar • A set of components and rules that define a method/means of communication among objects. • Components are the lexical elements of the language • Rules are expressed in the syntax of the language • Every language has a grammar! • Programming languages • Spoken languages • Written languages

  3. Specification Methods • Natural-language specifications • Natural-language extensions • Formal language • Specified grammar • Effective lexical processors/analyzers • Semi-formal languages • Grammars • Conversation Diagrams • State Charts • User Action Notation Better for describinghuman computer communications

  4. Grammars in a Software Context • Standalone concept • Grammar that defines/describes object • Grammar that defines/describes and interchange • Application of the concept • SGML • HTML • XML

  5. Grammars • BNF (Backus-Naur form) helpful in describing programming languages • Describes objects that occur in computer based interchanges • Example: <Telephone book entry> ::= <Name> <Telephone number> <Name> ::= <Last name> <First name> <Last name> ::= <string> <First name> ::= <string> <string> ::= <character> | <character><string> <character> ::= A|B|C|D|E|F|G|H|I|J|K|L|M|N|O|P|Q|R|S|T|U|V|W|X|Y|Z <Telephone number> ::= <area code> <exchange>-<local number> <area code> ::= <digit><digit><digit> <exchange> ::= <digit><digit><digit> <local number> ::= <digit><digit><digit><digit> <digit> ::= 0|1|2|3|4|5|6|7|8|9

  6. Multiparty Grammars • Language structure to accommodate more than one participant • The person (“U”) • The computer (“C”) • Effective for text-oriented command sequences <Session> ::= <U: Opening> <C: Responding> <U: Opening> ::= LOGIN <U: Name> <U: Name> ::= <U: string> <U: string> ::= <U: character> <U: character> ::= A|B|C|D|E|F|G|H|I|J|K|L|M|N|O|P|Q|R|S|T|U|V|W|X|Y|Z <C: Responding> ::= HELLO [<U: Name>]

  7. Example

  8. Data elements Catalog/SKU information Item description Quantity Unit price Discount terms Build a grammar that describes Line Item screen Structure Data elements Messages Conversation PROGRAM ERROR MESSAGE W/PROMPTS LINE ITEM SCREEN Name Department Location Phone Faxe-mail Grammar Analysis of a Conversation Diagram

  9. <line item entry> ::= <catalog/SKU><item description> <quantity><unit price><discount terms> <catalog/SKU> ::= <string> - <string> <string> ::= <character> | <character><string> <character> ::=A|B|C| . . . |X|Y|Z|0|1|2|. . . |8|9 <item description> ::= <string> <string> ::= <character> | <character><string> <character> ::=A|B|C| . . . |X|Y|Z|0|1|2|. . . |8|9 <quantity> ::= <digit><digit><digit> <digit> ::= 0|1|2|3|4|5|6|7|8|9 <unit price> ::= $ <digit><digit><digit> . <digit><digit> <digit> ::= 0|1|2|3|4|5|6|7|8|9 <discount terms> ::= <digit><digit> . <digit> % <digit> ::= 0|1|2|3|4|5|6|7|8|9 Grammar of the Data Elements Described thedata elementsto be enteredby the user (inthis case, thepurchasingagent.

  10. <line item session> ::=<C:prompt><U:respond><C:message> <C:prompt> ::= ENTER NEXT LINE ITEM CATALOG/SKU <U:catalog/SKU>ITEM DESCRIPTION <U:item description>QUANTITY <U:quantity>UNIT PRICE<U:unit price>DISCOUNT TERMS <U:discount terms> <U:respond> ::= <U:catalog/SKU><U:item description><U:quantity><U:unit price><U:discount terms> <U:catalog/SKU> ::= <U:string> - <U:string> <U:string> ::= <U:character> | <U:character><U:string> <U:character> ::=A|B|C| . . . |X|Y|Z|0|1|2|. . . |8|9 <U:item description> ::= <U:string> <U:string> ::= <U:character> | <U:character><U:string> <U:character> ::=A|B|C| . . . |X|Y|Z|0|1|2|. . . |8|9 <U:quantity> ::= <U:digit><U:digit><U:digit> <U:digit><U:digit><U:digit> <U:unit price> ::= <U:digit><U:digit><U:digit> . <U:digit><U:digit> <U:digit> ::= 0|1|2|3|4|5|6|7|8|9 <U:discount terms> ::= ><U:digit><U:digit> . <U:digit> <U:digit> ::= 0|1|2|3|4|5|6|7|8|9 <C:message> ::= ERROR : <C:string> | ACCEPTED <C:prompt> <C:string> ::= <C:character> | <C:character><C:string> <C:character> ::= A|B|C| . . . |X|Y|Z|0|1|2|. . . |8|9 Grammar of the Screen Session

  11. Using Tags to Create a WEB Page

  12. Document tags divide up a Web page into its basic sections (e.g, header information, text, and graphics). HTML The first and last tags in a document should always be the HTML tag. These are the tags that tell a Web browser where the HTML in your document begins and ends. <HTML> </HTML>The above sequence of tags will give you a blank web screen. HEAD The HEAD tags contain all of the document's header information. TITLE This container is placed within the HEAD structure. Between the TITLE tags, you should have the title of your document. This will appear at the top of the browser's title bar, and also appears in the history list. Finally, the contents of the TITLE container go into your bookmark file, if you create a bookmark to a page. DOCUMENT TAGS

  13. DOCUMENT TAGS • BODY • BODY comes after the HEAD structure. Between the BODY tags, all of the text, the graphics, and links, are displayed. • <HTML><HEAD> <TITLE>Document title</TITLE> • </HEAD>  <BODY>  </BODY> • </HTML> • What would this HTML document look like • COMMENT • Precede comments with an exclamation point (!) inside the angle brackets • <!-- Hi, I'm a comment. --> • Appear only in the code – not on the screen • Why are Comment Tags important???

  14. TEXT STRUCTURE • HEADINGS • The heading structures are most commonly used to set apart document or section titles. • Heading structures go into the body of the document. • Six levels of headings • Heading 1 (H1) is "most important" and Heading 6 (H6) is "least important." • By default, browsers will display the six heading levels in the same font, • Point size decreasing as the importance of the heading decreases. • <H1>Heading 1</H1> • <H2>Heading 2</H2> • <H3>Heading 3</H3> • <H4>Heading 4</H4> • <H5>Heading 5</H5> • <H6>Heading 6</H6>

  15. TEXT STRUCTURE • Paragraphs • Common in Web pages. • Most basic structures in HTML. • Page is composed of a number of sections; each section composed of at least one paragraph. • The beginning of a paragraph is marked by <P>, and the end by </P>. • Line Break • BEGINS AND ENDS WITH A <BR> tag. • Forces a line break • Whatever is after the <BR> tag will start from the left margin of the next line on the screen.) • THERE IS NO </BR> TAG. • Blockquote • Used to quote long pieces of material and set apart from the rest of the text. Blockquotes are set up as follows: • <blockquote> ...text... </blockquote>

  16. LISTS • Unordered Lists • Like a MS Word "bullet list." • Each list item is preceded by a "bullet" or burgher dot • Begins with the tag <UL> and and ends with the tag </UL> • Each item in the list is marked using the <LI> and ends with a </L1> tag, • Stands for "List Item." • Example: • <UL> <LI>Monday <LI>Tuesday <LI>Wednesday <LI>Thursday <LI>Friday </UL>would be displayed as • Monday • Tuesday • Wednesday • Thursday • Friday

  17. LISTS • Ordered Lists • Lists can also be ordered. • Use <OL> and </OL>, instead of <UL> and </UL>. • Ordered lists display numerated sequential group of items. • <OL> <LI>Monday <LI>Tuesday <LI>Wednesday <LI>Thursday <LI>Friday </OL>The above markup, similar to the previous slide, would look like this: • Monday • Tuesday • Wednesday • Thursday • Friday

  18. ANCHORS • HREF • Stands for "Hypertext REFerence," • Refers to the location of the file you want to load. • Anchors take the following form <A HREF="URL">, where URL is the location of the resource you want to skip to. • For example, a message to visit the PSU IST web site "http://www.ist.psu.edu" that would be be displayed on a web page as:“Checkout http://www.ist.psu.edu to see the Penn State IST web site “ would be coded as“Check out <A HREF="http://www.ist.psu.edu/"> to see the Penn State IST web site </A> • You can also reference a mail to address. For example • “Send inquiries to: <A HREF=“mailto:exg13@psu.edu”> Professor Green </A>

  19. IMAGES • IMG • Use use an SRC attribute. • The URL of the graphic you want to have displayed on your Web page. Thus, a typical image tag will take the form: • <IMG SRC="URL of graphic"> • ALIGN • Screen space can be wasted when graphics are integrated into paragraphs. • Text can be “ALIGNED” within the vertical space which is created by the graphic. • Text lined up with the bottom of the graphic, or can align it to either the top or the middle of the graphic using the ALIGN attribute • <IMG SRC="generic-image.gif" ALIGN=top> • Causes the top of any text on the same line as that graphic to be aligned with the top of the graphic. There is also an • ALIGN=middle option, • Align the text's baseline with the middle of the graphic, and of course • ALIGN=bottom, • Default display strategy for most browsers

More Related