Web+Sites

The Good, The Bad, and The Ugly
The first part of this wiki page highlights seven examples of web sites that follow principles of good web design. The latter half highlights six examples of sites that do not. References are noted at the bottom.

Examples of Educational Web Sites of Good Design
|| * Animated movies on all curriculum topics. || * Social networking and microblogging service utilizing instant messaging, SMS or a web interface. || * interactive website with multiple topic listings || * Different parts of the site are created specifically for either Teachers, Parents or Kids. || * Interactive site for very young children which teaches things like alphabet skills. || * Created by the Houston Museum of Natural Science clubhouse_page/clubhouse.htm || * A resource website for teachers and students
 * //**Website**// || //**General Information About Site**// || //**Rationale Why It Is Good**// ||
 * http://www.brainpop.com/
 * Includes quizzes, games, vocabulary, and activities.
 * Can be used for whole-class instruction or by individual students.
 * Offers lesson plans and lesson ideas.
 * Is a paid subscription. || * BrainPop has a consistent interface, is easy to use, and very teacher and kid-friendly. It is evident that the user was the center of the design.
 * The entire site has a common theme and look. Navigation is consistent throughout the site.
 * As a member of BrainPop, I appreciate that the designers regularly solicit feedback from its users through surveys and email notifications. The designer of this site does not fear constructive criticism and welcomes changes. //(Mishra, Zhao, and Tan, 1999)// ||  ||   ||
 * http://twitter.com/
 * Comments made in the network are limited to 140 characters. || * The user interface and layout of Twitter is very simple.
 * The designers are "prepared to interact with users" //(Greenspun, Ch. 1, Become Illiterate)// answering questions, moderating its use, and updating their site as needed to improve performance. ||
 * http://www.kidsknowit.com/
 * Includes movies, games, quizzes, and more
 * Can be used for whole class instruction or individually
 * FREE || * Mishra, Zhao, and Tan (1999) explain that the design of the technology should be purposeful (224). The goal of this website is clear in that the website aims to provide the exploration of many topics through different avenues.
 * The screen loads in a reasonable about of time and is kid-friendly (Schrock, 2002). ||  ||
 * http://www2.scholastic.com/browse/home.jsp
 * Site contains lesson plan ideas, teacher guides in PDF format for easy access, articles for parents and learning activities for kids. || * The website appeals to multiple audiences and is graphically appealing to the intended audience. (example: more color and graphics on the kids page)
 * The site offers valuable and usable resources for teachers including the ability to build a class website through scholastic.
 * The site is well organized and easy to navigate. ||
 * http://www.inklesstales.com/
 * The site focuses mainly on reading and has a section where kids can have stories read to them.
 * The stories are written using Dolch sight words. || * The site is colorful and appealing to children.
 * The site has activities for children that can be printed and done without the use of a computer.
 * The site has a section where readers can submit their own stories and poems which is a great incentive for kids.
 * The site provides book reviews but does not attempt to sell anything. ||
 * http://www.lucyexhibition.com/life-in-lucys-time.aspC
 * Discusses evolution in light of the findings of "Lucy," a 3.2 million year-old fossilized Hominid discovered in 1974 || * The site is very hands-on. You can scroll the viewer from side to side to view from ancient times to Lucy's discovery and excavation, or you can click on the links on the top of the page to learn more about discovering and dating fossils.
 * The images used in the time line are very effective, making you feel part of the team who made the incredible discovery in Africa. ||
 * http://www.audreywood.com/mac_site/clubhouse/
 * Features books written and illustrated by children's authors Audrey and Don Wood.
 * Worksheets and activities are available || * This a very easy site to navigate as Schrock, (2002), states "Must be navigable and easy-to-use". The links are clearly shown and in simple language.
 * The graphics are appropriate for the age level and pleasing to the eye.
 * The author pages are informative and easy to read. (Schrock, 2002) ||

