2. HW 1 and 2 Review
• HW 1 Example – http://pirate.shu.edu/~marinom6/mattmarino.html
• HW 2 Example – http://pirate.shu.edu/~marinom6/schedule.html
• Please Note only previously due HW assignments are posted on my
pirate.shu.edu web space
3. HTML Review
• <a href=“websitelink.com”>Website Link</a> serves as code for
hyperlinking a website
• As discussed href is “hyperlink reference”
• The <h1></h1> tag represents a header
• <h2></h2>, <h3></h3>, etc. also exist and get smaller
4. <div></div> tag
• The <div> tag defines a division or a section in an HTML document.
• The <div> tag is used as a container for HTML elements - which is then styled with
CSS or manipulated with JavaScript.
• The <div> tag is easily styled by using the class or id attribute.
• Any sort of content can be put inside the <div> tag!
• Note: By default, browsers always place a line break before and after the <div>
element.
• For our purpose, it is important to note the <div> tag serves as a break for a
paragraph [<p></p> tag]
5. XHTML Basics
• XHTML stands for EXtensible HyperText Markup Language
• XHTML is a stricter, more XML-based version of HTML
• XHTML is HTML defined as an XML application
• XHTML is supported by all major browsers
6. XHTML for the Experts
• XML is a markup language where all documents must be marked up
correctly (be "well-formed").
• XHTML was developed to make HTML more extensible and flexible to
work with other data formats (such as XML). In addition, browsers ignore
errors in HTML pages, and try to display the website even if it has some
errors in the markup. So XHTML comes with a much stricter error handling.
7. Strict?
• <!DOCTYPE> is mandatory
• The xmlns attribute in <html> is mandatory
• <html>, <head>, <title>, and <body> are mandatory
• Elements must always be properly nested
• Elements must always be closed
• Elements must always be in lowercase
• Attribute names must always be in lowercase
• Attribute values must always be quoted
• Attribute minimization is forbidden
8. Example XHTML code
• <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
• "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
• <html xmlns="http://www.w3.org/1999/xhtml">
• <head>
• <title>Title of document</title>
• </head>
• <body>
• some content here...
• </body>
• </html>
9. Compared to HTML code
• <html>
• <head>
• </head>
• <body>
• </body>
• </html>
10. Importance of XHTML
• XHTML documents are XML conforming as they are readily viewed, edited, and
validated with standard XML tools.
• XHTML documents can be written to operate better than they did before in
existing browsers as well as in new browsers.
• XHTML documents can utilize applications such as scripts and applets that rely
upon either the HTML Document Object Model or the XML Document Object
Model.
• XHTML gives you a more consistent, well-structured format so that your webpages
can be easily parsed and processed by present and future web browsers.
11. Importance of XHMTL
• You can easily maintain, edit, convert and format your document in the long run.
• Since XHTML is an official standard of the W3C, your website becomes more
compatible with many browsers and it is rendered more accurately.
• XHTML combines strength of HTML and XML. Also, XHTML pages can be
rendered by all XML enabled browsers.
• XHTML defines quality standard for your webpages and if you follow that, then
your web pages are counted as quality web pages. The W3C certifies those pages
with their quality stamp.
12. Important Tags for this week
• <p></p> for writing a paragraph with text
• <b> - Bold text
• <strong> - Important text
• <i> - Italic text
• <em> - Emphasized text
• <small> - Smaller text
13. <b> and <strong> tags
• In order to bold text you can use either the <b> or <strong> tags
• <b>Marino</b> will show up as Marino
• <strong>Marino</strong> will show up as Marino
• Notice they are both merely bold!
14. <i> and <em> tags
• In order to italicize text you can use either the <i> or <em> tags
• <i>Marino</i> will show up as Marino
• <em>Marino</em> will show up as Marino
• Notice they are both merely italic!
15. <small> tag
• This merely makes your text smaller without having to utilize the size
attribute or similar attributes within HTML code
• Ideally, you use this tag to deemphasize something [things that are not
important]
16. Keep in Mind Now, but for Later
• <form>…</form> - defines a form
• <input type…/> - defines a form input
• button
checkbox
file
hidden
image
password
radio
reset
submit
text
17. Building Assignment 3
• Some suggestions:
• <h1></h1> tags for About Me, My Favorite Sport or Musical Act, and My Favorite
Animal
• <p></p> tags when providing the paragraph about each section
• Your paragraph should be any where from 3 to 5 sentences
18. Building Assignment 3 Example
<h1>About Me</h1>
<p>I am an Adjunct Professor of BITM at Seton Hall University. I have
taught courses in Management Information Systems [BITM 2701] and
Developing Web Applications [BITM 3730]. My web space created for this
course is available at <a href="http://pirate.shu.edu/~marinom6/">My Site>
</p>
You do not need to include any hyperlink for Assignment 3
19. Building Project #1
• Refer to Professor Nazzaro’s example at http://pirate.shu.edu/~nazzarma/
• Listing your address while at Seton Hall University instead of your home address is fine
• You will in theory only list one degree [the one you will receive at SHU] under
Education
• Unless you have an Associate’s degree from somewhere
• Your Experience will be vastly less
• Try to have bullet points on what you did at your job(s)
20. Building Project #1
• Your Skills do not have to broken down into different areas
• Please list three References [you can include former professors, friends, other
people in the class to meet this requirement]
• Remember to use the tags discussed to bold and italicize as necessary
22. Important Note for Project #1
• Professor Nazzaro’s Resume is created in XHTML
• For the purposes of Project #1 you are more than welcome to only use
HTML code
• Consideration of extra credit will be given if you are able to utilize XHTML properly
for Project #1
