Survey
* Your assessment is very important for improving the workof artificial intelligence, which forms the content of this project
* Your assessment is very important for improving the workof artificial intelligence, which forms the content of this project
COMM 3353: Communication Web Technologies I Chapter 8b: Web Site Design, Production, and Aesthetics, Continued… By Dr. Shawn McCombs - http://soc.class.uh.edu/~smccombs Web Site Design, Production, and Aesthetics, Continued… Graphic Issues Organization (Commercial) Site Analysis Tips For Effective Web Site Design Evaluating A Web Site The Future of Web Site Design Graphic Issues Graphics attract people to a site. Must be of good quality and load quickly Graphics can get people’s attention long enough to get out the desired message. If good, can cause return visits. Primary Types of Graphic Files GIF Files JPG Files Graphic Issues, Continued… GIF ( .gif) Files Graphic Interchange Format Most common type of graphic files to date Developed and originally owned by CompuServe (AOL). Companies and organizations which profit from GIF usage are supposed to obtain licensing from CompuServe Just doesn’t happen, except for the largest of the players (Microsoft, IBM, etc.) Microsoft developed it’s own “gif” and “bmp” formats to combat CompuServe’s market share. Graphic Issues, Continued… GIF Files, Cont. GIF Formats: GIF87a (developed in 1987, single layering capability). GIF89a (developed in 1989, multi-layering capability). Most commonly used today. Transparent imaging a must in web design and development. Graphic Issues, Continued… JPeG ( .jpg) Files Joint Photographic Experts Group. High-quality complex imaging. Utilizes compression algorithms to make files “appear” smaller. Compression eliminates redundant information in order that the file take up less space The higher the level of compression, the greater the sacrifice in quality. Graphic Issues, Continued… JPeG Files, Continued… Best used for images or photographs that require a “natural” look. The higher the resolution, the more natural an image appears. JPeG compression can (and usually does) result in image rastering. JPeG Files are usually better for screen viewing, whereas GIF Files are better for printing because of their simplicity. Graphic Issues, Continued… File Size Three Elements of File Size: Physical image size. Resolution. Amount of colors associated with the image. Generally, the best way to cut down on file size is to limit the number of colors. 256 to 16 or 8 bit to 4 bit Mac uses 16 bit or “millions of colors.” Graphic Issues, Continued… File Size You MUST Optimize your images in PhotoShop or some other photo optimization utility. The goal is to learn and master the ability to manipulate file size, then learn compression methods (the easiest is to use the “Save for Web and Devices” option in the file menu of PhotoShop. Graphic Issues, Continued… Downloading Graphics Many ways to obtain graphics online. Click on a download link and the computer will prompt a “Save As” dialog box. “Cold” download or “right-click (long-hold on Mac).” Security issues Virus considerations and protection Graphic Issues, Continued… Legal Considerations Many legal issues must be considered when downloading copyrighted graphics Academic requirements are somewhat lax about permission, generally only requiring sources to be sited. This is entirely different for the commercial world. Copyright laws protect all reproducible data, and the internet is no exception. Graphic Issues, Continued… Legal Considerations, Continued. . . You MUST ask permission Before using someone else’s stuff. Not normally required or enforced for academic or personal use, but it’s a good idea to make it habitual. Once permission is received and construction of the site occurs, the graphic or data MUST be cited somewhere on your web page, giving credit where credit is due. . . Graphic Issues, Continued… Whenever in doubt, always play it safe and get permission. A simple or generic, non-trademarked graphic is probably exempt, but . . . Don’t use Mickey Mouse without Disney’s permission. Rule of thumb: “When in doubt, ask permission. . .” Graphic Issues, Continued… Graphic Differences Among Browsers Until recently, browsers treated graphic files significantly different. Caused severe problems for web developers and users as well, often forcing them to choose the “better” browser for their needs. No longer the case as intrinsic browser functions have been standardized by IEEE. Graphic Issues, Continued… Using Graphics Wisely Less is more! A busy web page = a bad web page unless that’s your niche. . . Four Rules for Graphic Use: 1) Select appealing, appropriate fonts. 2) Keep graphics simple, use only NEEDED graphics. 3) Keep file size small as possible. 4) Select or manipulate an image that speaks to the three colors you’ve selected for your overall site design. Keep the site simple. Busy sites are not revisited because they’re too confusing. Graphic Issues, Continued… Using Graphics Wisely, Continued. . . Thumbnail technique Drastically limits download time and allows more images per page. Use applet, scripts, or even image linking (<a href…>) to the “bigger” version if the user desires to see it in better detail. The typical method for this class (especially during assignment two) is to generate two version of the same graphic file – one larger, one smaller (the smaller serving as thumbnail). Tips for Effective Web Site Design The Basic Principles of Good Web Site Design: 1) Start small, letting the site take on a life of it’s own. “Test the Water” before making significant changes to the site. 2) Begin with an attractive, easy to understand “home” or “index” page. 3) Have a contact or email address for feedback Tips for Effective Web Site Design, Continued… The Basic Principles of Good Web Site Design, Continued. . . 4) Keep the opening page simple. 5) Post clickable icons and buttons in obvious locations; avoid complexity. 6) Link pages back to the Homepage (wagon wheel navigation) 7) Include a Search Engine on complex sites. Tips for Effective Web Site Design, Continued… The Basic Principles of Good Web Site Design, Continued. . . 8) Stay Consistent throughout. 9) Use Visually stimulating graphics/audio. 10) Stress interactivity. 11) Keep sales-pitches and advertising at a minimum (unless this is your focus). 12) Keep a balance between text, graphics, and audio. Tips for Effective Web Site Design, Continued… The Basic Principles of Good Web Site Design, Continued. . . 13) Make policy clear and available (privacy, etc. . .). 14) Always include email and contact information. 15) Link to other sites with caution. 16) Give visitors a reason to return. Update frequently, value-added content, etc. . . Evaluating a Website Evaluating a web site is measuring that web site’s success. Site evaluation = measurement of achieved goals and objectives. Site evaluation in great detail checks the integrity of each page and its functionality. Primarily to prevent major problems and technical glitches. Site evaluation requires clear, thorough, and systematic method. Rating system and statistical analysis. The Future of Web Site Design A Successful web site requires a strong online presence. In order to achieve a strong presence, the web requires imagination and creativity. A thorough “plan” should be in place before the first tag is written. Future Web Design will look more like Systems Analysis, using a SDLC. Assignment 3 Grading A couple of relevant changes, based on the text and the lecture: Use “Planning” to better help you in revamping your web site. The goal of this component of the assignment is to help you redesign and develop a brand new website based on what you learn in chap 8, etc. Create a Site Plan and turn it in by 5:00pm the date the assignment is due. Your Site Plan should be reflective of your work and not others; if it is determined that your site plan followed a template or format belonging to someone else, you will not receive credit for the assignment. In other words, do your own work. If you borrow a graphic from the web, email the owner of the image or site administrator (or whomever owns the site) for permission. Copy and paste both your email requesting permission – and the reply/response you receive in return – into your site plan; do so by including them as addendum components with your site planning pages. A3 will be graded using the scales on pages 309 and 311. The Internet and the World Wide Web • End Chapter 8, Part II.