**Examples of Educational Web Sites of Bad Design**
|| * Portal to more than 2000 interactive learning activities and games for PK-6. || * This site is geared to students, educators, and parents. The actual content of the page is quite good, providing links to many of the online games children like to visit in one central location.
 * //**Website**// || //**General Information About Site**// || //**Rationale Why It Is Bad**// ||
 * http://www.gamequarium.com/
 * However, it is difficult to get past the aesthetics of the page. It literally hurts your eyes to look at it. The color choices are poor. The font is too small. The site is too overwhelming for the younger audience it claims to reach. (To test my theory, I placed my 5- year old on the site. She wanted to "do something different" after about one-minute. She experienced no success in navigating the site.)
 * Web Design from Scratch says "communicate, don't decorate". The water-themed background, animated sea animals, and floating bubbles are just too much. ||
 * [|http://www.bow-wowbooks.com]

|| * Site to promote author Mark Newgarden and Bow Wow book series. || * Looking solely at the title of the site, one would think it would have something to do with books. Arriving at the site, there is an adorable picture of a dog and no text - nothing. Assuming I must enter the site, I clicked on the dog. I am now taken to a picture of two dogs, one balancing a ball on his nose and one looking at a book. Again, not a single word on the page indicating what the site might be about. At this point, I'm thinking the design is creative. Until... || * "Homework" helper website offering students the opportunity to explore different subjects using reference tools. || * This site is primarily text based and lacks color. || * The website acts as a database of teacher resource sites. || * NASA site that highlights STS108, Endeavor's 12th flight to the International Space Station. || * While the purpose of this site is meaningful and the topic extremely interesting to children, it is not a site I would share with students in the classroom. || * An interactive website for young learners.
 * Clicking on the first dog, I find some activities for kids like a puzzle, a feed the dog game, and a bark at a bug on the wall game. Again no words, no descriptions of the activities, no help button.
 * Clicking on the second dog finally gives me a clue that this site is about Mark Newgarden's series of Bow Wow books when I am taken to Amazon.com.
 * As I maneuvered through this site, I felt like I was in an endless maze. I must have clicked on pictures for several minutes before I finally figured out what the designer was trying to do.
 * According to Mishra, Zhao, and Tan (1999), "there is a difference between artistic creativity and design creativity." In an effort to be creative and different, the designer lost me.
 * The designer definitely did not communicate his/her intentions to potential users of the site. As stated by Greenspun, the designer did not put himself "into your user's shoes before planning your site's content." //(Ch. 1, Summary)//
 * I would also imagine the designer "fell in love with the concept and was unable to see its flaws and weaknesses." //(Mishra, Zhao, and Tan, p. 233, par. 2)// ||
 * http://www.infoplease.com/homework/
 * There are many confusing links for students to follow and confusing terminology.
 * In a study conducted by Shiva Naidu, none of the 30 student participants could find the answer to a given question (2005). Greenspun states that people come to a website to get answers to their questions (2003). When a student has a difficult time finding an answer to their question, they are likely to leave the site in search of a better one.
 * While there was a search engine on the site, there was no way to contact the designer with questions or comments. ||
 * http://www.sitesforteachers.com/
 * The site offers a search tool to help sort through the thousands of links provided. || * This site is poorly organized. While it provides links to useful sites, it does not sort them in a logical way (like by grouping subject areas or grades).
 * The site's search bar does not always pull relevant material.
 * The site provides too little information about the various websites it is advertising. One would have an easier time simply using Google.
 * The site has no interactivity component to allow teachers to provide feedback on the value of the websites listed. According to Mishra, Zhao, & Tan (1999) "it is the responsibility of a good designer to consider feedback" (p. 233). ||
 * http://spaceflight.nasa.gov/shuttle/archives/sts-108/flash/sts108.swf
 * This Flash site has moving strips on one side and moving dots on the other of different colors. It is very difficult to focus your eyes to locate links with all the movement.
 * It just doesn't seem to fit the profile of other NASA sites either. It's as if a high school student learning about Flash got a bit carried away. ||
 * http://www.kbears.com/
 * Contains games and educational information.
 * Topics range from dinosaurs to farms || * Way to busy for young children.
 * Flashing and moving graphics all the time.
 * Some characters have accents that are difficult to understand and one doesn't speak so a child would have to read the directions. This is an example of not considering your audience or "putting yourself in your users' shoes" (Greenspun 2003)
 * Difficult to navigate for non readers.
 * Too many different fonts and graphics on the sidebar.
 * Reminds me of video games not educational. ||

**Resources** Greenspun, P. (2003). "Envisioning a site that won't be featured in suck.com". //Phillip and Alex's Guide to Web Publishing//. Retrieved on March 23, 2008 from http://webdesign.about.com/gi/dynamic/offsite.htm?site=http://www.photo.net/wtr/thebook/suck.html.

Mishra, P., Zhao, Y., Tan, S. (1999). [|From concept to software: Developing a framework for understanding the process of software design]. Journal of Research on Computing in Education, 32(2). Naidu, Shiva. (2005). Usability News, 7(2). //Evaluating the Usability of Educational Websites for Children.// Retrieved March 27 from http://psychology.wichita.edu/surl/usabilitynews/72/children_internet.htm

Scratchmedia. (2007) Web Design from Scratch. Retrieved March 26, 2008 from [|http://www.webdesignfromscratch.com].

Schrock, Kathleen. (2002). Website Evaluation and Lesson Plan Guide. Retrieved March 27, 2008 from [|http://kathyschrock.net/abceval/teacherwebeval.pdf