Web Programming Chapter One

Chapter One
An Overview of Internet and the Web

What is an Internet?
 It is a network of the interlinked computer networking worldwide, which is
accessible to the general public.
 The term “Internet” means collection of interconnected networks.
 It is a network of connected computers.
 These interconnected computers work by transmitting data through a special
type of packet switching which is known as the IP or the internet protocol.
 Internet made up of thousands of networks worldwide.
World Wide Web
 Is an architectural framework for accessing linked documents.
 A way to access and provide information in various media via the Internet.
 A hypertext based system for providing, organizing and accessing information
that allows users to jump from one information space to another.
 Comprises servers and client computers on the Internet that communicate using
the hypertext transfer protocol (http)
 Information resource consisting of web pages that organize and present vast
amount of information (mostly text embedded with images, audio, video, or
animation).
 No individuals control the web rather than different companies or institution own
(manage) them.
What makes the Web work?
Hypertext: - provides easy navigation among documents and resources
Protocols: - set of standards used to access resources via the Web
Universal Resource Locator (URL): - uniform naming scheme for Internet
resources
Client and server computers: - Web access is based on client/server technology
Hypertext
 Presents and relates information as hyperlinked documents that point to other
documents or resources.
 A hyperlink is usually embedded in the text, on a highlighted word, phrase,
symbol, icon, or other graphic elements.
 Web pages are hypertext documents on the Internet mostly created using
HTML.
Hypertext Markup Language (HTML)
 It is the publishing language of the World Wide Web
 the standard used to create web pages.
 A markup language that defines the structure of information by using a variety
of tags and attributes.
 Which is designed to display text and other information on a screen and
provide hyperlinks to other Web documents.
Web Protocols
 A network protocol is the set of rules governing a conversation between a client
and a server.
 It governs how computers communicate with each other.
There are many protocols such as: -
1. HTTP ( Hypertext transfer protocol)
 The underlying protocol used to transmit information over the Web.
2. FTP ( File transfer protocol)
 It is one of the oldest and probably the most popular protocol to be used to
move files on the Internet.
3. SMTP (the e-mail message protocol)
 A protocol to allow two users to communicate through e-mail messages
over the Internet.
Uniform Resource Locator (URL)
 Web documents and resources are located and linked through their URL’s
 A unique name that identifies an Internet site
 Uniform naming scheme that specifies unique addresses for web servers,
documents, and other resources, no matter what its access protocol.
 It points to where the data or service is located (the host computer and the
directory in which it resides) on the Internet.
Two things are given by the URL
1. Exact location of the docusment
2. The method or protocol by which to retrieve and display the document
Example: -
http://www.cs.pitt.edu/~mehmud/cs134/index.html
http:// – specifies the protocol
www.cs.pitt.edu – specifies the host name / domain name
/~method/cds134/index.html – specifies the path of the document on the host
Client-server architecture
 Client Server Architecture is composed of three components
Clients
 Applications that run on computers
 Rely on servers for: - Files, Devices, Processing power
 Example: E-mail client
 An application that enables you to send and receive e-mail
Servers
 Computers or processes that manage network resources: -
 Disk drives (file servers),
 Printers (print servers) ,
 Network traffic (network servers)
Example: Database Server: -
 A computer system that processes database queries
Communication Networks
 Is the Networks Connect Clients and Servers
 The Web client and the Web server are application programs.
 Application layer programs do useful work like retrieving Web pages, sending and
receiving email or transferring files.
 Lower layers take care of the communication details.
 The client and server send messages and data without knowing anything about the
communication network.
Client–Server Computing
Servers
 computers that host web documents and provide information through a web
server program
 Store and protect data
 Process requests from clients
Clients
 Computers that access web documents using an application program called web
browsers.
 Make requests
 Format data on the desktop
 A user runs a web browser on a client computer
 Client computer makes requests to a server machine
 Server machine run a web server program that sends the requested item
or an appropriate error message back to the browser
 Web browser displays the item or error sent back by the server to the
user.
Web browser
 An application software that is used to locate and issue a request for the page
on the web server that hosts the document.
 It also interprets the page sent back by the web server and displays it on the
monitor of the client computer.
Example: - Microsoft Internet Explorer
• Netscape Navigator
• Opera
• Mozilla
• Lynx
Web server
 It is an application software that listens and responds to a client computer’s
