Web Engineering An interim report for the Economic and Social - - PowerPoint PPT Presentation

web engineering
SMART_READER_LITE
LIVE PREVIEW

Web Engineering An interim report for the Economic and Social - - PowerPoint PPT Presentation

News to discuss? Internet May Be Just A Fad, Says European Body (04-Dez-00) http://www.newsbytes.com/news/00/158904.html Web Engineering An interim report for the Economic and Social Research Council (ESRC), says that the development of the


slide-1
SLIDE 1

Prof. Dr. Dr. h.c. mult . Ge rhard Krüger , Albrecht Schmidt: Web Engineering, WS00/01 page 1

Web Engineering

  • Prof. Dr. Dr. h.c. mult. Gerhard Krüger, Albrecht Schmidt

Universität Karlsruhe Fakultät für Informatik Institut für Telematik Wintersemester 2000/2001

Prof. Dr. Dr. h.c. mult . Ge rhard Krüger , Albrecht Schmidt: Web Engineering, WS00/01 page 2

Web Engineering

Chapter 3: The Web – An Information System

Prof. Dr. Dr. h.c. mult . Ge rhard Krüger , Albrecht Schmidt: Web Engineering, WS00/01 page 3

News to discuss?

Internet May Be Just A Fad, Says European Body (04-Dez-00) http://www.newsbytes.com/news/00/158904.html An interim report for the Economic and Social Research Council (ESRC), says that the development of the Internet over the last decade may not be the epoch -making event that many have said.... ... The report stems from the results of a two-year investigation into the use of the Internet, undertaken by the University of Warwick, which claims that there is already some evidence that the Net may be a passing fad, as usage among British teenagers is already starting to fall from its previously high levels. The report speculates that as many as 2 million users of the Internet in the UK have stopped using it regularly because of the vast amounts of data online and the need to spend time on the Web to research that information....

Prof. Dr. Dr. h.c. mult . Ge rhard Krüger , Albrecht Schmidt: Web Engineering, WS00/01 page 4

Table of Contents

  • 1. Introduction and History
  • 2. Media and Information
  • 3. Organizing Information
  • 4. Access to Information and Navigation

Methods for Information Access Hypertext Navigation Access Strategies for the Web

  • 5. Describing and coding Information
slide-2
SLIDE 2

Prof. Dr. Dr. h.c. mult . Ge rhard Krüger , Albrecht Schmidt: Web Engineering, WS00/01 page 5

Methods for Information Access

addressing pages directly search/browse in catalogs search for keywords associative navigation

Prof. Dr. Dr. h.c. mult . Ge rhard Krüger , Albrecht Schmidt: Web Engineering, WS00/01 page 6

Addressing Pages Directly

requires unique addresses URL: Uniform Resource Locator how to get the address? external channel, e.g. TV, radio, press, print, email, etc. guessing the DNS-name, e.g. www.uni-karlsruhe.de, www.oracle.com, www.linux.org conventions E.g. index.html, default.htm, robots.txt

Prof. Dr. Dr. h.c. mult . Ge rhard Krüger , Albrecht Schmidt: Web Engineering, WS00/01 page 7

Quality of Search Results

recall = the ratio of documents retrieved versus the

number of available documents relevant to the query, i.e., the fraction returned out of all desirable documents

precision = the ratio of the number of relevant

documents retrieved versus the total number of documents retrieved, or the useful fraction of what was actually retrieved

see information retrieval

Prof. Dr. Dr. h.c. mult . Ge rhard Krüger , Albrecht Schmidt: Web Engineering, WS00/01 page 8

Search / Browse in Catalogs

browse predefined classes search if classes/subclasses are unknown less directed, open search strategy if you can not specify what you are looking for ... How to get listed in a catalog? automatically (submit in a certain category) pages are manually selected, reviews, and added address of the catalog must be known examples yahoo.com web.de lycos.de netcenter.com dmoz.org open directory project

  • and many others ...
slide-3
SLIDE 3

Prof. Dr. Dr. h.c. mult . Ge rhard Krüger , Albrecht Schmidt: Web Engineering, WS00/01 page 9

Search for Keywords

specific WWW server parts of a search engine

robot/crawler indexer analyzer module database retrieval component

