1. Web Design Study Guide Oswego School District 308 Plank Jr. High Digital Imagery and Web Design Mr. Brown

2. Web Design Why build a Web Site? Worldwide Daily Internet Use Top Web Sites Worldwide URL’s Web Site Design Basics Dreamweaver

3. Why Build a Web Site? __________________ (a.k.a., Portal) and ______________  www.yahoo.com www.yahoo.com  www.espn.com www.espn.com  www.bloomberg.com www.bloomberg.com  www.wikipedia.org www.wikipedia.org  www.mcdonalds.com www.mcdonalds.com Advertise, ______________, and make money (a.k.a. e-Commerce)  www.amazon.com www.amazon.com  www.ebay.com www.ebay.com  www.homedepot.com www.homedepot.com  www.ticketmaster.com www.ticketmaster.com  www.expedia.com www.expedia.com  www.eastbay.com www.eastbay.com  www.abercrombieandfitch.com www.abercrombieandfitch.com Provide ______________ and make money  www.visa.com www.visa.com  www.tcfbank.com www.tcfbank.com Promote a product and make money  www.sixflags.com www.sixflags.com  www.mlb.com www.mlb.com  www.sandiegozoo.org www.sandiegozoo.org  www.atlantis.com www.atlantis.com 1 4 3 2

4. Why Build a Web Site? (cont.) ______________ and to meet people with like minds (a.k.a. – Blogs) Note: Most of these are blocked for school computers.  www.facebook.com www.facebook.com  www.sina.com.cn www.sina.com.cn  www.linkedin.com www.linkedin.com  www.chicagohoops.com www.chicagohoops.com Create gaming communities and make money  www.shockwave.com www.shockwave.com  www.worldofwarcraft.com www.worldofwarcraft.com _______________________ communicate with Taxpayers  www.irs.gov www.irs.gov  www.nasa.gov www.nasa.gov  www.nps.gov www.nps.gov Schools to share information with Students and Parents  www.oswego308.org www.oswego308.org  www.itt.edu www.itt.edu  www.johnshopkins.edu www.johnshopkins.edu And many more reasons… 5 6

5. Worldwide Daily Internet Use* * According to http://www.internetworldstats.com/stats.htm 7

6. Top Web Sites Worldwide* * According to http://www.alexa.com/topsites 8

7. URL’s (_______________________) Also known as “______________” Examples: www.oswego308.org or www.google.comwww.oswego308.orgwww.google.com URL’s must be register to a specific owner www.register.com It costs $$$$ (about $30/yr.) Regional Internet Registries (RIR’s) oversee registration of URL’s within a particular part of the world. There are 5 RIRs in operation: –Asia and Australia region - Asia-Pacific Network Information Centre (APNIC) –Europe, the Middle East and Central Asia region - RIPE Network Coordination Centre (RIPE NCC) –North America region - American Registry for Internet Numbers (ARIN). In the United States it’s the responsibility of Internet Corporation for Assigned Names and Numbers (ICANN) –Latin America region - Latin American and Caribbean Internet Address Registry (LACNIC) –Africa region - African Network Information Centre (AfriNIC) Read this page on www.wikipedia.org to better understand how Internet Domain Naming System works –http://en.wikipedia.org/wiki/Domain_name_system 10 9

8. About URL’s (cont.) URL ______________ are intended to have following meaning:.comCommercialUsed by businesses.netNetworkUsed by Service providers initially, now also used by many businesses.orgOrganizationUsed by non-profit organizations.eduEducationUsed by Universities, schools and related bodies.govGovernmentUsed by Government departments and affiliates.infoInformationSite is designed to provide information rather than sell products or services.bizBusinessUsed by Businesses, although less common than alternatives above Often, you will see more letters after the three letter extension. For example www.sina.com.cnwww.sina.com.cn –It indicates what country the web site is based –A lack of a country code suggests the United States Some ______________ are:.auAustralia.ukUnited Kingdom.caCanada.jpJapan.mxMexico.cnChina.vnVietnam 11 12 For a complete list see - http://en.wikipedia.org/wiki/List_of_Internet_top-level_domains

9. Web Site Design Basics ______________ Your Web Site –Who is your intended audience –Creating and organizing content (i.e., Text, Animations, Images, Podcasts, Videos) –Organize Your Web Pages via a ______________ (i.e., hierarchy of your web site) –Basic ______________ –How Frequently Does the Content Change –Generating traffic and finding advertisers Web Site Essentials –Page Banner (provides a consist look and feel) –______________ (these show up on the browser tab and help get your web site found through Google searches) –______________ where should it be on the page? –______________ page –About Us page –Contact Us page –Interactivity (Blogs or ability for users to post comments) –______________ (This is how you make $$$) –______________ –Language translation –For large web sites: Search within Site Map page 13 20 19 18 17 16 15 14 21 The Pirate Traveler Home Page index.html North America Famous Place Web Page northamer ica.html South America Famous Place Web Page southame rica.html Europe Famous Place Web Page europe.ht ml Asia Famous Place Web Page asia.html Africa Famous Place Web Page africa.htm l Australia Famous Place Web Page australia. html Antarctica Famous Place Web Page antarctica.ht ml

10. Web Site Design Basics (cont.) What should the URL or Domain Name –Has it already been registered by someone else –www.whois.com ______________ –Where will you host it and how much will it cost? –Will it perform and how much storage space will they give you? –Is their service 24 hours a day 7 days a week HTML (Stands for __________________________) –It’s the ______________ of the Internet –Includes Tags (for example,,, –The tags are read by your Internet Browser Web Page Development Tools –______________ –Dreamweaver and Kompzer are examples Web Site Testing –Preview in ______________ browsers before you “Go Live” –Make sure all the Multi-media content will play –Make sure all ______________ –Tests the Interactivity (i.e., Blog/comment posting) 25 23 24 22 27 26

11. Web Site Design Basics (cont.) Internet Browsers ______________ –Internet Explorer –Foxfire –Chrome –Safari –Opera 28 * According to http://www.netmarketshare.com

12. Dreamweaver CS4 Defining Your Site (______________ info) Organizing Contents into ___________ (i.e., Animations, Images, Podcasts, Videos) Use Windows to copy content into your site _________ (Code, Split, or Design) Properties Panel Creating Web Pages –Formatting Text and Colors via _____________ helps give your web site a uniform look Use ________ to layout content on the web page –Merging cells –Helps give your web site a ______________ 31 30 34 33 32 29

13. Dreamweaver CS4 (cont.) Inserting and ______________ (Thumbnails, etc.) Inserting and ______________ (Videos and Podcasts) The Properties Panel allows you to create Hyperlinks –______________ –On Text and Images (i.e., __________ ) ______________ is used to create links from page to page within your web site Previewing in Browser –Preview in multiple browsers (IE, Chrome, Safari) –Must do this before Publishing! ___________ Web Sites to Remote Locations 39 38 37 36 35 40