Top Banner
Website Development & Management Introduction & Overview CIT 3353 -- Fall 2006 www.clt.astate.edu/jseydel/mis3353 Instructor: John Seydel, Ph.D.
19

Website Development & Management Introduction & Overview CIT 3353 -- Fall 2006 Instructor: John Seydel, Ph.D.

Dec 25, 2015

Download

Documents

Jonas Cannon
Welcome message from author
This document is posted to help you gain knowledge. Please leave a comment to let me know what you think about it! Share it to your friends and learn new things together.
Transcript
Page 1: Website Development & Management Introduction & Overview CIT 3353 -- Fall 2006  Instructor: John Seydel, Ph.D.

Website Development & Management

Introduction & Overview

CIT 3353 -- Fall 2006www.clt.astate.edu/jseydel/mis3353

Instructor: John Seydel, Ph.D.

Page 2: Website Development & Management Introduction & Overview CIT 3353 -- Fall 2006  Instructor: John Seydel, Ph.D.

Student Objectives

Upon completion of this class meeting, you should be able to: Locate the course materials and homework Define: web page, website, homepage,

browser, server Identify parts of a URL Discuss browser/server interaction Use basic web terminology Understand basic markup concepts

Page 3: Website Development & Management Introduction & Overview CIT 3353 -- Fall 2006  Instructor: John Seydel, Ph.D.

First, Some Introductions

CoursePeople Name Major Hometown Web development experience Something you hope to learn (in this class) Something interesting, not associated with

school

Page 4: Website Development & Management Introduction & Overview CIT 3353 -- Fall 2006  Instructor: John Seydel, Ph.D.

Course Materials

Course website: Syllabus

Office hours Texts Course description, objectives, expectations Grading

Portfolio site Exams & quizzes

Homework Handouts Always under construction (i.e., evolving)

Various websites Web Developers Virtual Library (www.wdvl.com) The PHP Group (www.php.net) MySQL website (www.mysql.com) Apache website (www.apache.com) Others . . .

Page 5: Website Development & Management Introduction & Overview CIT 3353 -- Fall 2006  Instructor: John Seydel, Ph.D.

Our Platform

OS: WinXP on development end SuSE Linux on server end

User agent (i.e., browser): IE 6.0 or higher But always compare to results in others (e.g.,

FireFox)Editors: NotePad and PHP DesignerWeb server: Apache 2Flash MX (maybe)But not

FrontPage DreamWeaver Other WYSIWYG tools

Page 6: Website Development & Management Introduction & Overview CIT 3353 -- Fall 2006  Instructor: John Seydel, Ph.D.

Our Development Environment

Multiple independent applications running simultaneouslyBrowser windows (view web pages)

Local: solutions “disk” Server

File manipulation windows Windows Explorer (solutions “disk”) Internet Explorer / FTP: server Works best when these windows are cascaded rather

than full-screen or minimized

Source code editors NotePad PHP Designer No WYSIWYG options (i.e., for this class)

Page 7: Website Development & Management Introduction & Overview CIT 3353 -- Fall 2006  Instructor: John Seydel, Ph.D.

Some Web BasicsBrowser/server interaction

User agent (typically running browser) requests file/page

Then: Page (and related files) pulled from local cache Or server retrieves and sends

Multiple processes all on the same server A server process listens for and responds to requests

from clients Servers using Internet protocols manage multiple listener

processes through the concept of ports A port corresponds to a memory location on a server Every request sent from a client to a server must specify:

Server’s IP address Port number of the server process to which the message is

directed

It’s simply a modern means of processing data: input, processing, output . . .

Page 8: Website Development & Management Introduction & Overview CIT 3353 -- Fall 2006  Instructor: John Seydel, Ph.D.

Input / Processing / Output

Input (data)

Output

HTML file (text)Browser

&/orServer

(Program code: VB, Java, . . . )

Web page(s)

Process/Program

Rich: includes programming, markup, pointers to files, . . .

Page 9: Website Development & Management Introduction & Overview CIT 3353 -- Fall 2006  Instructor: John Seydel, Ph.D.