recommendation system

  • ther user rank content

number of links to a page how often is the page

  • pened when displayed

etc ...

Prof. Dr. Dr. h.c. mult . GerhardKrüger, Albrecht Schmidt: Web Engineering, WS00/01 page 10

Search using a Query Language

mechanisms to search for keywords keyword matching query language

Boolean operators “fuzzy operators” e.g. NEAR search for values of certain attributes examples: www.altavista.com

+domain:com +Netscape +host:www.ibm.com +confidential +image:sharon * +title:stone +url:Java +applet:* link:www.teco .uni-karlsruhe.de (image:bill NEAR clinton ) OR (image:clinton NEAR bill) OR title:"Bill Clinton"

Prof. Dr. Dr. h.c. mult . GerhardKrüger, Albrecht Schmidt: Web Engineering, WS00/01 page 11

Incremental Search

refine search results search within results concept map categorizing results

source: www.altavista.com www.northernlight.com

Prof. Dr. Dr. h.c. mult . GerhardKrüger, Albrecht Schmidt: Web Engineering, WS00/01 page 12

Advanced Search Concepts I

specify search by search term term exclusion date top level domain domain hostname language country matching (exact, fuzzy) search term in:

title body domain link

source: www.google.com

slide-4
SLIDE 4

Prof. Dr. Dr. h.c. mult . GerhardKrüger, Albrecht Schmidt: Web Engineering, WS00/01 page 13

Advanced Search Concepts II

searching for similar pages searching for pages that link to a page searching within a certain domain

specialized search engines

source: www.google.com

cached pages – no 404

Prof. Dr. Dr. h.c. mult . GerhardKrüger, Albrecht Schmidt: Web Engineering, WS00/01 page 14

Natural Language Search

query a search engine in „plain“ English

source: www.askjeeves.com

Prof. Dr. Dr. h.c. mult . GerhardKrüger, Albrecht Schmidt: Web Engineering, WS00/01 page 15

Multimedia Search

content images video audio based on

text/keywords next to content

e.g. www.altavista.com www.ditto.com music.lycos.com multimedia.lycos.com

Prof. Dr. Dr. h.c. mult . GerhardKrüger, Albrecht Schmidt: Web Engineering, WS00/01 page 16

Associative

semantic links in hypertext links in text (related content) icons and images maps different types of links different semantics

slide-5
SLIDE 5

Prof. Dr. Dr. h.c. mult . GerhardKrüger, Albrecht Schmidt: Web Engineering, WS00/01 page 17

Search Functionality

providing a search function to visitors of a specific site

(company web site, university site)

when a users is on the site you want to help him to find

what he/she is looking for

two approaches search engine or directory for the specific site

customized interface detailed inclusion

and exclusion rules

using a „public“ search engine with attributes to restrict the search to this site

embedded in

the site

also useful instead

  • f a missing page

Prof. Dr. Dr. h.c. mult . GerhardKrüger, Albrecht Schmidt: Web Engineering, WS00/01 page 18

Hypertext - Navigation

links beyond content and semantic navigational structure within the content up, down, next, ...

  • ften based on icon

author builds/defines this structure tools for navigation history, back/forward, home bookmarks in the user interface of the web client navigational patterns

Prof. Dr. Dr. h.c. mult . GerhardKrüger, Albrecht Schmidt: Web Engineering, WS00/01 page 19

Hypertext – Navigational Patterns

Navigational Design Patterns [Rossi et al. 98]

  • text based

e.g. www.useit.com

  • landmark

„Provide direct access to critical sub-systems in the Web Information System“

  • set-based navigation

„Organize the information in Sets of related information items. Provide intra-set navigation capabilities.“

  • ften combined landmark & set-based navigation

e.g.: www.sun.com e.g.: www.amazon.de

  • metaphorical navigation

z.B.: www.iflyswa .com, www.hagebau.de

http://www8.org/w8-papers/5b-hypertext-media/improving/improving.html

Prof. Dr. Dr. h.c. mult . GerhardKrüger, Albrecht Schmidt: Web Engineering, WS00/01 page 20

Text Based Navigation

Source: http://www.useit.com

slide-6
SLIDE 6

