Software Methods

1
Software Methods
Content 1. Markup Languages HTML, XML 2.
Object Middleware, Java Beans
2
Introduction

• Markup Language
• A set of markup conventions used together for
  encoding texts.
• Specify what markup is allowed, how markup is to
  be distinguished from text and what the markups
  means
• Two types of markup languages
• Descriptive describe what the contents are and
  mean, but let the users (browsers) interpret them
  and display them in their own ways
• Procedural instruct the users (browsers) how to
  display the text, what font size to use, how much
  space it should move after a certain is printed,
  etc

3
Introduction (cont.)

• HTML
• HyperText Markup Language
• Not a procedural programming language like C,
  Fortran, Cobol or Pascal
• Markup language
• Identify elements of a page so that a browser can
  render that page on your computer screen
• Separate presentation of a document and structure
  of that document

4
Markup Languages

• Markup language
• Used to format text and information
• HTML
• Marked up with elements, delineated by tags
• Tags keywords contained in pairs of angle
  brackets
• HTML tags
• Not case sensitive
• Good practice to keep all the letters in one case
• Forgetting to close tags is a syntax error

5
Editing HTML

• HTML files or documents
• Written in source-code form using text editor
• Notepad Start-Programs-Accessories
• HTML-Kit http//www.chami.com/html-kit
• HTML files
• .htm or .html extensions
• Name your files to describe their functionality
• File name of your home page should be index.html
• Errors in HTML
• Usually not fatal

6
Common Tags

• Always include the ltHTMLgtlt/HTMLgt tags
• Comments placed inside lt!----gt tags
• HTML documents
• HEAD section
• Info about the document
• Info in header not generally rendered in display
  window
• TITLE element names your Web page
• BODY section
• Page content
• Includes text, images, links, forms, etc.
• Elements include backgrounds, link colors and
  font faces
• P element forms a paragraph, blank line before
  and after

7
An Simple Example
8
Headers

• Headers
• Simple form of text formatting
• Vary text size based on the headers level
• Actual size of text of header element is selected
  by browser
• Can vary significantly between browsers
• CENTER element
• Centers material horizontally
• Most elements are left adjusted by default

9
Header Elements H1 through H6
10
Header Elements H1 through H6 (cont.)
11
Text Styling

• Underline style
• ltUgtlt/Ugt
• Align elements with ALIGN attribute
• right, left or center
• Close nested tags in the reverse order from which
  they were opened
• Emphasis (italics) style
• ltEMgtlt/EMgt
• Strong (bold) style
• ltSTRONGgtlt/STRONGgt
• ltBgt and ltIgt tags deprecated
• Overstep boundary between content and presentation

12
Styling Text on Web Pages
13
Styling Text on Web Pages (cont.)
14
Linking

• Links inserted using the A (anchor) element
• Requires HREF attribute
• HREF specifies the URL you would like to link to
• ltA HREF addressgtlt/Agt
• Can link to email addresses, using
• ltA HREF mailtoemailaddressgtlt/Agt
• Note quotation mark placement

15
Linking to other Web Pages
16
Linking to other Web Pages (cont.)
17
Linking to an Email
18
Images

• Images as anchors
• Background color
• Preset colors (white, black, blue, red, etc.)
• Hexadecimal code
• First two characters for amount of red
• Second two characters for amount of green
• Last two characters for amount of blue
• 00 is the weakest a color can get
• FF is the strongest a color can get
• Ex. black 000000

19
Images (cont.)

• Image background
• ltBODY BACKGROUND backgroundgt
• Image does not need to be large as browser tiles
  image across and down the screen
• Pixel
• Stands for picture element
• Each pixel represents one addressable dot of
  color on the screen
• Insert image into page
• Use ltIMGgt tag
• Attributes
• SRC location
• HEIGHT (in pixels)
• WIDTH (in pixels)
• BORDER (black by default)
• ALT (text description for browsers that have
  images turned off or cannot view images)

20
Images (cont.)
21
Formatting Text with ltFONTgt

• FONT element
• Add color and formatting to text
• FONT attributes
• COLOR
• Preset or hex color code
• Value in quotation marks
• Note you can set font color for whole document
  using TEXT attribute in BODY element

22
Formatting Text with ltFONTgt (cont.)

• SIZE
• To make text larger, set SIZE x
• To make text smaller, set SIZE -x
• x is the number of font point sizes
• FACE
• Font of the text you are formatting
• Be careful to use common fonts like Times, Arial,
  Courier and Helvetica
• Browser will display default if unable to display
  specified font
• Example
• ltFONT COLOR red SIZE 1 FACE
  Arialgtlt/FONTgt

23
Formatting Text with ltFONTgt (cont.)
24
Using the FONT Element to Format Text
25
Special Characters, Horizontal Rules and More
Line Breaks

