Web Pages, Web Sites, and ECommerce

1
Web Pages, Web Sites, and E-Commerce

• Chapter 6

2
What is hypertext?

• Remember that the Internet is not just limited to
  the World Wide Web (ftp, email, etc.)
• What the web brings to the table, is the ability
  to view webpages and click on hypertext links to
  visit other pages
• Hypertext transfer protocol (HTTP) and Hypertext
  Markup Language (HTML) are the foundations of the
  Web
• Hypertext links or simply links are areas on a
  web page that,generally speaking, are underlined
  words that allows you to access related documents

3
How the web works in a nutshell

• Web servers store data in various formats, the
  most common being HTML
• A browser submits a request to see a web page
  using the HTTP protocol.
• The web server listens for these requests and
  when it hears the request, it sends the HTML file
  to your computer
• Your browser interprets the HTML code and
  displays the web page

4
What is HTML and XHTML

• These are called markup languages because
  creators insert HTML tags to tell the browser how
  to display content
• The original HTML tags were developed in 1990 by
  Tim Berners-Lee and have been revised by the
  World Wide Web Consortium (W3C) over the years
• XHTML is an extension of HTML that allows the
  creation of new tags not contained in HTML

5
How do HTML tags work?

• Tags are generally enclosed in brackets.
• Most tags have an opening tag and a closing tag.
• These tags tell the browser to start doing
  something until it sees the closing tag.
• For example, This should be bold would
  cause the browser to display the text between the
  tags with a bold font.

6
More on HTML and XHTML

• Self-closing tags do not have the closing tag
  because they generally make something happen once
• For example, the tag that inserts a
  horizontal line, does not have a closing tag.
• HTML is not case sensitive but XHTML must be
  typed in all lowercase.

7
Still more on HTML and XHTML

• Images that appear on web pages are sent
  separately from the HTML document.
• The HTML includes code that points to the image
  file and tells the browser how to display it.
• You can view HTML for any web page by choosing
  View?Source in Internet Explorer.

8
Last bit for now on HTML tags

• The most common types of HTML tags are
• Formatting tags which change the appearance of
  text
• Link tags which insert links to other documents
• Media tags display graphics, sounds, movie clips,
  etc.
• Operational tags are used to setup the HTML page
  or allow the web page to talk to databases

9
Now the browser

• The browser has two jobs
• Make the HTTP requests to web servers
• Display the interpreted HTML tags
• The most common browsers today are Internet
  Explorer, Netscape, and Firefox.
• There are other less known programs as well as
  special browsers for people with disabilities.
• You should consider updating your browser when
  new versions are available for better eb surfing
  as well as increased security

10
Helper Apps, Plug-Ins, and Players

• Many files on the internet are not in HTML format
  and may need additional software to access.
• Plug-ins and helper applications are very similar
  in that they allow for different file formats
  such as music files and movie files.
• Players, such as Media Player and Flash Player
  are examples of applications that allow the
  browser to display other document types

11
More on HTTP

• HTTP, working with TCP/IP opens a socket or
  communication channel on the web server.
• Your browser makes requests through this socket
• After the response is complete, the socket closes
  and your computer is no longer talking to the
  web server.
• This means that HTTP is a stateless protocol
  because it ends the session after one request and
  generally forgets your browser ever talked to it.
• What this also means is that retrieving what we
  consider as a single web page may take many
  requests since the HTML and all images, sounds,
  and movies must be requested separately.

12
More on HTTP

• The server reports the status of the
  communication and the browser can interpret
  errors.
• Common codes include
• 200?the request was completed
• 404?Not found
• 500?Server error

13
How the web server works

• An incoming communication channel called a port
  is dedicated to listening for HTTP requests.
• Ports must be assigned because other internet
  programs such as email or ftp might be opening
  communication lines as well
• Web servers must has web server software
  installed to handle HTTP requests
• The server can handle many requests at one time
• If a web server has too many requests, it can
  slow the response time significantly or crash the
  server as in denial of service attacks.
• As a result, many large companies have many web
  servers handling HTTP requests in a group called
  a server farm

14
Cookies

• Cookies are little chunks of data generated by a
  web server that is stored in a text file on your
  computers hard drive.
• Cookies store information about the type of pages
  you visit, what pages on a site you visit, as
  well as present banner ads specifically to your
  tastes
• Generally, cookies are used to tailor a site to
  your use and is used to remember you because
  the HTTP stateless protocol cant.

15
More on cookies