Prof. Dr. Dr. h.c. mult . GerhardKrüger, Albrecht Schmidt: Web Engineering, WS00/01 page 21

Landmark & Set-based Navigation I

Source: http://www.amazon.de

Prof. Dr. Dr. h.c. mult . GerhardKrüger, Albrecht Schmidt: Web Engineering, WS00/01 page 22

Landmark & Set-based Navigation II

Source: http://www.wapforum .org

Prof. Dr. Dr. h.c. mult . GerhardKrüger, Albrecht Schmidt: Web Engineering, WS00/01 page 23

Metaphorical Navigation I

Source, 1998: http://www.iflyswa.com

Prof. Dr. Dr. h.c. mult . GerhardKrüger, Albrecht Schmidt: Web Engineering, WS00/01 page 24

Metaphorical Navigation II

Source: http://www.hagebau.de

slide-7
SLIDE 7

Prof. Dr. Dr. h.c. mult . GerhardKrüger, Albrecht Schmidt: Web Engineering, WS00/01 page 25

Table of Contents

  • 1. Introduction and History
  • 2. Media and Information
  • 3. Organizing Information
  • 4. Access to Information and Navigation
  • 5. Describing and coding Information

Markup SGML XML HTML

Prof. Dr. Dr. h.c. mult . GerhardKrüger, Albrecht Schmidt: Web Engineering, WS00/01 page 26

Coding Documents

GIF89a`P÷ •àc ˆ„ +0 ÿ1))scÿ”{„Üo%4$1Üoa*~1 ÖÎÿÞçççï÷ï÷÷ÿ~8¾•þ`ˆ-

  • ퟣÚÏ#³ó•àc ˆ„¯)zˆR

