is341 - week01 the world wide web architecture

24
Johny Hizkia Siringo Ringo BIT (Multimedia Tech.), MIMS (Soft. Dev.) [email protected] [email protected] www.istb.ac.id IS341 Web Technology The WWW Architecture

Upload: indonesia-school-of-technology-and-business-istb

Post on 19-May-2015

430 views

Category:

Education


1 download

DESCRIPTION

Explain what is world wide web Internet, HTML, and any other concepts necessary to comprehend web building Explain how web pages are retrieved Identify some common web site themes

TRANSCRIPT

Page 1: IS341 - Week01  the world wide web architecture

Johny Hizkia Siringo RingoBIT (Multimedia Tech.), MIMS (Soft. Dev.)

[email protected]@gmail.com

www.istb.ac.id

IS341Web Technology

The WWW Architecture

Page 2: IS341 - Week01  the world wide web architecture

[email protected] www.istb.ac.id 2

Objectives

• Explain what is world wide web Internet, HTML, and any other concepts necessary to comprehend web building

• Explain how web pages are retrieved

• Identify some common web site themes

Page 3: IS341 - Week01  the world wide web architecture

[email protected] www.istb.ac.id 3

Contents

• Introduction• Defining the web• How does the web work• Web browser• Web server• Hypertext system• Plug in and helper application• HTML• Themes for web site• Hosting options• Summary

Page 4: IS341 - Week01  the world wide web architecture

[email protected] www.istb.ac.id 4

The Internet

• What is internet?

– Collection of giant networks

• WWW (World Wide Web) a.k.a Web

• Web is NOT Internet

Page 5: IS341 - Week01  the world wide web architecture

[email protected] www.istb.ac.id 5

The Web

• WWW is an internet application

• It is a collection of documents.

– These web mostly contains the following

• Multimedia rich content (text, graphic, video, sound, animation)

• Web uses hypertext

• Viewed using software called web browser

• The web uses a specific protocol called HTTP (Hyper Text Transfer Protocol)

Page 6: IS341 - Week01  the world wide web architecture

[email protected] www.istb.ac.id 6

The Web

• How does WWW work– A client (using web browser) sends a HTTP request

to a web server for a specific file

– A web server contains web pages and files

– The web server send the requested file back to the client

– The file (mostly web page) is rendered / displayed via the web browsers

– The web browsers display the information, based on the HTML code in the file.

Page 7: IS341 - Week01  the world wide web architecture

[email protected] www.istb.ac.id 7

The Web

Page 8: IS341 - Week01  the world wide web architecture

[email protected] www.istb.ac.id 8

Web Browsers

• A web browser is a software application for retrieving, presenting, and traversing information resources on the World Wide Web.

• Example of web browsers

– Mozilla Firefox

– Internet Explorer

– Safari (Mac users)

– Opera

– Many more….

Page 9: IS341 - Week01  the world wide web architecture

[email protected] www.istb.ac.id 9

Web Server

• A web server is a computer program that delivers (serves) content, such as web pages, using the Hypertext Transfer Protocol (HTTP), over the World Wide Web.

• Example of Web Server– Apache (Widely used ~ 54%)

– IIS (Second widely used ~ 24%)

– Nginx

– Lighttpd

Page 10: IS341 - Week01  the world wide web architecture

[email protected] www.istb.ac.id 10

Some Terminology

• Domain Names– A domain name is an identification label that

defines a realm of administrative autonomy, authority, or control on the Internet, based on the Domain Name System (DNS).

• DNS (Domain Name System)– it serves as the "phone book" for the Internet by

translating human-friendly computer hostnamesinto IP addresses. For example, www.example.comtranslates to 192.0.32.10.

Page 11: IS341 - Week01  the world wide web architecture

[email protected] www.istb.ac.id 11

Some Terminology

• URL (Uniform Resource Locator)– Abbreviation of Uniform Resource Locator, the global

address of documents and other resources on the World Wide Web.

– The first part of the address is called a protocol identifierand it indicates what protocol to use, and the second part is called a resource name and it specifies the IP address or the domain name where the resource is located. The protocol identifier and the resource name are separated by a colon and two forward slashes.

– ftp://www.pcwebopedia.com/stuff.exe

– http://www.pcwebopedia.com/index.html

Page 12: IS341 - Week01  the world wide web architecture

[email protected] www.istb.ac.id 12

Web 2.0

Page 13: IS341 - Week01  the world wide web architecture

[email protected] www.istb.ac.id 13

Web 2.0

• The term "Web 2.0" is commonly associated with web applications that facilitate interactive information sharing, interoperability, user-centered design,[1] and collaboration on the World Wide Web.

Page 14: IS341 - Week01  the world wide web architecture

[email protected] www.istb.ac.id 14

Hypertext and Hypermedia

• Hypertext is the basis of navigation on the web.• A web page contains hyperlinks (which can be

text or an icon) that connect to another section within the web page, to another page or web server.

• Provides easy searching and browsing by associating information.

• Non-linear non-sequential viewing.• Hypertext that involves multimedia elements are

known as hypermedia.

Page 15: IS341 - Week01  the world wide web architecture

[email protected] www.istb.ac.id 15

Plug in and helper applications

• These programs are used to extend thefunctions of the browser

– Ex: playing video clips, sound and documents (likePDF)

• Plug in is closely tied to the browser andlaunches in the browser window, whereashelper application is a stand alone programthat launches in separate window.

Page 16: IS341 - Week01  the world wide web architecture

[email protected] www.istb.ac.id 16

Quick Time Player

Page 17: IS341 - Week01  the world wide web architecture

[email protected] www.istb.ac.id 17

PDF Reader

Page 18: IS341 - Week01  the world wide web architecture

[email protected] www.istb.ac.id 18

Other Plugins

Page 19: IS341 - Week01  the world wide web architecture

[email protected] www.istb.ac.id 19

HTML

• HyperText Markup Language

• Common display language used in web pages

• Contains markup tags for display instructions

• Can be created using plain text editor

• A HTML web page has a html or htm extension

Page 20: IS341 - Week01  the world wide web architecture

[email protected] www.istb.ac.id 20

W3Schools says:

• We think a Web developer should focus on:

– The HTML 4.01 standard (HTML 5.0 ??)

– The use of CSS (Style sheets)

– The new XHTML

– XML and XSL

– Server Side Scripting

– Managing data with SQL

– Running an “information” server

Page 21: IS341 - Week01  the world wide web architecture

[email protected] www.istb.ac.id 21

Web Site Themes

• Personal interest

• Educational interest

• Commercial

• Online publication and news

• Community groups, clubs, organizations

• Common interests or ideas

Page 22: IS341 - Week01  the world wide web architecture

[email protected] www.istb.ac.id 22

Hosting Web Site

• A web site must be stored in a web server which is permanently connected to the internet

• Host on our own web server

• Use Internet Service Provider’s service

• Free hosting on the web

Page 23: IS341 - Week01  the world wide web architecture

[email protected] www.istb.ac.id 23

Summary

• The World Wide Web is one of the facilities that uses the Internet.

• The World Wide Web consists of HTML pages, which are stored in web server and displayed using web browsers.

• A web site may have various themes ranging from personal interest, educational to commercial.

Page 24: IS341 - Week01  the world wide web architecture

[email protected] www.istb.ac.id 24

Exercise

• What is the web? What is the relationshipbetween the web and the Internet?

• What is HTML? Is it necessary to learn HTMLin order to create a website?

• Explain how a browser displays a web page

• Give examples of web browsers

• What are plug ins and helper applications?What are they for? What are the differencesbetween them?