Copyright © 2008 Pearson Education, Inc. Publishing as Pearson Addison-Wesley Fluency with Information Technology Third Edition by Lawrence Snyder Chapter.

Slides:



Advertisements
Similar presentations
CSCI N241: Fundamentals of Web Design Copyright ©2004 Department of Computer & Information Science Introducing XHTML: Module B: HTML to XHTML.
Advertisements

HTML popo.
Internet Services and Web Authoring (CSET 226) Lecture # 5 HyperText Markup Language (HTML) 1.
Hypertext markup language.  Client asks for an html file  Server returns the html file  Client parses and displays it  This display is what most people.
XSL eXtensible Stylesheet Language. What is XSL? XSL is a language that allows one to describe a browser how to process an XML file. XSL can convert an.
Chapter 4 Marking Up With Html: A Hypertext Markup Language Primer.
1 HTML Markup language – coded text is converted into formatted text by a web browser. Big chart on pg. 16—39. Tags usually come in pairs like – data Some.
Chapter 4_2 Marking Up With Html: A Hypertext Markup Language Primer.
Copyright © 2011 Pearson Education, Inc. Publishing as Pearson Addison-Wesley A Case Study in Database Organization The iDiary Database lawrence snyder.
Marking Up With Html: A Hypertext Markup Language Primer
HTML Companion. Lecture Objectives Learn about HTML. Know basic HTML tags.
Introducing XHTML: Module B: HTML to XHTML. Goals Understand how XHTML evolved as a language for Web delivery Understand the importance of DTDs Understand.
Glencoe Digital Communication Tools Create a Web Page with HTML Chapter Contents Lesson 4.1Lesson 4.1 Get Started with HTML (85) Lesson 4.2Lesson 4.2 Format.
Chapter 15 Introduction to Database Concepts. Copyright © 2013 Pearson Education, Inc. Publishing as Pearson Addison-Wesley Learning Objectives Use XML.
Understanding HTML Style Sheets. What is a style?  A style is a rule that defines the appearance and position of text and graphics. It may define the.
Creating a Simple Page: HTML Overview
Chapter 16 A Case Study in Database Organization.
Chapter 4 Fluency with Information Technology L. Snyder Marking Up With HTML: A Hypertext Markup Language Primer.
Copyright © 2008 Pearson Education, Inc. Publishing as Pearson Addison-Wesley Fluency with Information Technology Third Edition by Lawrence Snyder Chapter.
Introduction to HTML. Topics HTML –What is HTML –Parts of an HTML Document –HTML Tags.
Fluency with Information Technology INFO100 and CSE100 Katherine Deibel Katherine Deibel, Fluency in Information Technology1.
_______________________________________________________________________________________________________________ E-Commerce: Fundamentals and Applications1.
Creating a Basic Web Page
Creating Web Pages: Week 4, continued Is a picture worth 1000 words? HTML: body tag, text tags, lists Typography & Editorial Style Homework: Look at schedule.
4 HTML Basics Section 4.1 Format HTML tags Identify HTML guidelines Section 4.2 Organize Web site files and folder Use a text editor Use HTML tags and.
Amber Annett David Bell October 13 th, What will happen What is this business about personal web pages? Designated location of your own web page.
Copyright © 2008 Pearson Prentice Hall. All rights reserved. 1 Exploring Microsoft Office Word 2007 Chapter 8 Word and the Internet Robert Grauer, Keith.
Chapter 4: Hypertext Markup Language Primer TECH Prof. Jeff Cheng.
Copyright © 2008 Pearson Education, Inc. Publishing as Pearson Addison-Wesley Introduction to Computers CS Dr. Zhizhang Shen Chapter 4: Talking.
CP2022 Multimedia Internet Communication1 HTML and Hypertext The workings of the web Lecture 7.
Section 4.1 Format HTML tags Identify HTML guidelines Section 4.2 Organize Web site files and folder Use a text editor Use HTML tags and attributes Create.
Chapter 4 (through page 110) Fluency with Information Technology 4 th edition by Lawrence Snyder (slides by Deborah Woodall : 1.
XP Dreamweaver 8.0 Tutorial 3 1 Adding Text and Formatting Text with CSS Styles.
Introduction to HTML. What is a HTML File?  HTML stands for Hyper Text Markup Language  An HTML file is a text file containing small markup tags  The.
 2008 Pearson Education, Inc. All rights reserved Introduction to XHTML.
Fluency with Information Technology INFO100 and CSE100 Katherine Deibel Katherine Deibel, Fluency in Information Technology1.
Just Enough HTML How to Create Basic HTML Documents.
XP 2 HTML Tutorial 1: Developing a Basic Web Page.
Chapter 16 A Case Study in Database Organization.
Ali Alshowaish. What is HTML? HTML stands for Hyper Text Markup Language Specifically created to make World Wide Web pages Web authoring software language.
Chapter 2 Web Page Design Mr. Gironda. Elements of a Web Page These are things that most web pages use.
HTML Lesson 3 Hyper Text Markup Language. Assignment Part 2  Set the file name as “FirstName2.htm”  Set the title as “FirstName LastName First Web Site”
HTML ( HYPER TEXT MARK UP LANGUAGE ). What is HTML HTML describes the content and format of web pages using tags. Ex. Title Tag: A title It’s the job.
Copyright © 2008 Pearson Education, Inc. Publishing as Pearson Addison-Wesley Fluency with Information Technology Third Edition by Lawrence Snyder Chapter.
4 HTML Basics Section 4.1 Format HTML tags Identify HTML guidelines Section 4.2 Organize Web site files and folder Use a text editor Use HTML tags and.
Tutorial 3 Adding and Formatting Text with CSS Styles.
HTML Introduction. Lecture 7 What we will cover…  Understanding the first html code…  Tags o two-sided tags o one-sided tags  Block level elements.
HTML Basics. HTML Coding HTML Hypertext markup language The code used to create web pages.
Exploring Microsoft Microsoft FrontPage Chapter 21 Exploring Microsoft FrontPage 2002 Chapter 1 Creating a Home Page: Introduction to MS FrontPage.
Copyright © 2013 Pearson Education, Inc. Publishing as Pearson Addison-Wesley What did we learn so far? 1.Computer hardware and software 2.Computer experience.
Introduction to Web Authoring Ellen Cushman /wra210.htm Class mtg. #2.
XP 2 HTML Tutorial 1: Developing a Basic Web Page.
Chapter 29. Copyright 2003, Paradigm Publishing Inc. CHAPTER 29 BACKNEXTEND 29-2 LINKS TO OBJECTIVES Attach an XML Schema Attach an XML Schema Load XML.
Rendering XML Documents ©NIITeXtensible Markup Language/Lesson 5/Slide 1 of 46 Objectives In this session, you will learn to: * Define rendering * Identify.
1 Introduction to HTML. 2 Definitions  W W W – World Wide Web.  HTML – HyperText Markup Language – The Language of Web Pages on the World Wide Web.
HTML Basics.
Fluency with Information Technology
Section 4.1 Section 4.2 Format HTML tags Identify HTML guidelines
Marking Up with XHTML Tags describe how a web page should look
CSC 110 – Fluency in Information Technology Databases, XML and XSL
Microsoft Office Illustrated
Basic HTML and Embed Codes
Marking Up with XHTML Tags describe how a web page should look
Marking Up with XHTML Tags describe how a web page should look
Test Your Tech Blogging is: Someone's online journal.
Using the Power of XML Personally
Chapter 4: Marking Up With HTML: A Hypertext Markup Language Primer
Marking Up with XHTML Tags describe how a web page should look
Marking Up with XHTML Tags describe how a web page should look
Marking Up with XHTML Tags describe how a web page should look
Presentation transcript:

Copyright © 2008 Pearson Education, Inc. Publishing as Pearson Addison-Wesley Fluency with Information Technology Third Edition by Lawrence Snyder Chapter 17: The iDiary Database: A Case Study in Database Organization

1-2 Copyright © 2008 Pearson Education, Inc. Publishing as Pearson Addison-Wesley 17-2 Thinking About a Personal Database Regular Versus Irregular Data –The iDiary will be an irregular data collection Record things we find interesting in our daily lives –Text, photos, URLs, animations, poems, videos, etc. –Use XML to specify metadata The database will be an XML tree Use the Identity, Affinity, and Collection rules –Organize the database by date The iDiary added to each day

1-3 Copyright © 2008 Pearson Education, Inc. Publishing as Pearson Addison-Wesley 17-3 Thinking About a Personal Database (cont'd) Physical Versus Logical –The XML tree will be our physical database –The logical database is our view of the iDiary –Use XSL to pick out data we want to display XSL description converts the data to HTML XSL description act like a query with a relational database

1-4 Copyright © 2008 Pearson Education, Inc. Publishing as Pearson Addison-Wesley 17-4 Thinking About a Personal Database (cont'd) The iDiary –Build the iDiary database and its stylesheet display together and incrementally –Step-by-step approach Easier to debug Mirrors how databases are enhanced over time

1-5 Copyright © 2008 Pearson Education, Inc. Publishing as Pearson Addison-Wesley 17-5

1-6 Copyright © 2008 Pearson Education, Inc. Publishing as Pearson Addison-Wesley 17-6

1-7 Copyright © 2008 Pearson Education, Inc. Publishing as Pearson Addison-Wesley 17-7 A Preliminary Exercise Travels Database –The XML Definition Entries in the database will be a list of countries Each will have a name and a tour that contains a list of sights, along with that country's flag –XML database file named Travels.xml Direct Check of XML –Can have a browser display our XML tree

1-8 Copyright © 2008 Pearson Education, Inc. Publishing as Pearson Addison-Wesley 17-8

1-9 Copyright © 2008 Pearson Education, Inc. Publishing as Pearson Addison-Wesley 17-9 Displaying the Travels with XSL Connecting XML with Style –Style information tells the browser how to display a markup language like XML –Style information comes from a companion file with the file extension.xsl –Put in the XML file a line which tells the browser where to find the style information

1-10 Copyright © 2008 Pearson Education, Inc. Publishing as Pearson Addison-Wesley 17-10

1-11 Copyright © 2008 Pearson Education, Inc. Publishing as Pearson Addison-Wesley Displaying the Travels with XSL (cont'd) The Idea of XSL –The.xsl file contains a series of rules (templates) on how to format (using HTML) the information enclosed in XML tags in the database

1-12 Copyright © 2008 Pearson Education, Inc. Publishing as Pearson Addison-Wesley Displaying the Travels with XSL (cont'd) XSL Templates –XSL is really just XML with one template for each XML tag with HTML for how to display the XML tag …

1-13 Copyright © 2008 Pearson Education, Inc. Publishing as Pearson Addison-Wesley 17-13

1-14 Copyright © 2008 Pearson Education, Inc. Publishing as Pearson Addison-Wesley Displaying the Travels with XSL (cont'd) Creating the Travelogue Display –Each XML tag has a stylistic role to play in the overall creation of the Web page

1-15 Copyright © 2008 Pearson Education, Inc. Publishing as Pearson Addison-Wesley Displaying the Travels with XSL (cont'd) The Apply Operation –This tag means "now process whatever is inside this XML tag"

1-16 Copyright © 2008 Pearson Education, Inc. Publishing as Pearson Addison-Wesley Displaying the Travels with XSL (cont'd) Tag Attributes –Use curly braces to place information in matched quotes refers to the value of the flag attribute of the tag eg. becomes

1-17 Copyright © 2008 Pearson Education, Inc. Publishing as Pearson Addison-Wesley Displaying the Travels with XSL (cont'd) Summary of XSL –Browser opens the.xml file, finds a style specification, opens the.xsl file, and begins to process the XML tree –The process: match a template do what needs to be done before processing the enclosed information process the enclosed information do what needs to be done after processing the enclosed information consider that tag processed

1-18 Copyright © 2008 Pearson Education, Inc. Publishing as Pearson Addison-Wesley The iDiary Database Incremental approach 1.Getting started 2.Creating the first entry (April 26) 3.Thinking about the nature of things 4.Developing tags and templates 5.Critiquing and evaluating the results

1-19 Copyright © 2008 Pearson Education, Inc. Publishing as Pearson Addison-Wesley Getting Started Creating the XML Database (iDiary.xml) –Decide on root Collection tag ( ) and Affinity tags to enclose daily info ( ) Creating the XSL Stylesheet (iDiarySS.sxl) –Contains the setup for the Web page (title, heading, italicized comment at the start of the page), table containing all the entries, table for each entry

1-20 Copyright © 2008 Pearson Education, Inc. Publishing as Pearson Addison-Wesley Creating the First Entry (April 26) Date Tagging –Let date be atomic, pick a date format, and surround with tags Revising an – tagging most interesting thing that day –Add XSL templates in iDiary.xsl for each XML tag Critiquing the Design –Vertically align the date –Modify the color and font

1-21 Copyright © 2008 Pearson Education, Inc. Publishing as Pearson Addison-Wesley Thinking About the Nature of Things Recognizing the Need for Specific Tags –Different kinds of data need different tags Choosing Specific Tags –Previously an Identification tag, tag becomes more of an Affinity tag –Still a sister to the tag, still identifies the most interesting thing, style role continues

1-22 Copyright © 2008 Pearson Education, Inc. Publishing as Pearson Addison-Wesley Developing Tags and Templates The Fact Tag –Enclosed by the tag The Title Tag –Announces the most interesting thing entry The Link Tag –Specifies a Web link The Picture Tag –Stand-alone tag; no need for –All information expressed as tag attributes

1-23 Copyright © 2008 Pearson Education, Inc. Publishing as Pearson Addison-Wesley Developing Tags and Templates (cont'd) The Remark Tag –Captions and labels The Poetry Tags –Title, author, and lines of poetry – assign tags to each The Video Tag –Display a player as an embedded object (YouTube) –Stand-alone tag like the picture tag A Check of the Design

1-24 Copyright © 2008 Pearson Education, Inc. Publishing as Pearson Addison-Wesley 17-24

1-25 Copyright © 2008 Pearson Education, Inc. Publishing as Pearson Addison-Wesley 17-25

1-26 Copyright © 2008 Pearson Education, Inc. Publishing as Pearson Addison-Wesley 17-26

1-27 Copyright © 2008 Pearson Education, Inc. Publishing as Pearson Addison-Wesley Critiquing and Evaluating the Results Form of Entries –Add breaks and horizontal line to separate entries –Compact entries by limiting the width of the table data Remarks On –New Label tag to bold the information it encloses

1-28 Copyright © 2008 Pearson Education, Inc. Publishing as Pearson Addison-Wesley Using the iDiary Daily Archiving Photos –Putting the path to images in the XML file (versus the XSL file) allows us to make references to images stored in different places, including images stored elsewhere on the Internet

1-29 Copyright © 2008 Pearson Education, Inc. Publishing as Pearson Addison-Wesley Using the iDiary Daily (cont'd) Hiding Information –Enclose personal information you do not want displayed in tags –Do not include tag in the XSL template for –Information inside the tags will be skipped –Note: Not enclosing information in a tag or tagging it but not providing a template for the tag will result in the content being displayed

1-30 Copyright © 2008 Pearson Education, Inc. Publishing as Pearson Addison-Wesley Using the iDiary Daily (cont'd) Entering Data into the Database –Create a "template" for a new entry in the XML database file –Just copy/paste this "template" and edit it