1 Alison Toothman Professor Ballentine English 303: Multimedia Writing December 5, 2012 (Revised copy) CRAP Websites The Internet hemisphere uses CRAP through different media sites to appeal to the web users. CRAP (Contrast, Repetition, Alignment, and Proximity) offers a set of guidelines that helps web makers and people who work with print materials to formulate a design layout that appeals to whomever will be looking at the material. Websites such as: National Geographic, CNN, Facebook, Twitter, Advertising sites, and others all use this set of guidelines. The apple.com website or Mac site, uses CRAP for their web set up. Some of the design principles we have used in Photoshop during class time are design principles used for web designs and print media. First, the “C” in CRAP stands for contrast. The site scribd says, “First basic principle is contrast. Contrast is the attribute of looking different from something else. If the point is to look different then it should be really different” (Melindahernandez). When looking at the Apple site you can see a difference between Apple and Dell by the interactive aspects. Apple uses their resources to show visitors of the site the skill level that people have; who work for them. One other computer site example is the Dell website. They use quality website designs to keep their website up and for it to be accessible to web users. The contrast with Apple is that the people who design these website for Apple use several moving photos to feature on their website and they use a 2 3D effect to keep the eyes stimulated. This makes the look of the website noticeably different from other computer sites. Dell does not use 3D effects as Apple does but Dell uses descriptive wording to give the audience a more in depth insight into what their machines have to offer. The next part of CRAP is, “R” which refers to repetition. On the scribd site it says, “The second basic principle of design is repetition. Repetition means using the same element or attribute in more than one place in the design” (Melindahernandez). In the context of this website they are referring to seeing the repetition on a poster. Repetition on print media is easier to see than a website because with print media all of it is right in front of your eyes. You don’t have to flip back and forth through web pages to see where the repetition is between the web designs that you are looking through. In class, it was discussed during Photoshop and in the Redish readings that to make things appealing for the visitor of the website that you need to have consistency throughout the website such as with: background, title fonts, coloring and spacing through the entire site. Apple does this in a specific way compared to other websites. They always have their navigation bar at the top of the screen, which we have been learning to do in Photoshop. Apple has moving pictures of the latest projects for each specific electronic devises they create in the center and top part of the website screen. The apple website has repetition of constant stimulation with their moving pictures on all their new electronic devices on each of their web pages. Also, they have the contact information; in the right, bottom portion of the website, which is how students have based their web pages in class. The third part of CRAP refers to the, “A” which is alignment. According to the scribd website, “The third basic element of design is alignment. Alignment is the attribute 3 of arranging every element in a design to conform to some kind of horizontal and vertical visual relationship with other elements in the design” (Melindahernandez). Apple uses a fair amount of horizontal lines to keep each element on every page at a balanced distance from each other. So the writings, pictures, and symbols do not get too bunched up, which also is referring to proximity in the word, CRAP. Apple does not want to cause the readers to not want to read about the product or not look through the entire page. Apple uses white space to let the eyes adjust and not be strained while reading the texts. When the Apple website uses vertical lines it is when they have numerous pictures to add in. Each page has factors of vertical and horizontal. With our design principles for our own pages, we have been taught that we can’t pull all of our design tools in different placements and angles on the pages because that would confuse the readers. The web design needs to have alignment and not thrown on the page. Apple is straightforward and they use multiple lines to keep things separate accordingly. Apple keeps everything organized with lines, which helps with keeping the eyes focused. The fourth design principle to CRAP is, “P,” this is placement. The scribd website says, “The fourth design principle of design is proximity. Proximity is the principle that things must be placed close to the items they belong with” (Melindaherndez). Apple uses proximity with their photos and text about each electronic item. When building our own website this portion of CRAP doesn’t affect us as much. Most of the work we are doing in Dream weaver is where we take links for our html from the web, then copy and paste them into our html document for web use. We do not need to worry about losing the codes or writings as we bring codes into Dream weaver because of just copying the codes over into Dream weaver. 4 Through the CRAP design principles it is clear to see that Apple and Dell uses these design principles we are learning in class. Apple doesn’t use every element of CRAP throughout their design methods. However, the web user can see Apple’s specific placements, alignments, repetitions, and contrasts throughout their web pages. Looking through the Apple website it shows the students of Multimedia Writing what design principles we have been using during our own website building. Researching what websites use and applying it to our own web pages is a useful way to help us grow in our web building and the technical writing field. 5 Works Cited: “Create a One-Page Retro Web Design Layout in Photoshop.” Adobe Photoshop Tutorials from Beginner to Advanced. Psdtuts, Mar.-Apr. 2012. Web. 02 Oct. 2012 Melindahernandez. “Contrasts, Repetition, Alignment, Proximity.” Scribd. N.p., 11 Dec. 2009. Web. 02 Oct. 2012. “Welcome to the Apple Store.” Official Apple Store. N.p., n.d. Web. 02 Oct. 2012. 6 Alison Toothman Professor Ballentine English 303 October 2, 2012 (Original Copy) CRAP Websites The use of CRAP within the multifaceted media is quite apparent throughout the internet hemisphere. CRAP (Contrast, Repetition, Alignment, and Placement) is a good structure that not only do internet sites use as their set up but also many posters are made with this idea in mind. There are multiple websites that base their structure on the CRAP technique, however not all are professional sites. The Apple website or Mac site, whichever is the most preferred terminology uses CRAP in their set up, plus some of the design principles we used in our photoshop journey in class. The first part of CRAP that is used is the, “C” which stands for contrast. The site scribd says, “First basic principle is contrast. Contrast is the attribute of looking different from something else. If the point is to look different then it should be really different” (Melindahernandez). When looking at the Apple site you can really see a difference between their site and others. Apple uses their resources to show visitors of the site the skill level that people have; who work for them. One other computer example is the Dell website. They use high quality website designs to keep their website up and functioning, however not as well as Apple does. Additionally, the contrast with Apple is that they use a lot of moving photos to feature on their website and they use a 3D effect to keep the eyes stimulated. This makes the look very noticeably different from other websites, such as the example of the Dell website that doesn’t use as much 3D effect as Apple but uses more descriptive words for their product descriptions. 7 The next part of CRAP is, “R” which refers to Repetition. On the scribd site it says, “The second basic principle of design is repetition. Repetition means using the same element or attribute in more than one place in the design” (Melindahernandez). In the context of this website they are referring to seeing the repetition on a poster. Repetition on a poster is easier to see than a website because with a poster all of it is right in front of your eyes. You don’t have to flip back and forth through web pages to see where the repetition is between everything that you are looking at. In class, it was discussed during photoshop and in the readings of Redish that to make things more appealing to the visitor of the website that you need to have consistency throughout the website, meaning that there should be such things that continuously are shown. Apple does this in a very specific way compared to other websites. They always have their bar at the top of the screen, which we have been learning to do in photoshop during class. Furthermore, they always have moving pictures of the latest projects for each specific electronical device they create in the center and top part of the website screen. That is the second part of CRAP. The website shows the repetition of constant stimulation to the viewers on all the latest electronics on each page. Furthermore, they always have the contact information based on the right, bottom portion of the website, which is how most of the students based their web pages in class. The third part of CRAP refers to the, “A” which means alignment. According to the scribd website, “The third basic element of design is alignment. Alignment is the attribute of arranging every element in a design to conform to some kind of horizontal and vertical visual relationship with other elements in the design” (Melindahernandez). Apple uses a fair amount of horizontal lines to keep each element on every page at a 8 reasonable distance from each other. So the writings, pictures, and symbols do not get too bunch up together to cause readers to not want to read about the product or not look through the entire page. They use a fair amount of white space to let the eyes adjust and not be strained while reading the texts. When the Apple website uses more vertical lines and expresses it, that’s when they have numerous pictures to add in as well. Each page has factors of vertical and horizontal looks to it, but if you want to see it as straightforward lines it is shown very much so in their main page and store page. With our design principles for our own pages, we have been taught that we can’t put all of our stuff at different placements and angles on the pages because that would confuse the readers. This can go into why Apple is straightforward and they use a lot of lines to keep things separate accordingly. Apple keeps everything organized with lines, which helps with keeping the eyes focused correctly. The fourth design principle to CRAP is, “P” which refers to placement. When looking at the scribd website it says, “The fourth design principle of design is proximity. Proximity is the principle that things must be placed close to the items they belong with” (Melindahernandez). Apple uses this with the photos and text about the item. They don’t leave much room between the two parts because if they did the readers might get lost in where specifically things are and what goes with what. When building our own website this portion of CRAP doesn’t affect us as much. Most of our works are linked on the page to where we don’t have to worry about our writings being misplaced. Through all these design principles it is clear to see that even a huge multicorporation uses the CRAP technique with building their website. Apple doesn’t use exact ones with all of the design methods. However, you can see their specific 9 placements, alignments, repetitions, and contrasts throughout their different pages. Furthermore, researching the Apple website showed us exactly what design principles we have been using with our own websites. Seeing what other websites use and applying it to our own web pages is quite fascinating and helps us in growing our technique as a technical writer. 10 Work Cited: "Create a One-Page Retro Web Design Layout in Photoshop." Adobe Photoshop Tutorials from Beginner to Advanced. Psdtuts, Mar.- Apr. 2012. Web. 02 Oct. 2012. <http://psd.tutsplus.com/tutorials/interface-tutorials/retro-web-design-layout/>. Melindahernandez. "Contrast, Repetition, Alignment, Proximity." Scribd. N.p., 11 Dec. 2009. Web. 02 Oct. 2012. <http://www.scribd.com/doc/23940707/ContrastRepetition-Alignment-Proximity>. "Welcome to the Apple Store." Official Apple Store. N.p., n.d. Web. 02 Oct. 2012. <http://store.apple.com/us>.