• Special characters
• Inserted in code form
• Format always code
• Ex. amp
• Insert an ampersand
• Codes often abbreviated forms of the character
• Codes can be in hex form
• Ex. 38 to insert an ampersand
• Strikethrough with DEL element
• Superscript SUP element
• Subscript SUB element

26
Special Characters
27
Inserting Special Characters into HTML
28
Special Characters, Horizontal Rules and More
Line Breaks (cont.)

• Horizontal rule
• ltHRgt tag
• Inserts a line break directly below it
• HR attributes
• WIDTH
• Adjusts the width of the rule
• Either a number (in pixels) or a percentage
• SIZE
• Determines the height of the horizontal rule
• In pixels
• ALIGN
• Either left, right or center
• NOSHADE
• Eliminates default shading effect and displays
  horizontal rule as a solid-color bar

29
Horizontal Rules
30
Using Horizontal Rules
31
Introduction to XML

• XML
• Markup language for describing structured data
  content is seperated from presentation
• XML documents contain only data
• Applications decide how to display the data
• Language for creating markup languages
• Can create new tags
• Possible to search, sort, manipulate and render
  XML using Extensible Stylesheet Language (XSL)
• Highly portable
• Files end in the .xml extension

32
Introduction to XML (cont.)

• XML parsers
• Check an XML documents syntax
• Support either the
• Document Object Model (DOM)
• Build a tree structure containing the XML
  documents data
• Simple API for XML (SAX)
• Process the document and generate events
• Document Type Definition (DTD) files
• Defines grammatical rules for the document
• Used to check the XML document structure against

33
Structuring Data

• Element types
• Can be declared to describe data structure
• XML elements
• Root element
• Must be exactly one per XML document
• Contains all other elements in document
• Lines preceding the root element are called the
  prolog
• Container element
• Contains sub-elements (children)
• Empty element
• No matching end tag
• In HTML, IMG

34
Structuring Data (cont.)
35
IE5 Displaying article.xml
36
Business letter with DTD
37
Business letter with DTD (cont.)
38
Business letter formatted by XSL
John Doe 123 Main Street Anytown,
Anystate 12345 555-4321 Joe Schmoe Box
12345 15 Any Ave. Othertown, Otherstate
67890 555-4321 Dear Sir, It is our privilege
to inform you about our new database managed with
XML. This new system allows you to reduce the
load on your inventory list server by having the
client machine perform the work of sorting and
filtering the data. Sincerely, Mr. Doe
39
Document Type Definitions (DTD)

• Document Type Definition
• Specify list of element types, attributes and
  their relationships to each other
• Optional, but recommended for program conformity
• !Element
• Element type declaration defines the rules for
  an element
• Plus sign () one or more occurrences
• Asterisk () any number of occurrences
• Question mark (?) either zero or exactly one
  occurrence
• Omitted operator exactly one occurrence
• PCDATA
• The element can store parsed character data

40
Document Type Definitions (DTD) (cont.)

• !ATTLIST
• Defines attributes for an element
• IMPLIED
• Can assign its own type attribute or ignore
• REQUIRED
• The specified attribute must be declared in the
  document
• FIXED
• The Specified attribute must be declared with
  given value

41
Business Letter DTD
42
Customized Markup Languages

• Customized Markup Languages
• Can create own tags to describe data, creating a
  new markup language
• Example
• MathML
• Developed by W3C for describing mathematical
  notations and expressions

43
Customized Markup Languages (cont.)

• Other Examples
• Wireless Markup Language (WML)
• Allows portions of Web pages to be displayed on
  wireless devices
• Works with Wireless Application Protocol (WAP)
• Extensible Business Reporting Language (XBRL)
• Facilitates the creation, exchange and validation
  of financial information
• Electronic Business XML (ebXML)
• Used for exchanging business data

44
Object Middleware

• A popular middleware is CORBA (Common Object
  Request Broker Architecture) which is a
  client-server middleware that enables a client to
  invoke a method on a server object either in the
  same machine or across a network.

Client
Object
Request
Result
Object Request Broker
45
Java Beans (Java Applets)

• A Java applet is a program written in the Java
  programming language that can be included in an
  HTML page, much in the same way an image is
  included.
• When you use a Java technology-enabled browser to
  view a page that contains an applet, the applet's
  code is transferred to your system and executed
  by the browser's Java Virtual Machine.

Network
Java beans
Java bean to be run here
Server
Client PC
46
Main References

• e-Business e-Commerce How to Program, H.M.
  Deitel, P.J. Deitel and T.R. Nieto, Prentice
  Hall, 2000.
• The XML Companion, Neil Bradley, Addison-Wesley,
  1998.
• eBusiness Essentials Technology and Network
  Requirements for Mobile and Online Markets, 2/e,
  by Mark Norris and Steve West, John Wiley Sons.