Survey
* Your assessment is very important for improving the workof artificial intelligence, which forms the content of this project
* Your assessment is very important for improving the workof artificial intelligence, which forms the content of this project
Introduction to Web Design Using Microsoft® Expression® Studio CHAPTER 1/MODULE 1 INTRODUCTION TO WEB DESIGN USING MICROSOFT EXPRESSION STUDIO CHAPTER 1/MODULE 1 The Evolution of Web Design: How People Viewed the Web and How They Built Web Sites with that View There are many additional sources for learning about the history of the Internet from the Internet Society at http://www.isoc.org/internet/history/ and predictions about its future from Elon University at http://www.imaginingtheinternet.org/. Development of the World Wide Web In 1989, Tim Berners-Lee, a computer specialist working at CERN (European Organization for Nuclear Research), the world’s largest particle physics research laboratory in Geneva, Switzerland, created the World Wide Web. Originally when he first wrote a proposal for a global hypertext system, he called it “Mesh,” which he later renamed the World Wide Web. No longer frustrated by his inability to share information, he could now communicate electronically with others and link research documents creating a “web” of information. The Web, because of its richness of content and media—audio, video, animation, and music—popularized the Internet. By 1992, we were “Surfing the Internet,” a phrase coined by Jean Armour Polly, a New York librarian. It’s interesting to note that the concept of hypertext is credited to Vannevar Bush, an American scientist famous for his work on analog computing and his role as the first presidential science advisor during World War II. His thoughts about a machine he called the Memex, which would allow the user to follow trails of thought, were described in the essay "As We May Think" in the Atlantic Monthly journal in July 1945. The W3C (World Wide Web Consortium) was established to develop standards and guidelines for the Web. Tim Berners-Lee has served as the director of the W3C, which is based at the Massachusetts Institute of Technology, Laboratory for Computer Science since it was created in 1994. Tim Berners-Lee With the introduction of the World Wide Web, there was an urgent need to develop browsers to allow users to view content on both the Internet and the Web. Tim Berners-Lee developed the first browser, which he named WorldWideWeb. on December 25, 1990. In 1992, the second browser, developed at the University of California at Berkeley, was called ViolaWWW. It could display graphics and download applets. The third browser, Midas, was developed later that year at SLAC (Stanford Linear Accelerator Center). The first Web site in North America was also developed at SLAC. The next browser was Samba, developed for Macintosh computers. Mosaic, one of the early browsers with cross-platform support for all users—not just researchers or academia —was developed at the National Center for Supercomputer Applications (NCSA), a 1-2 INTRODUCTION TO WEB DESIGN USING MICROSOFT EXPRESSION STUDIO research institute, at the University of Illinois at Urbana-Champaign. Two students, Marc Andreessen and Eric Bina, are credited as the key developers. After graduating, Andreessen with Jim Clark co-founded Netscape Communication Corporation to produce and market their browser, which was released in 1994. Netscape quickly became the world’s dominant browser. In 1995, it had revenues of $85 million. The following year, revenues increased to $346 million. However, Microsoft entered the field with its browser, Internet Explorer, and quickly gained control. The browser wars hastened the development of HTML. The following chart is based on data from Onestat.com. Browser Wars Market Share Percentage: 1995 1997 1999 2001 2003 Internet Explorer 2.9 39.4 67.5 89.9 95.9 Netscape 80.1 57.6 30.7 9.8 3.7 Other 17.0 3.0 1.8 .3 .4 To view the most recent information on browser status, visit the W3Schools Web site at www.w3schools.com/browsers/browsers_stats.asp or The Counter at www.thecounter.com/stats/ for consumer oriented Web site statistics. In 1999, Netscape was purchased by AOL (America Online). In February 2008, AOL announced it would cease development on all Netscape Web browsers. The company continued supporting the current version, Netscape 9, by releasing patches or security fixes until that date. After February 1, 2008, all development stopped. Other browsers today include Firefox, Safari, Flock, Opera, and MozBraille and Libbraille for visually impaired users. First Generation Web Design (1991–1994): "Build it and they will come" That was all that seemed to be necessary. Everyone was excited by this engaging, informationfilled resource allowing quick and easy clicks to supplementary information. These early designs were primarily static sites with basic structures that consisted of headings and paragraphs. Users could navigate to various pages by clicking hyperlinks. Page content was structured in basic layouts. Personal sites were the rage then. Blogs are more popular now. The entire URL (Uniform Resource Locator) had to be typed to access the Web sites at that time. That’s no longer necessary today. The first generation sites were also limited by the technology available at the time. Security of data and privacy were serious issues that required yet unavailable technology to solve. To view examples of first generation Web sites, click the links for Dejavu at http://www.dejavu.org/1994win.htm and the Stanford Linear Accelerator Center at http://www.slac.stanford.edu/history/earlyweb/firstpages.shtml, where the Midas browser was created and the first Web site in North America was developed. The following list describes some characteristics of first generations Web sites: 1-3 Monitors were monochrome and small. Modems were used for Internet connectivity (dial-up). Internet connection speeds were slow. Browsers used proprietary extensions not endorsed by the W3C, resulting in pages not rendering properly in all browsers. INTRODUCTION TO WEB DESIGN USING MICROSOFT EXPRESSION STUDIO Guest books were popular. Form information was sent via e-mail. A look at one of Microsoft’s original Web sites. Second Generation Web Design: "Advertise that you sell online, and they will come" This Web design strategy focused on content. At times, the message competed with the technology. Because of the Web’s interactivity, 24-hour access, global reach, ability to present product information for ordering, and the sizable revenue generated from online sales, an online presence was essential for businesses large and small. Web sites would frequently include the following elements: 1-4 Intuitive, user-friendly navigation systems Use of forms Focus on content INTRODUCTION TO WEB DESIGN USING MICROSOFT EXPRESSION STUDIO Tables Frames Buttons Colors Banners Blinking text Hit counters “This site is best viewed in” message Marquees Guest books The features available in the popular browsers—Netscape Navigator and Internet Explorer—helped drive the technology used on Web sites. A common problem at the time was the lack of standardization (establishing uniformity of protocols and processes). Sites viewed by different browsers did not always render properly because the two giants— Netscape and Internet Explorer— offered different features or extensions in their browsers. Example of the second generation of Microsoft’s Web site. Third Generation Web Design: "Design with the customer in mind" A third generation site attempted to address its audience based on the Web site’s objective, which would drive its design and structure. Flash (delivering dynamic content) was frequently used in these sites to provide users with an exciting, interactive, online experience. Portals were another staple found on third generation sites. Portals, which are still plentiful, provide a gateway or access point to locate information, products, and services on various Web sites. There are two types of portals. A horizontal portal addresses the needs of a broader audience and offers a diverse range of services, products, and information. Yahoo! and MSN are examples of horizontal portals. The vertical portal, however, targets a specific audience and offers selected 1-5 INTRODUCTION TO WEB DESIGN USING MICROSOFT EXPRESSION STUDIO information, products, and/or services to its users. WikiEducator.org, catering to educators, is an example of a vertical portal. Again, an intuitive, user-friendly navigation system was an essential element. The design of these sites could include the following elements: Target specific audience Focus on content rather than technology Intuitive, user-friendly navigation system Use of columns Forms Splash page when the site opens CSS (cascading style sheets) Portals Third generation example of Microsoft’s site. Fourth Generation Web Design: "Web 2.0: Wikis, blogs, podcasts, and more" This generation of design is truly participatory and interactive. These sites customize or personalize the user’s online experience. Web designers, when working with common graphic design elements, consider usability and accessibility issues. Well-designed sites focus on the visual organization of content, use of an intuitive navigation system on every page, careful selection of typography (font style, color, size, and spacing), standards compliance, and a uniform and consistent design for a more polished, professional look. Site designers take full advantage of the new tools of Web 2.0. Web sites are no longer static, unchanging resources. Visitors now have the ability to create and modify content viewed on the 1-6 INTRODUCTION TO WEB DESIGN USING MICROSOFT EXPRESSION STUDIO Web. Let’s discuss some of these cool new features. Web sites offering WYSIWYG (What You See Is What You Get) wikis and blogs provide users with the tools for content authoring. A wiki, according to Wikipedia, is a collection of Web pages designed to enable anyone who accesses them to contribute or modify content. Wiki, developed in the early 1990s by Ward Cunningham, is Hawaiian for “fast” but some suggest it’s also an acronym for What I Know Is (Wikipedia, 2008). Blogs (or weblogs) are online commentaries, conversations, and journals. The ability to add comments to blogs can be extremely useful. To make that online commentary even more exciting, podcasts are also available from some sites. The term is derived from iPod and broadcast. Files (audio, music, and video) can be downloaded from Web sites and played on your computer or any other handheld electronic devices capable of handling MP3 files. RSS (Really Simply Syndication or Rich Site Summary) is used to deliver podcasts to subscribers. Webcasts (similar to the traditional television broadcast) delivering audio and video content are also available on many sites. The freemium business model is frequently used by Web 2.0 companies. Basic services are given free to online users. The premium services, however, are fee-based. Companies get free advertising, build a critical mass of users, and develop a potential revenue source. Social networking builds online communities of people. Two of the most popular social networking sites are Facebook and MySpace. A social site using virtual reality (VR) and avatars is There.com. This online 3D community is designed for teens. Basic membership, core services, and products are free; however, fees are charged for premium services. Is this an example of the freemium business model? To view a very short video clip entitled “Social Networking in Plain English,” click http://www.youtube.com/watch?v=6a_KF7TYKVc. Netsmartz’s “Social Networking” video, geared to teens, is available at http://www.nsteens.org/videos/social-networking. Mashups are created when you combine data (content, technologies, objects, or services) from other sources and create a new application. Microsoft’s Popfly (beta) allows you to easily create mashups. Using http://www.popfly.com, test your skills and have a little fun. Try to create a mashup (make your own application by combining elements from other applications or sources), create a game, or create a Web page. Elements frequently found on Web 2.0 sites include the following: 1-7 Dynamically generated content by the user Social networking features Compliance with Web standards Rounded corners Subtle 3D effects Larger text Video sharing Content authoring tools for editing, commenting, and reviewing Internet privacy allowing users to manage their privacy by deleting their user content and profiles Web services Wikis Blogs Podcasts Webcasts INTRODUCTION TO WEB DESIGN USING MICROSOFT EXPRESSION STUDIO RSS feeds Cascading style sheets Freemium business model Open source File sharing Recent view of the Microsoft Web site. AJAX (Asynchronous JavaScript and XML) enhances Web design because it permits information to be processed without reloading the page. Content is updated immediately when a user performs an action. A form’s AutoComplete feature is performed using AJAX. Microsoft uses AJAX for Microsoft Live Maps, allowing you to manipulate maps and zoom into almost any level. Spelljax.com, a free spelling checker, is also an AJAX-based application. The Mobile Web provides wireless access to handheld computers, phones, or any portable electronic device capable of retrieving data. One challenge faced by Mobile Web users is the small size of the screen, creating usability issues. Another challenge is interoperability resulting from incompatible mobile devices. Site designers are considering these issues because of the increasing number of portable devices connecting to the Internet. Standardization, the missing component, is being addressed by the W3C. The W3C developed the following Mobile Web Best Practices, which support the design and delivery of content to mobile devices. According to the W3C, the 10 ways to mobilize are: 1-8 Design for one Web viewed by many devices. Rely on Web standards. INTRODUCTION TO WEB DESIGN USING MICROSOFT EXPRESSION STUDIO Stay away from known hazards: • Good design decreases usability issues (small screens and keyboards). • Eliminate pop-up windows. • Do not use frames or tables. Be cautious of mobile device limitations. Optimize navigation. Check graphics and colors. Keep it small. Use the network sparingly. Help and guide user input. Think of users on the go. Microsoft also offers Live Search for Mobile and Windows Live for Windows Mobile that include e-mail, instant messaging and search, and advanced local search and mapping capabilities. Global Positioning Service (GPS) is offered to mobile users to provide directions and mapping services. Traffic data is available for a number of metropolitan cities. To access these services, use the URL http://mobile.search.live.com. Two screens of an application shown on a mobile device. Internet Structure: Technology, Coordination, and Organizations Internet Visionaries and Pioneers Early pioneers dreamed and wrote about their vision of the connectedness of our world. In 1962, Joseph Licklider, director of the Defense Advanced Research Projects Agency (DARPA) Computer Research Program, discussed his Galactic Network ideas. According to the Internet Society (ISOC), Licklider’s Galactic Network was a globally interconnected set of computers through which everyone could quickly access data and programs from any site. Those ideas, almost 50 years old, describe the Internet as we know it today! 1-9 INTRODUCTION TO WEB DESIGN USING MICROSOFT EXPRESSION STUDIO In 1965, Larry Roberts, a researcher at MIT (Massachusetts Institute of Technology) connected two computers using telephone lines—one in Massachusetts and the other in California. The two computers worked together, communicated together, and shared data. At UCLA (University of California, Los Angeles) in 1969, Leonard Kleinrock, by connecting a computer to an Interface Message Processor (the packet-switching node connecting computers to the ARPANET), became the first node on the ARPANET, making it the first computer on the Internet! Robert Kahn, in October 1972, presented the first public demonstration of ARPANET at the International Computer Communication Conference. Prior to this time, ARPANET was restricted to government use, academia, and research. Vinton Cerf, frequently referred to as the “Father of the Internet,” and Robert Kahn co-designed TCP/IP, the first networking communication protocols, in 1974. At that time, ARPANET consisted of only 40 computers connected to its network. Internet History and Structure: United States Government’s Role The Internet, which was created before the Web, is the world’s largest computer network. In 1958, the United States Department of Defense established ARPA (Advanced Research Projects Agency), the research and development organization for the Department of Defense. The name was later changed to DARPA (Defense Advanced Research Projects Agency). During the 1960s, an initiative was created by the Department of Defense to ensure that its communication system, consisting of computers and connected by a telephone network system, would remain intact if any component was damaged or destroyed during a natural disaster or attack. If the most direct route was not available because a part of the network was damaged, routers (which connect networks and determine where packets or data should be sent) would direct traffic around the network using alternate routes. 1-10 INTRODUCTION TO WEB DESIGN USING MICROSOFT EXPRESSION STUDIO The solution was to create a computer network without centralized control, which would remain operational and increase efficiency, productivity, and convenience. By the end of 1969, a fournode network consisting of four connection points (or workstations connected by phone lines) was created. UCLA was the first node to connect; SRI (Stanford Research Institute) was the second connected node; UCSB (University of California, Santa Barbara) connected as the third node; and the University of Utah was the fourth node to connect. The network crashed while the first message was being sent between UCLA and SRI. This small network was known as ARPANET, which was the precursor of today’s Internet. Early applications of this network were remote logins, file transfers, remote sharing of peripherals, and e-mail. In 1971, Ray Tomlinson, a computer engineer at BBN Corporation in Cambridge, Massachusetts, developed the first email program. His first message sent over the network was simply "qwertyuiop" (the sequence of letters on one row of a computer keyboard). ARPANET continued growing as more universities and organizations connected. By 1971, 15 nodes were connected. Most of the nodes were located at universities in the United States and NASA (National Aeronautics and Space Agency). By the 1970s, there was a growing need for independent computer networks to share information with each other; however, these networks could not connect because they used different communication protocols (sets of rules used by end points in a telecommunication connection). The need for standardization became a key issue. As a result, the United States Department of Defense lobbied for and achieved standardization of TCP/IP (Transmission Control Protocol/Internet Protocol), which allowed other networks to connect to ARPANET. In 1974, these interconnected networks became known as the Internet—a WAN (Wide Area Network). In its early years, the Internet was used by only the United States military and academia for research. It did not have the functionality of today’s Internet. As a result, it consisted primarily of text and menus. As more networks connected and the amount of information increased, there was a greater need to sort and index the data. One of the early search tools was Gopher, which was developed at the University of Minnesota in 1991 by Mark McCahill and named after the school’s mascot. This early tool allowed users to click hyperlinked menus to access information. Remember, in the early days of the Internet, pages simply consisted of text files with descriptions of files and file names. Veronica (Very Easy Rodent Oriented Net-wide Index to Computer Archives) was developed at the University of Nevada in 1992. Veronica, a more efficient and effective tool, searched all Gopher files. The following year, Jughead (Jonzy’s Universal Gopher Hierarchy Excavation and Display) was developed at the University of Utah by Rhett (Jonzy) Jones. This improved search tool was capable of performing keyword and Boolean searches. Archie is simply an abbreviation for Archives. Each of these tools was used to search a part of the Internet known as Gopherspace. Gopher sites are rarely accessed today. Today’s Internet consists of thousands of connected networks. In the United States, the Internet consists of regional networks, funded by the National Science Foundation (NSF) and serving various regions of the country. The National Science Foundation played a huge role during the 1980s in the development of the Internet by funding the NSFNET and allowing commercialization of the networks. ARPANET was restricted to government, academic, and research use only. The regional network at the University of California at San Diego handles international and western traffic in the United States. This regional network is appropriately called CERFnet; it pays homage to Vinton Cerf, who is frequently referred to as the Father of the Internet. CERFnet is also an acronym for California Educational and Research Federation. These regional networks connect to the Internet’s backbone through Network Access Points (NAP) 1-11 INTRODUCTION TO WEB DESIGN USING MICROSOFT EXPRESSION STUDIO located near major cities. Some Regional NAPs are North West Net created in 1987, Southeastern Research Universities Association, New York State Education and Research Network, Great Plains Network, and the Northern Tier Network. In 1995, the NSF dissolved the NSFNET to allow commercialization of the Internet. Use the link http://www.nsf.gov/news/special_reports/nsf-net/ to view the video “NSF and the Birth of the Internet.” At the time of its dissolution, the NSFNET had connected more than 50,000 networks across the globe. Most residential users gain Internet connectivity through Internet Service Providers (ISP) or Internet Access Providers (IAP). Since 1989, The World has been providing dial-up access to the Internet. It advertises itself as the first commercial ISP on the planet at http://www.theworld.com. AT&T, Comcast, AOL, Verizon, and EarthLink are examples of Internet Service Providers. Connection is provided for a monthly fee that varies based on the ISP and the type of service offered. The Domain Name System (DNS) Every computer on the Internet has an IP (Internet Protocol) address, which is a string of numbers unique to a connected computer. It would be difficult remembering IP addresses for Web sites. The DNS has simplified this task for us by converting host or domain names into IP addresses. To access the Internet Corporation for Assigned Names and Numbers site, you could remember 192.0.34.65, its IP address. Would you agree it’s much easier to remember www.icann.org? The DNS has established classifications of top-level domain names. You’re probably familiar with most if not all of the following domains: .com .edu .gov .mil .net .org Commercial Educational institution Government Military Network Organization Here are several additional top-level domains: 1-12 .aero .asia .biz .cat .coop .info .int .jobs .mobi .museum .name .pro Air travel Asia and Pacific region Business Catalan language and culture Cooperatives Information International Companies Mobile compatible sites Museum Individuals Professions (physicians, lawyers, certified public accountants) INTRODUCTION TO WEB DESIGN USING MICROSOFT EXPRESSION STUDIO .tel .travel Online communications service Travel industry There are also country codes for top-level domains. Visit the IANA Web site (Internet Assigned Numbers Authority) to view a listing of other top-level domain names, including country codes. Organizations that Provide Structure, Guidance, and Policy Because the Internet does not belong to any one entity, a number of organizations were developed to ensure the free and open use of the Internet to benefit everyone worldwide. The Internet Society (ISOC), a nonprofit organization founded in 1992, has continued to provide leadership in Internet-related standards, education, and training. Network Solutions Inc. (NSI) has the responsibility for registering names for .com, .net, and .org. Assigning, managing, and coordinating IP addresses and domain names is the task of the Internet Corporation for Assigned Names and Numbers (ICANN). The Internet Architecture Board (IAB), as its name implies, addresses the architecture for Internet protocols and standards. Finally, the Internet Engineering Task Force (IETF) focuses on the evaluation and operation of the Internet. Intellectual Property and Copyright Intellectual property is the product of one’s intellect – something that a person produces with his or her brain and creative skills. Intellectual property is protected by laws in most countries and can include artistic works—music, film, plays, poems, novels, paintings, photographs, and other creations. With the Web’s popularity, immediate access to information, plus the ease of copying and pasting, users must be very careful not to violate the intellectual property rights of others. Check the fine print on Web sites to discover if the materials you’d like to use are free to use or restricted. Infringing copyrighted or other protected intellectual property is a violation of federal law! Material such as text, music, and video that is labeled as public domain can be used without requesting permission. Some materials can be used with permission from the author, and yet other items can be used if credit is given to the author. It is impossible to know the permissions you might have without checking the fine print! An example of a “Terms of Use” section of the Microsoft Web site. Developing Effective Web Use Skills The Web is an amazing resource with a wealth of information. Efficiently and effectively accessing information on the Web is a skill worth developing. Let’s take a look at several effective search strategies. Familiarize yourself with several search engines or subject directories. It’s important to know how your favorite search tools work. Read the Help section offered by a search engine or subject directory to learn how it works, how to improve your searches, and how to interpret the relevancy ranking. Search engines use software referred to as spiders or robots to index huge areas of the Internet. Subject directories are indexed by people, 1-13 INTRODUCTION TO WEB DESIGN USING MICROSOFT EXPRESSION STUDIO cover a smaller area, and may not be as current. An example of a search engine is Microsoft’s Live Search and Google; Yahoo is a popular hybrid using both a subject directory and a search engine. Using Boolean and proximity operators in your query can help narrow or broaden your search. Operators include AND, +, OR, NOT, and NEAR. AND (+) is an inclusive operator. This means that both terms must be found in order for the document to be identified. OR is an exclusive operator. This means that either/or of the terms listed can be found in order for the document to be identified. NOT is another exclusive operator. The word after NOT (-) is excluded from the sites identified and listed. NEAR is a proximity operator. A proximity operator determines the closeness of terms within the text of an identified document. NEAR is a restrictive AND. The proximity within potential documents is determined by the particular search engine. Here is an example of a search for information about all browsers except Netscape: your query could be “browsers NOT Netscape” or “browsers – Netscape.” Select very specific keywords and phrases that describe what you’re seeking. You can also use wild-card characters to narrow or broaden your search. These characters include * (representing one or more characters) and ? (representing one character) in a query. Imagine you are searching for any topic related to Boolean. Your query could be “Boolean *.” Your hits or results, ranked by relevancy, could include Boolean operators, Boolean definition, Boolean logic, Boolean data type, etc. You can also use the parentheses or quotation marks to search for a specific phrase. Here are some examples: "Boolean operators" (Boolean logic) Natural language queries are quite easy. Simply type your query as a question—no keywords or phrases are necessary. Examples of natural language search engines are Ask.com (formerly AskJeeves.com), Ixquick.com, and Answers.com. Other search engines include Blinkx.com, which advertises itself as the world’s largest and most advanced video search engine with over 26 million hours of video. It is the remote control of the Video Web, allowing users to locate episodes of television shows. The co-founder and chief technology officer, Suranga Chandratillake, states, “There’s been a massive increase in TV content online, and users have caught up with that reality.” Meta search engines search a number of search engines and directories simultaneously. URL.com searches Google, Yahoo, and MSN and provides a ranking in the left margin and also allows users to vote. Dogpile.com and Ixquick.com search multiple engines but return only the top 10 of any search results. Clusty.com organizes results in concept clusters. Mamma.com and Metacrawler.com are other meta-search engines you may be familiar with. Do a search for “meta search engine.” Using the same query, do searches on each of the meta search engines to compare results. To access a tutorial, visit http://www.internettutorials.net/second.html. Microsoft’s SearchTogether is a free Internet Explorer plug-in that allows teams to collaborate on searches from different locations. This tool allows users to share results with others. 1-14 INTRODUCTION TO WEB DESIGN USING MICROSOFT EXPRESSION STUDIO Evaluating Web Sites Not everything available online is completely accurate. Anyone can create and publish a Web site without oversight or without proving the contents are factual. Because of the lack of editorial controls and auditing, the responsibility for verifying the accuracy of the information found falls on the user. It is important to evaluate online resources before using them. There are several important criteria to use when determining the validity of a site. Accuracy Are sources cited? Is the author knowledgeable and trained? Are links available providing supplementary information to support the content on the site? When writing citations for works that you have referenced, you may use http://CitationMachine.net, an online interactive resource that helps you create citations in various formats. Authority Is the author’s contact information available—name, mailing address, and/or email address? Is information about the author’s affiliation available? Coverage Is content in-depth and relevant? Currency How frequently is the site updated? Are any links broken? Is the information outdated? Objectivity What is the site’s purpose? Are biased views presented? Reputation Check the URL to determine the type of the site. Generally, .gov, .org, and .edu sites provide fairly objective information because they are not marketing a product or service. Determine whether it is a personal site. A clue that a site might be a personal site is the tilde (~), %, or the word member or user in the URL. Remember, there is no editorial board for auditing Web content. Check for links to essential information about the organization—About Us, Mission, or Purpose. Look to see what organizations are linking to the Web site. To locate information about the site, you can use http://www.alexa.com. Let’s access Alexa.com. Once on Alexa’s home page, click the Traffic Rankings tab at the top. Now, use MSN.com as your query to get traffic details. The following types of information will appear: MSN’s global reach Traffic rankings (page views and users) Page views per user Where users go once they’re on the site (pages accessed) Additional questions to ask when evaluating a Web site include: Does the site have a professional look and feel? Is it user friendly and intuitive? Do you notice errors in spelling, grammar, and/or punctuation? 1-15 INTRODUCTION TO WEB DESIGN USING MICROSOFT EXPRESSION STUDIO Internet Safety You protect what you own in the “real” world. When leaving your home, you lock the door. You keep your mobile phone and wallet in a secure location. It’s imperative that you also take precautions in the “virtual” world when working online. You wouldn’t consider driving a car on a highway without instruction, supervision, and guidance. Why try to navigate the “information superhighway” without using those same measures? The Internet provides a wealth of information, resources, and tools. It can also be a dangerous forum. You must be aware of the risks involved when working online. Some of those risks include: Cyber bullying Online predators Identity theft Jeopardizing your college admission or employment prospects Techniques Commonly Used by Perpetrators Phishing (sending fraudulent e-mail from an alleged creditor requesting personal and financial information). Phishing is often recognizable by its errors, such as misspelled words or poor grammar. Searching online profiles for personal information Sending inappropriate e-mail or instant messages A phishing notification. 1-16 INTRODUCTION TO WEB DESIGN USING MICROSOFT EXPRESSION STUDIO How You Can Put Yourself at Risk Disclosing personal information (last name, age, telephone number, address, or social security number) Disclosing financial information (credit card or banks account numbers) Responding to inappropriate messages Agreeing to secret meetings (online or in person) Providing too much information in your online profile Instant messaging (once sent you can’t retract the instant message) Posting inappropriate videos and materials (presenting an image you might later regret) When threatened, solicited, or not feeling comfortable with a message received or sent, it is imperative that you speak with a responsible adult. It may be a parent or guardian, a school counselor or instructor, or maybe a mentor. Don’t be afraid to reach out to those who can help you. Inappropriate activities and messages can also be reported to the Cyber Tip Line at 1-800843-5678, or at http://www.cybertipline.com. The COPPA (Children’s Online Privacy and Protection Act) mandates that owners of commercial Web sites must get parental permission before collecting personal information from children under the age of 13. Parents also have the right to review and revoke any information collected from their children. The Netsmartz Cyberbullying video (http://www.nsteens.org/videos/cyberbullying) is an excellent reference that provides information about cyber bullying. The Netsmartz.org site is a great resource for additional information about Internet safety, providing interactive activities, scenarios, safety tips, and videos for students, parents, educators, and law enforcement personnel. Laws in the United States In the United States, the Copyright Act protects authors of original works by giving them exclusive rights to their work. The original author may, however, authorize others to use their work in a limited capacity. The Copyright Act includes all original work, even electronic and digital media. The original author’s work is protected during his or her lifetime plus 70 years. A good rule to remember is that copyright laws always apply to a work unless explicitly waived or used according to the published terms such as with Creative Commons License. The best advice is to always to request permission to use another author's material. There are, however, exceptions for educational use. 1-17 Fair Use Doctrine Copyrighted material may be used, in specific situations, for education and research without permission. According to the Copyright Office, the original work cannot be used for commercial gain, copying workbooks or textbooks is prohibited when the materials can be purchased, and it is permissible to use limited portions of original work, including quotes. Face-to-Face Teaching The Copyright Act does permit the performance or display of copyrighted works during face-to-face teaching. INTRODUCTION TO WEB DESIGN USING MICROSOFT EXPRESSION STUDIO Distance Learning Distance learning environments extend the face-to-face teaching exemption to distance learning. Only those students in the distance learning class have access to the content during the class period, and the work must be related to the course content. Derivative works are derived from original works. According to the United States Copyright Office, only the owner of the copyrighted work can authorize a new version of the original work. The derived work must be substantially different from the original work(s). Minor changes or adjustments will not qualify it as derivative work. A derivative work received for registration in the Copyright Office is one that is primarily a new work but incorporates some previously published material. The DMCA (Digital Millennium Copyright Act) was signed into law in 1998 by President Clinton. This Act aligned copyright law with the widespread use of electronic and digital media. According to the Copyright Office, the act criminalizes circumventing anti-piracy measures installed in most software, and requires service providers to remove content from users’ Web sites that may have copyrighted material. Public domain works are free for the public to use without permission. Material that is in the public domain is not copyrighted. Copyright laws vary from one country to another; it is wise to research a country's intellectual property laws before using another person's work. Creative Commons This non-profit organization was founded in 2001 at Harvard Law School. Creative Commons (CC) is now headquartered in San Francisco, California. According to its Web site, its goal is the expansion of reasonable, flexible copyright for others to build upon legally and to share. The copyright licenses provided by CC are less restrictive than those issued by the Copyright Office. On the CC site, you can search for CC-licensed work, and you can license your own work. As stated on its Web site, “Creative Commons provides free tools that let authors, scientists, artists, and educators easily mark their creative work with the freedoms they want it to carry” (http://creativecommons.org/). You can share, remix, and reuse—legally. Open Source Open source is a software development method in which intellectual property may be publicly shared, permitting anyone to freely use and distribute the software as well as modify the source code. The Open Source Initiative is a nonprofit organization promoting the use of open source development of software and making it free to the public. The source code must also be made available, to improve the quality and reliability of the software. According to the OSI Web site, “One of our most important activities is as a standards body, maintaining the Open Source Definition for the good of the community” (http://www.opensource.org/). Open Source Alternative (http://www.osalt.com) provides access to alternatives to well-known commercial software. Various titles can be found to meet specific needs. 1-18 INTRODUCTION TO WEB DESIGN USING MICROSOFT EXPRESSION STUDIO Developing Technologies E-Commerce Electronic commerce, or e-commerce, involves business transactions that occur electronically and online. The Web as a venue for e-commerce offers unlimited potential for businesses of all sizes. E-tailers, or online retailers, are open 24/7, have a global reach, and can provide customized, streamlined services to customers. Some of the top e-tailers are Amazon, eBay, HSN (Home Shopping Network), and QVC (Quality, Value, and Convenience). PayPal, another e-tailer, provides electronic payment and transfer of funds for business transactions. Fees charged are based on several factors, including the amount of the transaction, payment option, and currency used. What other companies do you think belong on the list of top e-businesses? Visit http://www.internetretailer.com/ to determine if the companies on your list are included in the top e-tailer rankings. What factors do you feel influenced the selection of e-tailers included on the list? Two e-tailers setting high e-commerce standards and creating successful e-business models are Amazon and eBay. Jeff Bezos, Amazon’s founder, started the company in his garage in 1995. It took years for his company to make a profit. The same year, Pierre Omidyar created a Web site called AuctionWeb. He auctioned and sold a laser pointer that did not work. He contacted the winning bidder to make certain he knew the laser pointer was broken. The bidder was a collector of broken laser pointers. It was just what he wanted! AuctionWeb is now known as eBay. Search Engine Optimization (SEO) is critical for all sites—especially e-commerce sites. SEO helps businesses increase site traffic, improve the quality of the traffic, test and optimize content and design, increase the time spent on the site, enhance visitor satisfaction, and improve the site’s visibility—all of which should help to increase revenue. Pay Per Click (PPC) is another tool used to increase visibility and sales. With PPC, a business pays a predetermined fee to the site on which an advertisement appears every time a user clicks through to their site. Services Web services are built on technologies and standards that allow the exchange of information with other software applications using Internet protocols. Web services operate over any network. Microsoft first used the term when it introduced Web services as a component of its .NET technology. With the increasing implementation of Web services, standards are quickly developing. XML (Extensible Markup Language) tags the data. SOAP (Simple Object Access Protocol) allows programs on different computers to communicate across a network. WSDL (Web Services Description Language) describes and locates the Web services that are available. UDDI (Universal Description, Discovery and Integration) are listings or directories where businesses can advertise their Web services and their business. Several new services and applications are available to online users. Microsoft’s Windows Live™ (http://get.live.com) and Microsoft Office Live (http://www.officelive.com) are designed to 1-19 INTRODUCTION TO WEB DESIGN USING MICROSOFT EXPRESSION STUDIO provide online services and applications to individuals and small businesses. Several other Web services and applications are listed in the following chart: Windows Live Calendar Allows users to plan activities and invite others. (Beta) Windows Live QnA A forum in which community members answer questions posed by other community members. Content is governed by a Code of Conduct and monitored by the community. Windows Live Mobile A version of Windows Live for mobile, handheld electronic devices. Microsoft Office Live Small Business Provides a host of online tools and resources for small businesses to help establish an online presence and manage their business. Windows Live Connect Provides Hotmail (free e-mail accounts) and Messenger to help users remain connected. Windows Live Share Allows users to share resources using several innovative tools. Windows Live Sky Drive Provides password-protected file storage. Windows Live Photo Gallery Allows users to manage and share photos and videos. Windows Live Writer Assists users in adding pictures and videos to their blogs. Windows Live Events Allows users to plan events and invite others. Windows Live OneCare Family Safety Protects children online by filtering Web sites, managing their online interactions, and managing and tracking their online activities. SpellJax, the online spelling checker that was described earlier in this module, is another example of a Web service. Chapter Summary In a relatively short period of time, our world has changed dramatically because of the creation in 1969 of a small computer network known as ARPANET. That early network, developed by the United States Department of Defense, consisted of four nodes connected by phone lines at UCLA, UCSB, Stanford Research Institute, and the University of Utah. It was Joseph Licklider who envisioned the Galactic Network in 1962. His vision of the Galactic Network described today’s Internet. Early applications of ARPANET were remote logins, shared peripherals, and file transfers. In 1971, the first e-mail program was developed by Ray Tomlinson, a computer engineer, and it transferred messages across ARPANET. During this same time period, 15 nodes were connected to ARPANET. Most of the computers were located at universities across the United States. In the early years of ARPANET, only the United States military and academia used the network. One of the first standards was TCP/IP. These standards allowed other networks to connect. In 1974, these interconnected networks became known as the Internet. Most users today connect to the Internet using ISPs or IAPs. Connection is provided for a monthly fee that varies based on the ISP and the type of service offered. Every computer on the Internet has an IP address. Just as a mailing address uniquely defines a location on a map, an IP address uniquely identifies a device that is connected to the Internet. The Domain Name System converts those unique numbers that computers understand into host or domain names that people can understand. A number of organizations provide policy, education and training, and structure to the Internet, since no one entity owns it. Some of those organizations include the Internet Society, the Internet Corporation for Assigned Names and Numbers, and the Internet Architecture Board. 1-20 INTRODUCTION TO WEB DESIGN USING MICROSOFT EXPRESSION STUDIO The World Wide Web, developed by Tim Berners-Lee in 1989, revolutionized our entire culture and popularized the Internet. With the introduction of the Web, browsers were needed to view content on the Internet and the Web. Mosaic, one of the early browsers, was developed at the National Center for Supercomputer Applications at the University of Illinois, Urbana-Champaign by two students, Marc Andreessen and Eric Bina. After graduation, Andreessen and James Clark co-founded Netscape Communication Corporation to market their browser in 1994. Netscape quickly became the world’s most popular browser. Microsoft entered the field with Internet Explorer and eventually dominated the market once owned by Netscape. Internet Explorer is still the world’s most popular browser, with Netscape no longer being supported. Other browsers include Firefox, Flock, Opera, and Safari. Today’s browsers comply with the W3C’s standards. Web sites have evolved over time. First generation sites were static—no interactivity. They included basic structures. Second generation sites included intuitive, user-friendly navigation systems, focused on the content, and animation—blinking text, moving banners, animated images, etc. Since businesses were now online, there was much more interaction than with first generation sites. Third generation sites addressed their audiences based on their objectives, which drove the design and structure. Splash pages were popular, as was the use of cascading style sheets, portals, and forms. These sites focused on content and were easily navigated. Fourth generation sites are participatory and highly interactive. They provide richer experiences for their users. Site designers take full advantage of the new tools of Web 2.0. They frequently include wikis, blogs, podcasts, webcasts, and Web services. Standards are being developed for mobile users of the Web to make their online experience productive and efficient. Effective and efficient searches are important when accessing online information. Boolean operators, wild-card characters, and descriptive key words and phrases can be used to narrow or broaden a search. Use strategies to ensure the validity of your information, because not all online information is true. Five criteria you can apply are: accuracy, authority, coverage, currency, and objectivity. The URL can also offer hints about the source of the information and its potential for accuracy. Don’t be tempted by copying and pasting online material, because it is intellectual property. The Copyright Act protects the author of the work, so you must first get permission to use any material that was created by another person. You may not present copied music, video, pictures, or other content as your own work. If the material is in the public domain, no permission is needed to copy it, but you must still give credit to the original authors. Creative Commons’ copyright licenses are less restrictive than those issued by the United States Copyright Office. On the Creative Commons site, you can search for CC-licensed work as well as licensing your own work. Open source software is publicly shared intellectual property. Anyone may use it, modify it, and redistribute it freely. Osalt.com is a great site for accessing Open Source Alternatives for popular programs. E-commerce has exploded because of the popularity of the World Wide Web and the new technologies that have been developed. It offers unlimited potential for businesses of all sizes. The term "Web services" was first used by Microsoft. Web services are built on standards and technologies that allow the exchange of information with other applications. Several new services are available for online users. Microsoft’s Windows Live and Office Live services are 1-21 INTRODUCTION TO WEB DESIGN USING MICROSOFT EXPRESSION STUDIO designed to provide online experiences for individuals and small businesses, including document sharing and live meetings over great distances. Review Questions 1. Research MozBraille. Why is there a need for this application and others like it? 2. Using the site http://www.wikimediafoundation.org/wiki/Home, answer the following questions: a. What is the purpose of the Wikimedia Foundation? b. List and describe three of its projects. 3. What Internet visionary described today’s Internet almost 50 years ago? 4. You've found an online photograph and a video taken at the 2008 Beijing Olympics, and you want to use them in a presentation you’re creating. Is it permissible to incorporate them into your work? Explain your answer. 5. Is open source software protected by copyright law? Explain your answer. Essential Vocabulary AJAX – Asynchronous JavaScript and XML, which permits Web information to be processed without reloading a page. Backbone – A series of interconnected networks that form the skeleton for the Internet. (Local and regional networks connect to the Internet via the backbone.) Blog – (Weblog), an online journal. Boolean Operators – AND, OR, and NOT, which can be used to refine a query for a search engine. Browser – Software to decode, display, and allow users to interact with Web pages (for example, Internet Explorer, Netscape, Opera, and Firefox). Collaboration – The process by which groups or teams work cohesively to produce a desired result. Copyright – Legal protection for original work. Creative Commons – An organization that provides flexible copyright licenses, which allows authors to define their own copyright terms. Derivative Work – A piece of work based upon the original work of others. Directory – A categorized list of Web sites, managed by people instead of software. Yahoo is a popular directory using human editors to review and categorize sites. 1-22 INTRODUCTION TO WEB DESIGN USING MICROSOFT EXPRESSION STUDIO DMCA – Digital Millennium Copyright Act, which was signed into law by President Clinton in 1998 to address digital media. DNS – Domain Naming System, which uses domain name servers to translate domain names to IP addresses. E-Commerce – Electronic business. Fair Use Doctrine – A doctrine that provides for limited use of copyrighted work without requiring permission from the copyright holder. Folksonomy – A collection of user-generated annotations and categorizations of content, usually on the Web. HTML – stands for Hypertext Markup Language. It is the publishing language of the World Wide Web. IAB – Internet Architecture Board, which addresses architecture for protocols and standards. ICANN – Internet Corporation for Assigned Names and Numbers, which controls the assignment of domain names and IP addresses. IETF – Internet Engineering Task Force, which focuses on the Net’s evolution and operation. Infringement – Unauthorized use of copyrighted material. Intelligent Agent – Software that automatically searches the Internet for information. ISOC – Internet Society, which addresses standards, education and training, and policy. ISP – Internet Service Provider (for example, AOL, Comcast, MSN, Verizon, and Net Zero). JavaScript – A scripting language that adds interactivity to Web sites. Local Area Network (LAN) – A network of systems covering a small area such as a classroom Meta Search Engine – Searches multiple search engines and returns results. Mobile Web – Access to wireless data services using a mobile device such as a PDA (Personal Digital Assistant) or mobile phone. Natural Language Query – A query that is presented as a question; no keywords, Boolean operators, or wild-card characters are needed. Network – A group of connected computers sharing resources. Node – Connection point or workstation on a network. NSI – Network Solutions Inc. registers .com, .net, and .org domains. Open Source – Publicly shared software (including source code) that users may modify and freely use and distribute. Pay Per Click (PPC) – Online advertising for which payment is based on user "click–throughs" to the sponsor's site. 1-23 INTRODUCTION TO WEB DESIGN USING MICROSOFT EXPRESSION STUDIO Podcasts – Derived from iPod and Broadcast, an audio broadcast converted to an MP3 file or other audio file format for playback on a computer or handheld electronic device. Protocol – Set of rules used by end points in a telecommunication connection. Public Domain – Material that is not copyrighted and is available for use without permission and free of charge. Robots – Software programs ("spiders" and "crawlers" are frequently used terms) that search, analyze, collect, and index data for fast retrieval. RSS (Really Simple Syndication) – Web feed formats used to publish frequently updated content such as blogs and podcasts. SEO – Search Engine Optimization, a process that helps increase site traffic. Service Oriented Architecture (SOA) – A collection of Web services. Simple Object Access Protocol (SOAP) – Allows programs on different computers to communicate across a network. Social Networking – Building communities through the use of online tools. Standardization – Establishing uniformity of protocols and processes. For Instructors Topics 1. The Evolution of Web Design and History a. How people viewed the Web and how they built Web sites with that view 2. Internet Structure a. Technology/coordination b. Organizations 3. Intellectual Property and Copyright a. Developing effective Web use skills b. Evaluating information and sources c. Copyright 4. Emerging Technologies a. E-commerce b. New technologies c. New services 1-24 INTRODUCTION TO WEB DESIGN USING MICROSOFT EXPRESSION STUDIO Learning Objectives 1. Explore history and impact of Web technologies 2. Locate Web-based resources and reference materials 3. Learn research techniques to evaluate the authenticity of Web resources (Internet safety) 4. Demonstrate ethical behavior in using and producing Web resources 5. Evaluate existing Web sites based on their design, accessibility, and usability 6. Explore business applications of Web technology 7. Investigate entrepreneurial (e-commerce) opportunities using Web technologies 8. Explore Web 2.0 functionality 9. Investigate new Web technologies 10. Explore personal and professional communication/collaboration through Web technologies NETS-S 1. Creativity and Innovation Students demonstrate creative thinking, construct knowledge, and develop innovative products and processes using technology. c. use models and simulations to explore complex systems and issues. d. identify trends and forecast possibilities. . 3. Research and Information Fluency Students apply digital tools to gather, evaluate, and use information. Students: 1-25 a. plan strategies to guide inquiry. b. locate, organize, analyze, evaluate, synthesize, and ethically use information from a variety of sources and media. c. evaluate and select information sources and digital tools based on the appropriateness to specific tasks. INTRODUCTION TO WEB DESIGN USING MICROSOFT EXPRESSION STUDIO 5. Digital Citizenship Students understand human, cultural, and societal issues related to technology and practice legal and ethical behavior. Students: a. advocate and practice safe, legal, and responsible use of information and technology. b. exhibit a positive attitude toward using technology that supports collaboration, learning, and productivity. c. demonstrate personal responsibility for lifelong learning. 6. Technology Operations and Concepts Students understand human, cultural, and societal issues related to technology and practice legal and ethical behavior. Students: a. advocate and practice safe, legal, and responsible use of information and technology. b. exhibit a positive attitude toward using technology that supports collaboration, learning, and productivity. c. demonstrate personal responsibility for lifelong learning. 21st Century Skills Information, Media, and Technology Skills INFORMATION LITERACY 1-26 Possessing a fundamental understanding of the ethical/legal issues surrounding the access and use of information Accessing information efficiently and effectively, evaluating information critically and competently, and using information accurately and creatively for the issue or problem at hand. INTRODUCTION TO WEB DESIGN USING MICROSOFT EXPRESSION STUDIO Review Questions with Answers 1. Research MozBraille. Why is there a need for this application and others like it? ANSWER: MozBraille is a browser for visually impaired users that offers output to a Braille terminal, textto-speech output, and larger characters to view. Online resources should be accessible by all users on all devices. 2. Using the site http://www.wikimediafoundation.org/wiki/Home, answer the following questions: a. What is the purpose of the Wikimedia Foundation? b. List and describe three of its projects. ANSWER: The Wikimedia Foundation is an international nonprofit organization that is committed to providing free content. Its projects are Wikipedia (encyclopedia), Wikibooks (textbooks and manuals), Wikiversity (free learning tools), Wiktionary (dictionary and thesaurus), Wikinews (news), Wikiquote (quotations), Wikimedia Commons (shared media repository), Wikisource (source documents), and Wikispecies (directory of species). 3. What Internet visionary described today’s Internet almost 50 years ago? ANSWER: Joseph Licklider’s Galactic Network concept was a description of today’s Internet. 4. You've found an online photograph and a video taken at the 2008 Beijing Olympics, and you want to use them in a presentation you’re creating. Is it permissible to incorporate them into your work? Explain your answer. ANSWER: No; you may not simply incorporate them into your work. The photograph and video are considered intellectual property and are protected by federal law. Using them without the permission of the author would be a violation of the United States Copyright Act. The original authors' works are protected during their lifetime plus 70 years. 5. Is open source software protected by copyright law? Explain your answer. ANSWER: No. Open source software is publicly shared intellectual property that is completely free to anyone who wants it. Its source code can be modified and redistributed. 1-27