QÄV„Ä&˜!,ÖY¹BCÛ ßr³j fÜQ¢ùÌ4Ífƒ?sÔCÞ¹Ã/jò†þ „Ä&˜!,ÖY¹BCÛ ß„Ä&˜!, ÖY¹BCÛ ßÜQ¢ùÌ4ÜQ¢ùÌ4 {\listname ;}\listid3} {\list\listtemplateid0\ {\leveltext\'01-;} {\levelnumbers;}\f0 \chbrdr\brdrnone\brdrcf1 \chshdng0\chcfpat1\chcbpa \fbias0 \fi-360\li360 %%EndSetup %%Page: 1 1 1 0 bop 1007 872 a Fl(Location\255Based) 32 b(Personal)i(Agents) 820 y Fk(\003)781 1112 y Fj(Seng)5 b(W)-8 b(ai)25 b(Lok)o(e)1392 1076 y Fi(y)1427 1112 y Fj(,)g(Andry)f(Rak)o(otonirain)o(y)2325 1076 y Fi(yy)2391 1112 y Fj(,)g(Karsten)h(Schulz)3046 <td><font face="Arial, Helvetica"> <P> In 1995/1996 I did an MSc in computing at the <A HREF="http://www.mmu.ac.uk">Manchester Metropolitan University</A> in the <A HREF="http://www.doc.mmu.ac.uk"> Department of Computing</A>. Studying in <A REF="http://www.manchester.com/"> \twocolumn[ \begin{center}\Large { A Modular Neural Network Architecture with Additional Generalization Abilities for High Dimensional Input Vectors} \end{center}

RTF HTML PS tex GIF

Prof. Dr. Dr. h.c. mult . GerhardKrüger, Albrecht Schmidt: Web Engineering, WS00/01 page 27

Markup

roots: computerized typesetting

  • typesetting macros embedded in ASCII

layout

directives, e.g. TEX

  • presentational markup

commands

to define the layout

semantic markup

  • authors put annotations into their texts to help the publisher to

understand what type of text this is (e.g. „this is a heading“)

  • annotations are agreed between author and publisher
  • publisher decides on the layout
  • descriptive markup

describing

content not the layout

  • markup to support search in documents

words

in headings are more important than in footnotes

markup for machines vs. markup for humans

Prof. Dr. Dr. h.c. mult . GerhardKrüger, Albrecht Schmidt: Web Engineering, WS00/01 page 28

Markup - ISO-Definitions

markup text that is added to the data of a document in order to convey information about it descriptive markup markup that describes the structure and other attributes of a document in a non-system-specific way, independently of any processing that may be performed on it processing instruction (PI) markup consisting of system-specific data that controls how a document is to be processed

slide-8
SLIDE 8

Prof. Dr. Dr. h.c. mult . GerhardKrüger, Albrecht Schmidt: Web Engineering, WS00/01 page 29

Descriptive Markup versus Processing Instruction

descriptive markup editorial structure content structure processing instructions layout Example

Announcement In the course Web Engineering Albrecht Schmidt will talk about ...

Prof. Dr. Dr. h.c. mult . GerhardKrüger, Albrecht Schmidt: Web Engineering, WS00/01 page 30

Editorial Structure

descriptive markup editorial structure content structure processing instructions layout Example

<main-title>Announcement</main-title> In the course Web Engineering Albrecht Schmidt will talk about ...

Prof. Dr. Dr. h.c. mult . GerhardKrüger, Albrecht Schmidt: Web Engineering, WS00/01 page 31

Editorial Structure II

descriptive markup editorial structure content structure processing instructions layout Example

<main-title>Announcement</main-title> <paragraph>In the course Web Engineering Albrecht Schmidt will talk about ... </paragraph>

Prof. Dr. Dr. h.c. mult . GerhardKrüger, Albrecht Schmidt: Web Engineering, WS00/01 page 32

Content Structure I

descriptive markup editorial structure content structure processing instructions layout Example

<main-title>Announcement</main-title> <paragraph>In the course <course>Web Engineering </course> Albrecht Schmidt will talk about ... </paragraph>

slide-9
SLIDE 9

Prof. Dr. Dr. h.c. mult . GerhardKrüger, Albrecht Schmidt: Web Engineering, WS00/01 page 33

Content Structure II

descriptive markup editorial structure content structure processing instructions layout Example

<main-title>Announcement</main-title> <paragraph>In the course <course>Web Engineering </course> <name>Albrecht Schmidt</name> will talk about ... </paragraph>

Prof. Dr. Dr. h.c. mult . GerhardKrüger, Albrecht Schmidt: Web Engineering, WS00/01 page 34

Processing Instruction Layout I

descriptive markup

  • editorial structure
  • content structure

processing

instructions

  • layout

Example

<head columns=1> <main-title>Announcement</main-title> </head> <content columns=2> <paragraph>In the course <course>Web Engineering </course> <name>Albrecht Schmidt</name> will talk about ... </paragraph> </content>

Prof. Dr. Dr. h.c. mult . GerhardKrüger, Albrecht Schmidt: Web Engineering, WS00/01 page 35

Processing Instruction Layout II

descriptive markup

  • editorial structure
  • content structure

processing

instructions

  • layout

Example

<head columns=1> <main-title><bold>Announcement</bold></main-title> </head> <content columns=2> <paragraph>In the course <course>Web Engineering </course> <name><italic>Albrecht Schmidt </italic> </name> will talk about ... </paragraph> </content>

Prof. Dr. Dr. h.c. mult . GerhardKrüger, Albrecht Schmidt: Web Engineering, WS00/01 page 36

Generic vs. Specific Markup

layout structure specific <italic>Web Engineering</ italic > generic <emphasis>Web Engineering</emphasis > content structure specific <course-title>Web Engineering</course-title > generic <keyword>Web Engineering</keyword> publication structure specific <verse> ... </verse> generic <paragraph> ... </paragraph>

slide-10
SLIDE 10

Prof. Dr. Dr. h.c. mult . GerhardKrüger, Albrecht Schmidt: Web Engineering, WS00/01 page 37

SGML

Standard Generalized Markup Language ISO-Standard [ISO/IS 8879, 1986] developed from GML, IBM 1969 (Goldfarb, Mosher, Lorie) distinction between content and presentation dilemma of specific markup language: What is an appropriate set of tags? generalized markup documents are desribed in three parts

SGML declaration:

mapping of the abstract SGML Syntax onto concrete characters definition of STAGO e.g. '<' or TAGC e.g. '>' or charset

Document Type Definition, DTD:

definition of tags and their meaning

the document (content) in the markup define in the DTD

semantic of markup is context dependent