• Cookies generally contain information about your
  internet activities as well as an expiration date
• The server that created the cookie can read the
  contents of the cookie and use them in displaying
  the web page
• Cookies are generally safe and cannot be executed
  to spread malicious code

16
Cookies and Privacy

• Cookies generally arent tied directly to your
  name
• They only record as much information as you allow
  them and can be disabled in the browser.
• Disabling cookies may affect your ability to surf
  some sites
• Cookies cannot search your computer for more
  information
• Cookies are only supposed to be accessed by the
  server that created it. Unfortunately, this has
  been compromised.

17
A little more on cookies

• P3P (Platform for Privacy Preferences Project)
  defines a standard set of headers for cookie
  files called the Compact Privacy Policy.
• You can tell your browser to accept or decline
  cookies based on these standards
• Generally, the policy will tell what will be done
  with personal data
• This does not guarantee privacy, just informs
  users of the risks and safeguards in place

18
Creating your own web page

• There are many tools you can use to create web
  pages
• Text editors require you to type all of the HTML
  tags and appears very similar to word processing
  software
• Conversion tools take one type of document such
  as a Word document and convert it into HTML
• Online authoring tools allow creators the ability
  to design their page online
• Application software called Web Authoring
  Software exists specifically for this purpose.
  Macromedia Dreamweaver and Microsoft Frontpage
  are examples.

19
The parts of a web page

• The head section tells the browser
  technical information such as what to display on
  the title bar, any included programs, and
  information for search engines.
• The body section contains all of
  the information that is actually displayed in the
  browser window

20
Formatting Web Pages

• You can use tags such as for bold for
  italics or to change the
  format of items on your web page.
• Cascading Style Sheets (CSS) allow you overlay a
  template that tells the browser how to format
  certain elements on a page
• Sometimes the style sheet is used for all of the
  pages in a site and is stored as an external
  style sheet.

21
Graphics, Sound and Animations

• All of these items are referred to by the HTML
  and downloaded separately then placed in the
  browser
• Example
  instructs the browser to place an image named
  happyface in the center of the browser.
• Graphics are limited to .jpg, .gif, and .png
  formats.
• Sound can be linked or can be embedded as
  background music

22
Video and Animation

• Generally, video must be linked to or embedded in
  the HTML document.
• Animated GIFs are specially constructed animated
  images that can be inserted as normal images
• Macromedia Flash allows further interactivity and
  multimedia with the help of a player
  http//www.annielennox.co.uk

23
Links, Buttons, and Hotspots

• Links use an HTML tag . The complete tag
  looks like this
• Tarleton Web
  Site
• You can insert a graphic and apply a link to form
  a button
• Different types of links allow different
  functionality
• Internal links allow you to surf within your web
  site, usually used for navigation
• External links connect visitors to other web
  pages
• Intrapage links or anchors link to a different
  spot on the same page
• Mailto links allow you to add a link that opens
  email software

24
More on links, etc.

• Using an imagemap, you can make different parts
  of an image clickable
• The clickable parts of an image that link to
  different documents are called hotspots
• When links are mistyped or they are no longer in
  existence, they are known as broken links.

25
HTML forms

• Allow you to collect information from visitors
• Generally, the information is collected by the
  form and then passes through a program that
  either emails it to someone or places it in a
  database
• CGI (common gateway interface) and ASP (active
  server pages) are common technologies that
  operate on the server and collect data from forms
  among other things.

26
Tables and Frames

• Tables and frames are used to enhance the layout
  of HTML pages
• Tables are similar to tables in Word and contain
  rows, columns, and cells.
• Data (text, pictures, etc.) can be placed in
  these cells that can vary in size.
• Frames, which are used less commonly, display
  more than one HTML page at a time where one,
  usually the navigation, remains static and the
  content area changes

27
Beyond the Basics

• DHTML is a combination of HTML,CSS, and
  programming that allow for animation and
  interaction
• XML and XSL allow structured data such as Excel
  spreadsheets
• Javascript and VBscript are programming languages
  use by web programmers to add simple scripts, or
  small programs
• These programs can be client side or server side
  scripts depending on where they run (the browser
  or the server!)
• Java applets are downloaded into memory and run
  on your computer
• Active-X components actually are installed on
  your computer
• Both Java and Active-X components are generally
  written in high level languages

28
Getting your Web Page on the Web

• Test each page locally to make sure they work and
  they are correct (no typos, misspellings, etc.)
• Transfer the pages to your area on a web server
• Test the pages and links on the server to make
  sure they work