HTML: A Computer Language

Programming languages Standalone

Procedural Traditional (e.g., COBOL) Object-oriented (e.g., Java, VB.NET)

Nonprocedural (e.g., SQL) Scripting languages (rely on other components)

JavaScript VBScript Others (e.g., Perl)

Markup languages (e.g., SGML, HTML, XHTML, DHTML)Stylesheet languages (e.g., CSS, XSL)Database languages (e.g., SQL)Note: we’ll use most of these during the semester

Page 10: Website Development & Management Introduction & Overview CIT 3353 -- Fall 2006  Instructor: John Seydel, Ph.D.

Markup Languages: An Overview

HT M L

XHT M L M athM L G uestM L . . .

XM L Others

SG M L

Page 11: Website Development & Management Introduction & Overview CIT 3353 -- Fall 2006  Instructor: John Seydel, Ph.D.

An Example: Home Page for Suzy Student

First, what’s a Web page? Website? Homepage?

Refer to the handout Plain text file (index.txt) Same text but marked up (index.html) Output

Note the “hyper” nature of hypertext

Page 12: Website Development & Management Introduction & Overview CIT 3353 -- Fall 2006  Instructor: John Seydel, Ph.D.

Overview of Markup Syntax

Standard elements (e.g., paragraph)<tag attr1=“...” attr2=“...” . . .>

ContentMore content . . .

</tag>Empty elements (e.g., image)<tag attr1=“...” attr2=“...” . . . />

Examples: see Suzy Student’s pagesNote:

Browsers are very forgiving, but don’t try to take advantage; use good coding practices (indentation, closing tags, etc.)

Many ways to do most things, and many will work but don’t follow good practice; hence, for the next 15 weeks, do it my way!

Page 13: Website Development & Management Introduction & Overview CIT 3353 -- Fall 2006  Instructor: John Seydel, Ph.D.

HTML in Suzy Student’s Page

Main element <html> contains <head> which contains <title> and others . . . <body> which is where the content is

Within the <head> element <title> which shows what will appear in the browser title

bar <style> which defines appearance variations from

defaults

Within the <body> element Headings <h1> and <h2> Image <img /> Hyperlink <a> List <ul> which contains <li> Others: <br />, <p>, <hr />

Don’t forget the closing tags

Page 14: Website Development & Management Introduction & Overview CIT 3353 -- Fall 2006  Instructor: John Seydel, Ph.D.

Summary of Today’s Objectives

Locate the course materials and homeworkDefine: web page, website, homepage, browser, serverIdentify parts of a URLDiscuss browser/server interactionUse basic web terminologyUnderstand basic markup concepts

Page 15: Website Development & Management Introduction & Overview CIT 3353 -- Fall 2006  Instructor: John Seydel, Ph.D.

Appendix

Page 16: Website Development & Management Introduction & Overview CIT 3353 -- Fall 2006  Instructor: John Seydel, Ph.D.

Some Web Skills

HTML or XHTMLJavaScriptPHP or ASP or CFML or CGI or . . . CSSSQLFrontPage or DreamWeaver or . . .

Page 17: Website Development & Management Introduction & Overview CIT 3353 -- Fall 2006  Instructor: John Seydel, Ph.D.

Applications Involved

Page 18: Website Development & Management Introduction & Overview CIT 3353 -- Fall 2006  Instructor: John Seydel, Ph.D.

Anatomy of a URL

Example:http://www.clt.astate.edu:80/jseydel/mis3353/syll3353.htm#text

Protocol Assumed is http Others: mailto, ftp, file (i.e., local resource), . . .

Location of the computer (corresponds to IP) Domain Domain name Machine Port (not part of IP); 80 is standard for http

Location on the computer Folder Subfolders File & extension (.htm, .asp, .html, .php, . . . ) Bookmark (anchor)

Page 19: Website Development & Management Introduction & Overview CIT 3353 -- Fall 2006  Instructor: John Seydel, Ph.D.

Browser/Server Interaction