390 likes | 509 Views
Welcome. CSCI/CINF 4230 Web Application Developement Section 02 Tue., 7:00–9:50 p.m. Instructor: Charles Moen Email – crmoen@juno.com Web page – http://sce.uhcl.edu/moenc Office – Delta Building 232 Office hours Tue., 5:00–7:00 p.m.
E N D
Welcome CSCI/CINF 4230 Web Application Developement Section 02 Tue., 7:00–9:50 p.m. Instructor: Charles Moen Email – crmoen@juno.com Web page – http://sce.uhcl.edu/moenc Office – Delta Building 232 Office hours Tue., 5:00–7:00 p.m. If the hall door is locked, phone me at (281) 283-3848 Home – 281-796-2820
CSCI/CINF 4230 Client-side Web development HTML, XHTML, Cascading Style Sheets (CSS), JavaScript Server-side Web development ASP.NET, C# Server-side database access ASP.NET, C# Other basic topics in Web development HTTP protocol, parameter passing, session tracking, cookies Web 2.0
Today’s Objectives Class roster Course overview Required textbooks Web site Syllabus and schedule Hosting your web sites for this course at UHCL How to succeed Basic concepts Web 2.0 26-Aug-2008
Required Textbooks David Schultz and Craig Cook, Beginning HTML with CSS and XHTML: Modern Guide and Reference. Apress, 2007. ISBN 978-1-59059-747-7 Matthew MacDonald, Beginning ASP.NET 3.5 in C# 2008: From Novice to Professional, Second Edition. Apress, 2007. ISBN 978-1-59059-891-7 Course Overview
Recommended Reference Books Stephen Spainhour and Robert Eckstein (ed.), Webmaster in a Nutshell, 3rd Edition. O’Reilly, 2002. ISBN 978-0-59600-357-9 Other books are listed in the “FAQs” page for this class Safari Books Online by O'Reilly http://safari.oreilly.com/ You can access Safari from any PC inside UHCL campus network. Provides the full text of hundreds of books Course Overview
Course Web Pages Course page http://sce.uhcl.edu/moenc/csci4230fall08/index.html Schedule http://sce.uhcl.edu/moenc/csci4230fall08/schedule.html Syllabus http://sce.uhcl.edu/moenc/csci4230fall08/syllabus.html FAQs http://sce.uhcl.edu/moenc/csci4230fall08/resources.html Course Overview
Hosting Your Web Site The dcm server is used to host Web sites for UHCL courses You will get an account on this server, and your homework must be done on it dcm.uhcl.edu Operating system: Windows Server 2003 Web server: IIS6 http://dcm.uhcl.edu/yourUserName Files for your Web pages go in the “pages” folder The “db” folder has an Access database file, “db.mdb” Krishani Ekanayake is the administrator abeysekera@uhcl.edu Course Overview
How to Succeed Expect to spend 10–15 hours per week on this class Use a text editor to write the code, and write a lot of code Read other peoples’ programs After grading is finished, post your homework on your home page Homework assignments Start them early, and hand them in on time Check the requirements and make sure nothing is missing Team project Select your team mates Attend the classes & participate Read the book and the resources Course Overview
The Internet A global network of interconnected networks Based on technology developed in the 1960’s ARPAnet, the first version, was funded by the U.S. Department of Defense in a quest to implement a computer network that could survive a nuclear bomb attack – if part of the network was destroyed, then routers would direct packets through the surviving paths(ARPAnet = Advanced Research Projects Agency Network) Goal: a robust network of many computers for sharing scientific and military data Initially, ARPAnet connected only four computers at UCLA, Stanford Research Institute, UCSB, and the University of Utah. Mid 1970s, many government agencies and universities were connected;Early 1990s, private and commercial networks were added No one owns the Internet The Internet Society, a 1992 non-profit group, oversees its policies and protocols Basic Concepts (Dougherty, Howe, Tyson)
Growth of the Internet Basic Concepts (http://www.internetworldstats.com)
The Internet (Continued) General-purpose network TCP/IP - protocols for sending packets of data on the network Many services run on the Internet email FTP telnet World Wide Web (just one service that uses the Internet) Every computer that connects to the Internet is already part of a smaller network When you connect to the Internet at home, you become part of your Internet Service Provider’s (ISP) network At work or at school, your computer connects to the Internet through the Local Area Network (LAN) Thus, the Internet is a network of networks Basic Concepts (Dougherty, Howe, Tyson)
Internet Infrastructure Basic Concepts (Tyson; Wikipedia) Point of Presenceis the physical connection to the Internet used by the ISP(servers, routers, switches) Network Access PointFour physical facilities for data exchange between service providers. Now replaced by Internet Exchange Points (IXP)(network switches) Internet Service Provider is a company that provides access to the Internet
World Wide Web “A system of interlinked hypertext documents accessed via the Internet”- Wikipedia Created by Tim Berners-Lee In 1989, proposed it as a way to share documents over a network while he was working at CERN (European Laboratory for Particle Physics) Originally conceived as just a collection of shared documents Based on hypertext – links within the text that link to other text By 1990, built the first Web server, named “httpd,” and the first Web browser, named “WorldWideWeb” His work was released to the public in 1993 World Wide Web Consortium (W3C) Standards organization for the Web Founded by Tim Berners-Lee Basic Concepts (Berners-Lee, Dougherty, Howe, Tyson, Wikipedia) Sir Tim Berners-Lee from www.w3c.org/People/Berners-Lee
How does the Web work? The Web uses a client-server architecture Basic Concepts (Guelich) Web server software, such as Apache or IIS is the server 1. The browser sends an HTTP request over the Internet to the server A Web browser, such as FireFox is the client 3. The server sends an HTTP response to the browser containing the HTML text 2. The server examines the request to determine what document to return, index.html in this example 4. The browser interprets the HTML and displays it as a Web page GET /index.html HTTP/1.1
Client-server Architecture Web application development technologies: Basic Concepts (Guelich) Web server software, such as Apache or IIS is the server A Web browser, such as FireFox is the client HTTP Client-side HTML XHTML CSS JavaScript Server-side ASP.NET C#
Web Server Server software Installed on a computer connected to the Internet Often the computer that runs the server software is referred to as a “Web server” Manages a collection of HTML documents, as well as documents in other languages, such as C# Manages and “serves” the clients’ requests for the documents Two Web server programs dominate the market share today Apache Microsoft Basic Concepts (Doughterty, Netcraft)
Web Server Netcraft, June 2008 Web Server Survey. (2008). [Online]. Available: http://news.netcraft.com/archives/web_server_survey.html Basic Concepts (Netcraft)
User Agents Software that interprets HTML Many different devices can access the Web Computers, PDAs, cell phones, game consoles, appliances Web browser The most familiar user agent Graphical Web browser – pages rendered with styled text, colors, and images The most-popular browsers Microsoft Internet Explorer Firefox Safari Basic Concepts (Schultz)
URL Uniform Resource Locator The address of a document on the Web Basic Concepts (Ding, Spainhour, Schultz) http://sce.uhcl.edu/moenc/index.html Protocol Host nameor IP address following by an optional port number, e.g. sce.uhcl.edu:80 Path to the document Rules for moving data over the Internet The root directory in this path is defined by the server, and may not be the same as on the host’s file system Extension Indicates the type of file. If there is no document name in the URL, the server is usually configured to use “index.html” or “default.html” The human-readable domain name is translated to a machine usable IP address by the Internet’s Domain Naming Service servers
URL for local development The loopback address Basic Concepts (Ding, Spainhour) http://127.0.0.1 http://localhost
Web Design Evolution First Generation Plain, mostly text Single column Presentation (appearance) set by browser defaults Gray background with black text Links were underlined and in color Emphasis on structure, not design Few images Horizontal rules Bullet lists Often created by programmers, not designers Slow modem connections were common Basic Concepts (Siegal, Ding) From Wikipedia
Web Design Evolution Second Generation Netscape extensions to HTML introduced <table> JavaScript The <blink> tag Designers usually controlled the presentation Some common features White backgrounds Banners across the top of the page Icons and graphic text for headings Graphic buttons with beveled edges Tiled images in the background Animated gif graphics Basic Concepts (Siegal, Ding) From the Internet Archive WaybackMachine www.jpmorgan.com, June 30, 1998
Web Design Evolution Second Generation(cont.) Structure Main, graphic-intensive home page Menus and button bars for navigation Tables, introduced by Netscape, were often used to organize the page into columns Many sites were well-designed The best ones showed that the designers were concerned about legibility and communicating clearly to the visitor Many sites were garish and ugly The worst second generation sites used technical tricks, such as animated gif icons just because they were “cool” Basic Concepts (Siegal, Ding) From the Internet Archive WaybackMachine www.uiuc.edu, March 03, 1997
Web Design Evolution Third Generation E-commerce Database-driven Clever visual design based on a theme Tables used extensively CSS used for presentation Designed to involve userswith the site Often started with a splash screen Basic Concepts (Siegal, Ding) From the Internet Archive WaybackMachine www.klutz.com, Feb 02, 2001
Web Design Evolution Fourth Generation Sophisticated visual design Presentation is designed with div elements, defined with CSS, not tables Most sites use server-side software Multi-tiered on the server side Database driven Possibly with web services New technologies AJAX and client-side software Flash, Silverlight, Adobe AIR Big focus is web usability and accessibility Basic Concepts (Siegal, Ding) http://www.ncsa.uiuc.edu http://www.jpmorgan.com http://www.uiuc.edu http://www.klutz.com
Accessibility and Usability Accessibility Your Web site should be accessible to anyone under all circumstances Issues: Users with diminished eyesight must use screen readers Some users don’t use a mouse; they may be partially disabled Some users disable JavaScript Usability Enhancing your page with features that make it easier to use Examples: Show a form field only when it is needed by the user Make important topics easy to find Keep the user interface simple Basic Concepts (Koch, Ding)
What is Web 2.0? A phrase by Tim O’Reilly Published online, “What Is Web 2.0, Design Patterns and Business Models for the Next Generation of Software” September 2005 Web 2.0 Conference Now in its fifth year, called “Web 2.0 Summit” “Web 2.0” and the conference were created by brainstorming about what is important to the Web after the collapse of the “dot-com bubble” Web 2.0 (O’Reilly, Ding, Yue)
What is Web 2.0? A buzzword – difficult to understand because there’s no consensus on its meaning Generally refers to a new phase of Web business models and technologies An attempt to identify characteristics of Web businesses that survived the dot-com crash It is not a new standard for the World Wide Web Web 2.0 (O’Reilly, Ding, Yue)
Web 2.0 (O’Reilly, Ding, Yue) Web 1.0 vs. Web 2.0 Web 1.0 Web 2.0 Wikipedia Participation Blogging Web services Folksonomies Google • Britannica Online • Publishing • Personal websites • Screen scraping • Directories • Netscape
Some Web 2.0 Characteristics Web-centric Data intensive Open architecture for participation Social networking Lightweight software development Perpetual beta Business model takes advantage of the long tail Web 2.0 (O’Reilly, Ding, Yue)
Web 2.0 (O’Reilly, Ding, Yue) Software DevelopmentWeb 2.0 Style Microsoft – “old school” Google – Web 2.0 Services through the Web, no sales, no licensing Universal thin client (browser) In “perpetual beta” – will be improved incrementally over the course of time One version One copy; hidden massive server farms Open standards and public API Value is the data • Traditional sales and licensing • Heavy weight desktop software • Long update cycle • Tens of versions • Millions of copies • Backward compatible • Value is in the software
The Long Tailand Web 2.0 Chris Anderson (2005) http://www.wired.com/wired/archive/12.10/tail_pr.html “The future of business is selling less of more” “Make everything available” Keep prices as low as possible Help the buyers find what they want Amazon.com vs. Barnes and Noble Netflix vs. Blockbuster Strategy differences “Blockbuster” strategy is to sell a large number of very popular items “Long Tail” - Sell small quantities of obscure items to a large number of people Web 2.0 (Anderson, Wikipedia) The Long Tail Popularity Most popular Least popular Products are ranked by popularity on the horizontal axis
Food for Thoughtabout The Long Tail Anita Elberse, “Should You Invest in the Long Tail?”. Harvard Business Review, 2008. http://harvardbusinessonline.hbsp.harvard.edu/hbsp/hbr/articles/article.jsp?ml_action=get-article&articleID=R0807H&ml_issueid=BR0807&ml_subscriber=true&pageNumber=1&_requestid=57934 Anita Elberse investigated actual sales patterns in the music and home video industries to test whether the Long Tail theory has a good potential for profit Her conclusions: The Long Tail theory might work, but in limited cases The blockbuster strategy is still the most reliable Web 2.0 (Elberse)
Some Web 2.0 Technologies XML AJAX Web Services API Social networking Web syndication, e.g. RSS Folksonomies – collaborative tagging Ruby on Rails Web 2.0 (O’Reilly, Ding, Yue)
Some Web 2.0 Applications Flickr http://www.flickr.com Select “Explore” to see a “tag cloud”, an example of a folksonomy where the most popular tags are in a larger font size Google Docs Cloud computing – software is provided as an Internet service http://docs.google.com/Presentation?id=dg787rt7_337dpzzgbdd Del.icio.us Storing, sharing, and discovering web bookmarks GMail MySpace.com Bit Torrent Web 2.0 (O’Reilly, Ding, Yue)
Food for Thoughtabout Web 2.0 technologies Is the Web still the Web? Neil McAllister (June 3, 2008) http://weblog.infoworld.com/fatalexception/archives/2008/07/is_the_web_stil.html “ Given the growing number of data types and file formats being transmitted over HTTP and the increasing complexity of the applicationsthat make use of them, is today’s Web really still the Web? Or is it morphing into something else?” Tim Berners-Lee – the Web as information storage based on hypertext Web documents – text marked up with HTML; linked to other documents Today: Rich client interface Technologies like Ajax, Flash, MS Silverlight, Google Web Toolkit, cloud computing Is it inappropriate to force these technologies to use the Web infrastructure? Web 2.0 (McAllister)
References Chris Anderson (2005). “The Long Tail”. [Online]. Available: http://www.wired.com/wired/archive/12.10/tail_pr.html Berners-Lee, Tim. (1990). “WorldWideWeb: Proposal for a HyperText Project”. [Online]. Available: http://www.w3.org/Proposal Berners-Lee, Tim. “Tim Berners-Lee” (Homepage). [Online]. Available: http://www.w3.org/People/Berners-Lee Ding, Wei, “Introduction of Web Application Development” UHCL lecture slides, 2008. Dougherty, Dale and Richard Koman, The Mosaic Handbook for Microsoft Windows. Sebastopol, CA: O’Reilly and Associates, Inc.,1994. Howe, Walt. (2007). “A Brief History of the Internet”. [Online]. Available: http://www.walthowe.com/navnet/history.html Koch, Peter-Paul, PPK on JavaScript. New Riders, 2007. O'Reilly, Tim. (2005). “What Is Web 2.0". [Online]. Available: http://www.oreillynet.com/pub/a/oreilly/tim/news/2005/09/30/what-is-web-20.html. Tyson, Jeff. “How Internet Infrastructure Works”. [Online]. Available: http://computer.howstuffworks.com/internet-infrastructure.htm Siegal, David, Creating Killer Web Sites (Second Edition). Hayden, 1997. Yue, Kwok-Bun, “Web 2.0, Research and You”. Presentation at UHCL, 2006.