• Update your site and check your links periodically

29
E-Commerce

• E-commerce stands for electronic commerce which
  is used for describing business that takes place
  over the internet
• Types of e-commerce
• B2C-Business to Customer
• B2B-Business to Business
• B2G-Business to Government
• C2C-Customer to Customer

30
Why is e-commerce so popular?

• More convenient for customers
• Can reach new geographical areas
• Each transaction is cheaper for the business
• For example, a withdrawal or deposit costs the
  bank 1 by teller, .25 by ATM, and .01 online
• Catalog orders via the telephone generally costs
  the business 2.50 online the cost is
  approximately .35

31
E-Commerce Worldwide

• Even though e-commerce lowers geographical
  boundaries, most still takes place in North
  America, Western Europe, and areas of Asia
• Places such as Africa, Russia, and Eastern Europe
  have limited access.
• Language and banking issues can also be
  problematic for foreign e-commerce

32
E-Commerce from the Customers View

• Allows for more convenient shopping (time and
  place)
• Can easily search through large catalogs using
  search functions
• Can track user preferences via cookies and
  enhance the shopping experience.
• Diasadvantages?

33
How do shopping carts work?

• Remember HTML is stateless and it doesnt
  remember that you were just on a previous page
  ordering something.so how does it keep things in
  your shopping cart?
• Most sites uses cookies. They record all of the
  items you add to your cart and then read the
  information from the cookie during the checkout
  procedure.
• Some sites actually place that information in a
  database and tie it to the number that is stored
  in your cookie.

34
Transaction Security and Privacy

• Is it safe to shop online?
• Packet sniffers can intercept data as it travels
  the internet
• Data can be stolen by hackers breaking into
  databases
• Dishonest employees can exploit your credit card
  information
• Hackers can break into your computer and steal
  the information
• You can visit a fake storefront and accidentally
  give your credit card info to the wrong people
• http//web.archive.org/web/20001018130644/http//w
  ww.ediebauer.com/

35
However.

• There are many safeguards in place
• SSL is a protocol that encrypts or encodes
  traveling between a client and an HTTP server
  (you can tell its secure by looking at the
  address. You will see https// instead of
  http//
• S-HTTP is an extension of HTTP that encrypts text
• One time use numbers issued by your credit card
  company
• Site keys that identify sites as real storefronts
  versus other storefronts
• Using a credit card online or offline carries
  inherent risk. Always check your statements and
  check your credit report at least once a year.
• By law you can request a free credit report once
  a year. Visit https//www.annualcreditreport.com/
  cra/index.jsp for more details

36
What are electronic wallets?

• Electronic wallets store billing information and
  shipping information
• Examples Microsoft Passport and Yahoo Wallet
• Allows for quick transfer of this information on
  e-commerce
• Data is protected by SET (secure electronic
  transmission) that ensures that the data is
  secure as well as legitimate
• There are risks with wallets as well and may be
  harvested by trojan horses or could possibly be
  exploited via email

37
Person to Person Payments

• Person to person payment allows individuals to
  send money via the web
• Paypal is the most used service for this although
  there are others.
• Protects your data from individual users and the
  service (Paypal) are the only one seeing credit
  card information
• Service is generally free to send money but some
  fees may be deducted on the receivers end.

38
Privacy

• You do take on some risk with your privacy by
  shopping online
• Spyware can track your movements on the web and
  share that information with advertisers
• Pop up ads and banner ads can drop cookies on
  your computer to do the same thing
• Also, invisible gifs are little blank areas on
  web pages that can plant cookies on your machine
  just by opening the page
• Combat these with pop-up ad blocker software and
  Anti-spyware software such as Ad-aware or Spybot

39
Encryption

• Used to protect your data as it travels the
  internet, encryption encodes your data so that if
  it is intercepted, it cannot be deciphered.
• Public key encryptions works like this
• Your browser requests a public key from the site
  you will be sending information
• Your browser uses that key to code your data
  before it is sent
• When the data arrives at the server, the server
  uses its private key to decipher the message your
  browser sent
• Only the server has access to the private key and
  is the only one who can decode the message

40
QuizDefine 10 of the 20 terms below

• SSL
• B2B e-commerce
• B2C e-commerce
• Plug-in
• P3P
• Javascript
• CGI
• Cookie
• Image map
• Spyware

• Internal Link
• Operational tags
• DHTML
• Markup language
• XML
• Formatting Tags
• Animated gif
• Java applet
• Electronic wallet
• Packet sniffer