website basics ray panko itm 385 e-commerce fall 2013 1
TRANSCRIPT
1Website BasicsRay PankoITM 385 E-CommerceFall 2013
2 Markup
now is the time for all good good peopleto come to the aid of their country
The quick fox jumpedover the dog
3 Markup Languages
<Heading 1>Call to Action</Heading 1>
<p>Now is the time for <i>all</i> good people to come to the aid of their country.</p>
Tags<p> and </p>
<Heading 1> and </Heading 1><i> and </i>
4 Hypertext Markup Language (HTML)
<p>To see how, click <a href=“Explanation.html” >here</a></p>
<p><image src=/images/flower.jpg></p>
Link
PlaceholderTag for Graphic
5 Hypertext Markup Language (HTML)
.htm or .html file is text only
Contains formatting and layout tags (boldface, columns, etc.)
Tags can be placeholders for images, videos, etc.
All nontext material is contained in separate files that are downloaded individually
6 Hypertext Markup Language (HTML)
Example Webpage with three graphics and a
sound
One HTML file, which is downloaded first
Three graphics files and one sound files
Five files downloaded in all
7 Hypertext Markup Language (HTML)
Browser renders multiple files as a complete page
8 Hypertext
In traditional text, pages were organized serially
Indexes, references, tables of contents, etc. were non-serial, but jumps to pages were manual.
9 Hypertext
Hypertext pages contain links to jump to other pages In the same website
In other websites
Website A Website B
10 Hypertext
Conceived of by Dr. Vannevar Bush after World War II
Named hypertext by Ted Nelsen in the early 1960s
First computer hypertext system built by Dr. Doug Engelbart in 1964 at Stanford Research Institute
HTML and HTTP standards created by Tim Berners-Lee at CERN around 1991
11 Website
Collection of linked webpages
Under the control of a single administrator
Website A Website B
12 Website Development Tools
Professional website development programs Dreamweaver
Limited tools Cookie-cutter tools
Variations in cookie cutterness
Associated Tools Graphics, multimedia
Content management systems
…
13 Basic Website Development
Create website on development PC
Upload to website server to host the website for public access
14 Webserver Options
Organizationally owned
Owned by your organization
Operated by your organization
May be good option for a large organization
Webhosting service
Owned by a webhosting service (GoDaddy.com, etc.)
Operated by a hosting service
Good choice for SMEs (small and medium enterprise)
15 Server Farms
Companies likeAmazon.com have thousands of identical rack-mounted webservers
An individual webpage request is forwarded automagically to an individual server for response
This solution “scales”—can grow without exponentially increasing costs
16 Group Development
When a dev checks out a webpage, it is locked so that others may not change it
Checkout
17 Professional Development
Development Computer
Testing Server
Production Server
For website development and updating
For testing initial websites and every subsequent change
For giving service to visitors
18 Hypertext Transfer Protocol (HTTP)
Hypertext Markup Language (HTML) Standard for format of marked-up
files
Hypertext Transfer Protocol (HTTP) Standard for downloading files from
webservers
19 Hypertext Transfer Protocol (HTTP)
Standard for downloading files from webservers HTML files
Photographs
Videos
…
Download HTML file first so that the browser knows what file to get and where to put the representations on the page
20 HTTP Request/Response Cycle
Browser sends HTTP request message to the server Asks for a specific file
Webserver sends HTTP response message back Contains the requested file
Or contains an error message
One HTTP request/response cycle for each file downloaded
21 HTTP Request/Response Cycle
One HTTP request/response cycle for each file downloaded
Example: Webpage contains two graphic images Need three HTTP request/response
cycles
One to download the initial HTML file
Two more to download the individual graphic images
22 HTTP Request Message
Lines of text with carriage return/line feeds at the end GET /images/cutedog.jpg HTTP
1.1[CRLF]
Host: dogs.com[CRLF]
23 Recap
HTML Hypertext Markup Language
Format for the main file of a webpage
Text-only
Contains tags for formatting, layout, and anchors for information referred to in links
Contains links to other webpages
Each file in a webpage requires an HTTP request/response cycle
24 Website Development
Use development software such as Adobe Dreamweaver
Create website with many webpages on your own computer
Upload your webpages to a webserver to provide public access
25 Professional Development
Webserver Options Webserver owned by the enterprise
(UH)
Hosted servers like those at webhosting services (GoDaddy.com)
Multiple devs can work on a website simultaneously
Use a testing server to test every change before uploading it to the production site
26 Dreamweaver Professional website development tool
Fully functional, deeply discounted version available at the UH Bookstore Buying it alone is cheapest
In a package with Photoshop and other adobe tools, more expensive but a great deal
Available at the bookstore, but ask for the non-boxed version (far cheaper)
Version 6.0 is mandatory in the class
27 Pau
Questions?
Comments?
Cries of outrage?