1 The Environment and the Tools Web Design, 3rd Edition Chapter Objectives Describe the Internet and the World Wide Web Discuss ways to access the Internet and the Web Categorize types of Web sites Identify Web design tools Explain Web design roles Chapter 1: The Environment and the Tools 2 The Internet and the World Wide Web The Internet is a worldwide public network that connects millions of private networks A network is composed of several computers, printers, and data file storage devices connected together to share computing resources and data Internet 2 is a major cooperative initiative among academia, industry, and the government to increase the Internet’s possibilities and correct some of its challenges Chapter 1: The Environment and the Tools 3 The Internet and the World Wide Web Chapter 1: The Environment and the Tools 4 The Internet and the World Wide Web The World Wide Web (WWW or Web) consists of Internet-connected computers called Web servers on which Web pages are stored A Web site is a group of related Web pages – Starts with a home page – Pages are linked together with a hyperlink, or link Surfing the Web Chapter 1: The Environment and the Tools 5 Influence on Society Communication Education Entertainment and News Business Chapter 1: The Environment and the Tools 6 Communication Bookmarking / favorites Electronic mail (e-mail) Internet Relay Chat (IRC) Web-based chat IM chat Collaborative workspaces Virtual meeting spaces Weblog (blog) – Video sharing (video blogging) Chapter 1: The Environment and the Tools 7 Communication Social networking Social bookmarking Massively multiplayer online games (MMOGs) 3D virtual worlds Chapter 1: The Environment and the Tools 8 Education Formal and informal teaching and learning Enhances traditional teaching methods – Instructors often publish syllabi, grades, Web page links for research, and more for their students Chapter 1: The Environment and the Tools 9 Entertainment Popular entertainment sites include music, videos, sports, games, and more News Web sites allow you to read news stories, and some even allow you to watch video clips – Some provide interactive elements Chapter 1: The Environment and the Tools 10 Business Electronic commerce (ecommerce) is the practice of conducting business transactions online, such as shopping – Business-to-consumer (B2C) – Business-to-business (B2B) – Consumer-to-consumer (C2C) Chapter 1: The Environment and the Tools 11 DSL Digital Subscriber Line – Transmits at fast speeds on existing standard copper telephone wiring – Some installations can provide a dial tone Asymmetric Digital Subscriber Line (ADSL) – Faster to receive data than to send data – Ideal for Internet users Chapter 1: The Environment and the Tools 12 Cable Television Lines Allows users to connect to the Internet through their cable line Rapid transfer rates using a cable modem connected to a CATV line Chapter 1: The Environment and the Tools 13 Fixed and Mobile Wireless Access Internet connectivity for users who do not have access to services such as DSL or cable Satellite technology used instead of telephone lines Radio signals provide high-speed connection – Wireless fidelity (Wi-Fi) Chapter 1: The Environment and the Tools 14 Internet Service Providers Internet Service Provider (ISP) – Has permanent Internet connection – Provides temporary connections – Regional ISP – National ISP • Earthlink Chapter 1: The Environment and the Tools 15 Web Browsers A Web browser is a specific software program that requests, downloads, and displays Web pages stored on a Web server Chapter 1: The Environment and the Tools 16 Web Browsers Access a Web page by entering its Uniform Resource Locator (URL) into the Web browser’s Address bar URL is comprised of the protocol, domain name and top-level domain designation – Hypertext Transfer Protocol (HTTP) – Domain name can be an IP address or a text version of this address Chapter 1: The Environment and the Tools 17 Web Browsers Chapter 1: The Environment and the Tools 18 Types of Web Sites Personal Organizational / Topical Commercial Chapter 1: The Environment and the Tools 19 Personal Limited developmental resources Uses – Advertise employment credentials – Meet new friends – Share common interests Do not post information that can be misused Chapter 1: The Environment and the Tools 20 Organizational / Topical Organization Web sites contain information on particular organizations Topical Web sites contain information on the developer’s interests and hobbies Not all information is accurate Chapter 1: The Environment and the Tools 21 Commercial Used to promote and sell a product or service More complex commercial Web sites generally produce greater revenue Chapter 1: The Environment and the Tools 22 Search Tools Web-based search tools – Search engines • Keywords – Metasearch engines – Search directories Search engine might use a variety of methods to create its index – Spiders or robots – Meta tags Search engine optimization (SEO) Subject directories Chapter 1: The Environment and the Tools 23 Search Tools Chapter 1: The Environment and the Tools 24 Portals A portal is a Web site that offers a starting point for accessing information – General consumer portal – Personal portal – Vertical portal – Corporate portal Chapter 1: The Environment and the Tools 25 Web Design Tools Does the new technology meet currently accepted standards for Web development and design? What specifically can the new technology do to further the purpose of my Web site? How will implementation of the new technology affect my Web site’s visual appeal, accessibility, and usability? What impact will adding this technology have on security and other Web site elements? What are the direct and indirect costs of implementing the new technology? How soon will I see a return on investing in this new technology? Chapter 1: The Environment and the Tools 26 Markup Languages Hypertext Markup Language (HTML) Extensible Markup Language (XML), Extensible HTML (XHTML) Wireless Markup Language (WML) Chapter 1: The Environment and the Tools 27 Hypertext Markup Language Markup language used to create Web pages Defines a Web page through tags or markups World Wide Web Consortium (W3C) sets standards for HTML Chapter 1: The Environment and the Tools 28 Extensible Markup Language (XML), Extensible HTML (XHTML), and Wireless Markup Language (WML) XML uses markups to define the content of a Web page XHTML is a markup language that is a combination of the features of XML and HTML WML is a subset of XML – Used to design Web pages for microbrowsers Chapter 1: The Environment and the Tools 29 Cascading Style Sheets Standardize the presentation of the content by applying styles to such elements – Type – Margins – Positioning – Colors Chapter 1: The Environment and the Tools 30 Scripting Languages Short programs that run on the server or the browser Browsers must support this technology Scripting languages – – – – JavaScript Active Server Pages (ASP) PHP: Hypertext Preprocessor (PHP) MySql Active content Malware Chapter 1: The Environment and the Tools 31 Text and HTML Editors A text editor is software used to create plain (ASCII) text files An HTML editor is a text editor enhanced with special features that are used to more easily insert HTML tags and their attributes – HTML-Kit® – CoffeeCup® – BBEdit® – NoteTab® Chapter 1: The Environment and the Tools 32 WYSIWYG Packages that automatically generate HTML code There are packages available for every level of expertise – Adobe Dreamweaver® Chapter 1: The Environment and the Tools 33 Web Templates and Other Design Technologies A Web template is a predesigned model that can be customized for fast Web site or Web page creation or updating An intranet is a private network within a large organization or commercial entity that uses Internet and Web technologies to share information among only its members, employees, or business partners A content management system (CMS) facilitates the management of Web content development – Content repository Chapter 1: The Environment and the Tools 34 Web Design Roles Web design can be done independently or with a partner or group Creative Role – Content writer / editor – Web page designer – Web artist / graphic designer – Multimedia producer Chapter 1: The Environment and the Tools 35 Web Design Roles Hi-Tech Role – Web programmer – Database developer – Network / security administrator Oversight Role – Content managers – Webmaster Chapter 1: The Environment and the Tools 36 Chapter Summary Describe the Internet and the World Wide Web Discuss ways to access the Internet and the Web Categorize types of Web sites Identify Web design tools Explain Web design roles Chapter 1: The Environment and the Tools 37 1 The Environment and the Tools Web Design, 3rd Edition