Identify which type of website you will design—personal, organizational/topical, or commercial.
After reading hapter 1 of your textbook and watching the video “Web Design 101: Information Architecture Basics,” complete the following steps 1–6 to develop a website plan for a site you would like to develop in the future:
- Identify which type of website you will design—personal, organizational/topical, or commercial. Write a brief paragraph describing the website’s overall purpose and its targeted audience. Create a name for your website.
- List at least three general goals for your website. You will fine-tune these goals into a mission statement in a subsequent chapter.
- List elements in addition to text—photos, music, animation, and so forth—that you could include on your website to support your general goals.
- Identify the design tools you expect to use to develop your website.
- Identify an available domain name and URL for your website. Research to make sure it is available.
- Submit your findings in the format requested by your instructor. Be prepared to discuss your plan with the class.
The paper must following the formatting guidelines in The Publication Manual of the American Psychological Association (2010), (6th ed., 7th printing), and contain a title page, five scholarly references, three to five pages of content, and a reference page
1
Web Design 6E Chapter 1: The Environment and the Tools
© 2018 Cengage. All Rights Reserved. May not be copied, scanned, or duplicated, in whole or in part, except for use as permitted in a license distributed with a certain product or service or otherwise on a password-protected website for classroom use.
2
Chapter Objectives
•Describe the Internet and the World Wide Web •Discuss ways to access the Internet and the web •Categorize types of websites • Identify web design tools • Explain web design principles, roles, and required skills
© 2018 Cengage. All Rights Reserved. May not be copied, scanned, or duplicated, in whole or in part, except for use as permitted in a license distributed with a certain product or service or otherwise on a password-protected website for classroom use.
3
The Internet and the World Wide Web (1 of 3)
•A computer network consists of connected computers, mobile devices, printers, and data storage devices that share computing resources and data
• The Internet is a worldwide public network that connects millions of these private networks
© 2018 Cengage. All Rights Reserved. May not be copied, scanned, or duplicated, in whole or in part, except for use as permitted in a license distributed with a certain product or service or otherwise on a password-protected website for classroom use.
4
The Internet and the World Wide Web (2 of 3)
© 2018 Cengage. All Rights Reserved. May not be copied, scanned, or duplicated, in whole or in part, except for use as permitted in a license distributed with a certain product or service or otherwise on a password-protected website for classroom use.
5
The Internet and the World Wide Web (3 of 3)
• The World Wide Web (web) is a part of the Internet that consists of connected computers called web servers that store electronic documents called webpages
•A webpage is a specially formatted document that can contain images, text, interactive elements, and hyperlinks, which are links to other pages
•A website is a group of related webpages
© 2018 Cengage. All Rights Reserved. May not be copied, scanned, or duplicated, in whole or in part, except for use as permitted in a license distributed with a certain product or service or otherwise on a password-protected website for classroom use.
6
World Wide Web (1 of 2)
•A website’s primary page is its home page
© 2018 Cengage. All Rights Reserved. May not be copied, scanned, or duplicated, in whole or in part, except for use as permitted in a license distributed with a certain product or service or otherwise on a password-protected website for classroom use.
7
World Wide Web (2 of 2)
•Browsing or surfing the web is exploring the web by moving from one webpage to another
© 2018 Cengage. All Rights Reserved. May not be copied, scanned, or duplicated, in whole or in part, except for use as permitted in a license distributed with a certain product or service or otherwise on a password-protected website for classroom use.
8
Influence on Society
Communication
Education
Entertainment and News
E-commerce
© 2018 Cengage. All Rights Reserved. May not be copied, scanned, or duplicated, in whole or in part, except for use as permitted in a license distributed with a certain product or service or otherwise on a password-protected website for classroom use.
9
Communication (1 of 2)
• Bookmark / favorite • Shortcut
• Internet Relay Chat (IRC) • Web chat • Instant messaging / IM chat
• Group messaging apps
• Collaborative workspaces / virtual meeting spaces
• Blog • Video sharing / Video blogging
• Social networking • Social bookmarking
• Massively multiplayer online games (MMOGs)
• 3D virtual worlds • Wiki
© 2018 Cengage. All Rights Reserved. May not be copied, scanned, or duplicated, in whole or in part, except for use as permitted in a license distributed with a certain product or service or otherwise on a password-protected website for classroom use.
10
Communication (2 of 2)
© 2018 Cengage. All Rights Reserved. May not be copied, scanned, or duplicated, in whole or in part, except for use as permitted in a license distributed with a certain product or service or otherwise on a password-protected website for classroom use.
11
Education
• Take an online course from an academic institution to earn a degree or certificate
•Watch a video or read a blog post by an amateur expert • Several universities and academic institutions publish some or all educational materials online
© 2018 Cengage. All Rights Reserved. May not be copied, scanned, or duplicated, in whole or in part, except for use as permitted in a license distributed with a certain product or service or otherwise on a password-protected website for classroom use.
12
Entertainmentand News
•Popular entertainment sites include music, videos, sports, games, and more
•News websites allow you to read news stories, and some even allow you to watch video clips • Some provide interactive elements
© 2018 Cengage. All Rights Reserved. May not be copied, scanned, or duplicated, in whole or in part, except for use as permitted in a license distributed with a certain product or service or otherwise on a password-protected website for classroom use.
13
E-Commerce
• Electronic commerce or e-commerce encompasses a wide variety of online business activities, including consumer shopping and investing and the exchange of business data and transactions within a company or among multiple companies
• Business-to-consumer (B2C) • Business-to-business (B2B) • Consumer-to-consumer (C2C)
© 2018 Cengage. All Rights Reserved. May not be copied, scanned, or duplicated, in whole or in part, except for use as permitted in a license distributed with a certain product or service or otherwise on a password-protected website for classroom use.
14
Ways to Access the Internet
The speed at which data travels from one device to another is the transfer rate
• Bits per second (bps) • From thousands (kbps) to millions (Mbps) • Higher-quality connections needed for streaming media
© 2018 Cengage. All Rights Reserved. May not be copied, scanned, or duplicated, in whole or in part, except for use as permitted in a license distributed with a certain product or service or otherwise on a password-protected website for classroom use.
15
Broadband Connections
•Broadband defines high-speed data transmissions over a communications channel that can transmit multiple signals at one time • Digital subscriber line (DSL) • Cable television (CATV) line • FTTP: Fiber to the Premises • Satellite
© 2018 Cengage. All Rights Reserved. May not be copied, scanned, or duplicated, in whole or in part, except for use as permitted in a license distributed with a certain product or service or otherwise on a password-protected website for classroom use.
16
Connecting to the Internet and the Web
•Mobile wireless technologies: • Radio signals • Wi-Fi (wireless fidelity) • Cellular telephones • Wireless providers’ broadband networks
© 2018 Cengage. All Rights Reserved. May not be copied, scanned, or duplicated, in whole or in part, except for use as permitted in a license distributed with a certain product or service or otherwise on a password-protected website for classroom use.
17
Mobile Internet Access
Generations classify standards for mobile communications:
• 3G: speech and data services • 4G: gaming apps and streaming media
© 2018 Cengage. All Rights Reserved. May not be copied, scanned, or duplicated, in whole or in part, except for use as permitted in a license distributed with a certain product or service or otherwise on a password-protected website for classroom use.
18
Internet Service Providers
• Internet Service Provider (ISP) • Has permanent Internet connection • Provides temporary connections • Regional ISP • National ISP
-Verizon
© 2018 Cengage. All Rights Reserved. May not be copied, scanned, or duplicated, in whole or in part, except for use as permitted in a license distributed with a certain product or service or otherwise on a password-protected website for classroom use.
19
Web Browsers (1 of 6)
A web browser is a program or app that requests, downloads, and displays webpages stored on a web server
• Google Chrome • Microsoft Edge • Mozilla Firefox
© 2018 Cengage. All Rights Reserved. May not be copied, scanned, or duplicated, in whole or in part, except for use as permitted in a license distributed with a certain product or service or otherwise on a password-protected website for classroom use.
20
Web Browsers (2 of 6)
© 2018 Cengage. All Rights Reserved. May not be copied, scanned, or duplicated, in whole or in part, except for use as permitted in a license distributed with a certain product or service or otherwise on a password-protected website for classroom use.
21
Web Browsers (3 of 6)
•Responsive web design (RWD) is used to create websites that adjust to the device and screen size displaying the webpage
© 2018 Cengage. All Rights Reserved. May not be copied, scanned, or duplicated, in whole or in part, except for use as permitted in a license distributed with a certain product or service or otherwise on a password-protected website for classroom use.
22
Web Browsers (4 of 6)
•Access webpages by entering its Uniform Resource Locator (URL) into the 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
© 2018 Cengage. All Rights Reserved. May not be copied, scanned, or duplicated, in whole or in part, except for use as permitted in a license distributed with a certain product or service or otherwise on a password-protected website for classroom use.
23
Web Browsers (5 of 6)
© 2018 Cengage. All Rights Reserved. May not be copied, scanned, or duplicated, in whole or in part, except for use as permitted in a license distributed with a certain product or service or otherwise on a password-protected website for classroom use.
24
Web Browsers (6 of 6)
© 2018 Cengage. All Rights Reserved. May not be copied, scanned, or duplicated, in whole or in part, except for use as permitted in a license distributed with a certain product or service or otherwise on a password-protected website for classroom use.
25
Types of Websites
Personal Organizational / Topical
Commercial
© 2018 Cengage. All Rights Reserved. May not be copied, scanned, or duplicated, in whole or in part, except for use as permitted in a license distributed with a certain product or service or otherwise on a password-protected website for classroom use.
26
Personal
• Limited developmental resources • Content management systems
•Uses: • Promote employment credentials • Share news and photos with friends and family • Share common interests or hobbies
•Do not post information that can be misused
© 2018 Cengage. All Rights Reserved. May not be copied, scanned, or duplicated, in whole or in part, except for use as permitted in a license distributed with a certain product or service or otherwise on a password-protected website for classroom use.
27
Organizational / Topical
•Organizational websites contain information on particular organizations
• Topical websites focus on a specific subject
© 2018 Cengage. All Rights Reserved. May not be copied, scanned, or duplicated, in whole or in part, except for use as permitted in a license distributed with a certain product or service or otherwise on a password-protected website for classroom use.
28
Commercial
•Used to promote and sell a product or service •More sophisticated commercial websites generally produce greater revenue
© 2018 Cengage. All Rights Reserved. May not be copied, scanned, or duplicated, in whole or in part, except for use as permitted in a license distributed with a certain product or service or otherwise on a password-protected website for classroom use.
29
Search Tools (1 of 4)
•Web-based search tools • Search engines
-Keywords
• Search engines might use a variety of methods to create its index • Spiders or robots • Meta tags
•Metasearch engines
© 2018 Cengage. All Rights Reserved. May not be copied, scanned, or duplicated, in whole or in part, except for use as permitted in a license distributed with a certain product or service or otherwise on a password-protected website for classroom use.
30
Search Tools (2 of 4)
© 2018 Cengage. All Rights Reserved. May not be copied, scanned, or duplicated, in whole or in part, except for use as permitted in a license distributed with a certain product or service or otherwise on a password-protected website for classroom use.
31
Search Tools (3 of 4)
• Search Engine Optimization (SEO) • Designing webpages to appear higher in search engine results
-Meta tags -Descriptive page titles -Relevant inbound links -Clearly written text
© 2018 Cengage. All Rights Reserved. May not be copied, scanned, or duplicated, in whole or in part, except for use as permitted in a license distributed with a certain product or service or otherwise on a password-protected website for classroom use.
32
Search Tools (4 of 4)
• Search Directory • Builds index using human interaction
• Click category and subcategory links to find webpages
© 2018 Cengage. All Rights Reserved. May not be copied, scanned, or duplicated, in whole or in part, except for use as permitted in a license distributed with a certain product or service or otherwise on a password-protected website for classroom use.
33
Portals
•A portal is a website that offers a starting point for accessing information • General consumer • Personal • Vertical • Corporate
© 2018 Cengage. All Rights Reserved. May not be copied, scanned, or duplicated, in whole or in part, except for use as permitted in a license distributed with a certain product or service or otherwise on a password-protected website for classroom use.
34
Other Types of Websites
© 2018 Cengage. All Rights Reserved. May not be copied, scanned, or duplicated, in whole or in part, except for use as permitted in a license distributed with a certain product or service or otherwise on a password-protected website for classroom use.
35
Web Design Tools
Before adding new technology, ask: • Does it meet currently accepted standards? • What can it do to further my purpose?
• How will it affect my website’s visual appeal, accessibility, and usability?
• What impact will it have on security and other website elements?
• What are the direct and indirect costs? • How soon will I see a return on investing?
© 2018 Cengage. All Rights Reserved. May not be copied, scanned, or duplicated, in whole or in part, except for use as permitted in a license distributed with a certain product or service or otherwise on a password-protected website for classroom use.
36
Markup Languages (1 of 2)
•Hypertext Markup Language (HTML) • Uses tags to define format and organization of webpage elements
• HTML5 • W3C sets standards
• Extensible Markup Language (XML) • Facilitates sharing of information
© 2018 Cengage. All Rights Reserved. May not be copied, scanned, or duplicated, in whole or in part, except for use as permitted in a license distributed with a certain product or service or otherwise on a password-protected website for classroom use.
37
Markup Languages (2 of 2)
© 2018 Cengage. All Rights Reserved. May not be copied, scanned, or duplicated, in whole or in part, except for use as permitted in a license distributed with a certain product or service or otherwise on a password-protected website for classroom use.
38
Cascading Style Sheets
• Standardize the presentation of the content by applying styles to such elements • Font • Margins • Positioning • Background colors
• Style sheets can be attached to multiple webpages
© 2018 Cengage. All Rights Reserved. May not be copied, scanned, or duplicated, in whole or in part, except for use as permitted in a license distributed with a certain product or service or otherwise on a password-protected website for classroom use.
39
Scripting Languages
•Programming languages used to write short programs that run on the server or the browser • Javascript • PHP: Hypertext Preprocessor (PHP) • CoffeeScript
•Active content •Malware
© 2018 Cengage. All Rights Reserved. May not be copied, scanned, or duplicated, in whole or in part, except for use as permitted in a license distributed with a certain product or service or otherwise on a password-protected website for classroom use.
40
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
© 2018 Cengage. All Rights Reserved. May not be copied, scanned, or duplicated, in whole or in part, except for use as permitted in a license distributed with a certain product or service or otherwise on a password-protected website for classroom use.
41
Web Development Tools (1 of 2)
•Packages that automatically generate HTML code • WYSIWYG • IDEs
© 2018 Cengage. All Rights Reserved. May not be copied, scanned, or duplicated, in whole or in part, except for use as permitted in a license distributed with a certain product or service or otherwise on a password-protected website for classroom use.
42
Web Development Tools (2 of 2)
Challenges to using web development tools: • Might look different than what you see in browser • Unnecessary codes create large, slow-loading webpages • Might not use latest markup language standards
© 2018 Cengage. All Rights Reserved. May not be copied, scanned, or duplicated, in whole or in part, except for use as permitted in a license distributed with a certain product or service or otherwise on a password-protected website for classroom use.
43
Web Templates and Content Management Systems (1 of 3)
•A Web templateor theme is a predesigned model that can be customized for fast website or webpage creation or updating
© 2018 Cengage. All Rights Reserved. May not be copied, scanned, or duplicated, in whole or in part, except for use as permitted in a license distributed with a certain product or service or otherwise on a password-protected website for classroom use.
44
Web Templates and Content Management Systems (2 of 3)
•A content management system (CMS) facilitates the management of web content development
-Drupal -WordPress -Joomla
•Content repository
© 2018 Cengage. All Rights Reserved. May not be copied, scanned, or duplicated, in whole or in part, except for use as permitted in a license distributed with a certain product or service or otherwise on a password-protected website for classroom use.
45
Web Templates and Content Management Systems (3 of 3)
•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
© 2018 Cengage. All Rights Reserved. May not be copied, scanned, or duplicated, in whole or in part, except for use as permitted in a license distributed with a certain product or service or otherwise on a password-protected website for classroom use.
46
Web Design Roles (1 of 4)
Creative Technical
Oversight
© 2018 Cengage. All Rights Reserved. May not be copied, scanned, or duplicated, in whole or in part, except for use as permitted in a license distributed with a certain product or service or otherwise on a password-protected website for classroom use.
47
Web Design Roles (2 of 4)
•Creative Roles • Content writer / editor • SEO expert • Web designer • UI / UX manager • Web artist / graphic designer • Multimedia producer
© 2018 Cengage. All Rights Reserved. May not be copied, scanned, or duplicated, in whole or in part, except for use as permitted in a license distributed with a certain product or service or otherwise on a password-protected website for classroom use.
48
Web Design Roles (3 of 4)
• Technical Roles • Web programmer / developer
-Front-end -Back-end -Full-stack
• Database developer • Web server administrator
© 2018 Cengage. All Rights Reserved. May not be copied, scanned, or duplicated, in whole or in part, except for use as permitted in a license distributed with a certain product or service or otherwise on a password-protected website for classroom use.
49
Web Design Roles (4 of 4)
•Oversight Roles • Web administrator • System architect • Tester • Social media expert
© 2018 Cengage. All Rights Reserved. May not be copied, scanned, or duplicated, in whole or in part, except for use as permitted in a license distributed with a certain product or service or otherwise on a password-protected website for classroom use.
50
Chapter Summary
•Describe the Internet and the World Wide Web •Discuss ways to access the Internet and the web •Categorize types of websites • Identify web design tools • Explain web design principles, roles, and required skills
© 2018 Cengage. All Rights Reserved. May not be copied, scanned, or duplicated, in whole or in part, except for use as permitted in a license distributed with a certain product or service or otherwise on a password-protected website for classroom use.