request made through a web browser.
 It is a Machine that hosts web pages and other web documents
 Provides web documents and other online services using HTTP.
Example: - Apache
What is a web page?
 It is an electronic document that typically contains several types of information
accessible via the World Wide Web.
 It is a set of information created, and organized, using HTML and/or other web
page authoring and development tools.
 Interpreted and displayed on the screen according to the instructions of the web
page authoring tool
What is a web site?
 It is a collection of related web pages of a certain individual, group, or
organization, connected through a system of hyperlinks, hosted in a particular
domain.
 It can be a single web page that contains links to related information located on
several websites
What is a home page?
 It is the main page of a website.
 It typically serves as an index or table of contents to other web pages.
 Usually, it is the first web page or the welcome page the users see when they
visit a website.
Designing a Good Website
 The success of any website entirely depends on how its web design is.
 Whether the designers have taken the utmost care or not while developing it.
 It doesn’t necessarily mean how it looks like and feels like but is how it works.
 Even a simple looking website with exceptional usability and well structured
typically performs amazingly on Google. User views of such websites are also
higher than those with poor user experience.
Principles of Good Web Design
1. Simple is the Best
 Putting too many elements on the page may lead to distracting visitors from the
main purpose of your website.
 Simplicity always works in an effective webpage design.
 Clean and fresh design of your website.
 not only makes the website appealing.
 but also helps the user to navigate from one page to another seamlessly.
 Keep your design as simple as possible so that the visitors can feel it easy to
use and can find their ways easily.
2. Consistency
 Give your attention to match design elements throughout each of the pages.
 The fonts, sizes, headings, sub-headings and button styles must be the same
throughout the website.
3. Typography and Readability
 You should keep your typography visually appealing and readable for visitors.
 Make proper combination of typefaces for each and every design element such
as headlines, body texts, buttons, etc.
4. Mobile Compatibility
 Keeping in mind the ever-growing usage of smart phones and tablets web
design must be effective for various screens.
 If your website design doesn’t support all screen sizes, the chance is that you
will loss the battle to your competitors.
5. Color Palette and Imagery
 A perfect color combination attracts users while poor combination can lead to
distraction.
 Using perfect color palette for your website can create pleasing atmosphere,
thus leaving a good impact on visitors.
 Avoid using too many colors.
 Don’t use multiple vibrant images.
6. Easy Loading
 No one likes the website that takes too much time to load.
 Optimize image size, combine code in to a central CSS or JavaScript file as it
reduces HTTP request.
 Compress HTML, JavaScript and CSS for enhanced loading speed.
7. Easy Navigation
 Study shows that visitors stay more time on the websites having easy navigation.
 For effective navigation:
 create a logical page hierarchy, using bread scrums and designing clickable
buttons.
8. Communication
 your website should able to communicate your visitors efficiently, most
probably they would spend more time on your website.
 Tricks that may work to establish effortless communication by making good use
of headlines and sub-headline and using bullet point rather than long gusty
sentences.
Building Blocks of a Web
 HTML: - Hyper Text Markup Language which is the language of a web.
 CSS: - Cascading Style Sheet which is used to give style for a web.
 JS: - JavaScript which is used for client-side scripting.
 PHP: - Hyper text Preprocessor which is used for server-side scripting.
 SQL: - Structured Query Language used for database.
Types of a web page
1. Static Web Pages
 A webpage that usually comes with a fixed number of pages that have specific
lay out.
 The content is literally static and doesn’t change in response to user action.
 It is created with HTML and CSS in simple text editor like notepad.
 It uses only client-side scripting.
 Fixed in terms of page number and content
 It is purely informational and there is no user interaction
Example: - Simple page for business
- Building a port folio/CV page with personal information.
2. Dynamic Web Pages
 It relies on both client-side and server-side scripting languages JavaScript and
PHP.
 It changes or customizes itself frequently and automatically.
 More complex in terms of building and design but they are also versatile.
 The data is updated every moment
 It is more of functional
Example: - Quora.com, Facebook.com, youtube, …
Thank You!

Web Programming Chapter One

Uploaded by

Copyright:

Available Formats

Web Programming Chapter One

Uploaded by

Document Information

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

Web Programming Chapter One

Uploaded by

Copyright:

Available Formats

Chapter One

An Overview of Internet and the Web

You might also like