I really enjoyed the web design class. Although I will never be a web site designer, I now know basics of web page design and how to apply the CRAP design principals. Many of the concepts and tools that we used in the class will really help be both personally and professionally. Personally, I hope to work with my wife to create a better site with more content. Professionally, it will help me give constructive criticism to our Tech Specialists – the people responsible for designing our individual school web sites. I found the Photoshop exercises and Photoshop book very helpful. I am certain that I will be able to apply the skills that I learned from both home and work.
Compare and contrast both sites:
I built my Frontpage 2003 site first, and I must say that it took much longer than the site that I built using webnode. If you really know what you are doing in Frontpage, or Dreamweaver for that matter, and you have artistic talents, then this is the way to go. Using an HTML editor really gives the designer the flexibility to fine-tune the web site’s design. An HTML editor allows the designer to build exactly what they want by using frames, tables, cell padding, cell spacing, custom colors, and custom fonts. The ability to cut, paste, and import HTML code is very helpful when using an HTML editor.
A con using an HTML editor is that it can be very time consuming creating a site if you are unfamiliar with the application. Another con is that may need to purchase the editor if a free apps don’t meet your needs. Another disadvantage over a Web 2.0 app, is that you must have the application loaded on computer to effectively manage your site (unless of course you are well versed in HTML).
I found webnode very easy to use, because of the drag-and-drop interface and the nice text editing tools. It also was easy to import pictures and it gave the ability to adjust the images after they were imported. Webnode has many attractive templates, which is important if you have no artistic talents – like me. A big advantage of using Webnode, is that you can modify and update your site from just about any Internet browser from anywhere in the world. Another advantage of webnode is that it gives you the ability to create an online store.
The only disadvantage that I see with webnode is that it doesn’t allow you to tweak the layout like an HTML editor. You can add and remove gadgets, but you are limited on how it’s applied to the overall layout; there are no padding or spacing options. I also didn’t like that webnode made all of the menu buttons in all caps. Don’t they know the basics of web design?
The two sites are very different in design and look. The content is pretty much the same, but that’s about it. Webnode didn’t have a template that matched the color scheme that use in FP 2003, so I had to go with another color and totally different theme. Thus I couldn’t use the Laminated Love logo.
I made several minor changes to my storyboard in the process of creating my sites. Overall, it was pretty similar; the design was pretty much the same, I just changed how the content was being organized – which changed all of the menu bars.
HTML site: I zip’ed my website and will send you the link to download it.
Webnode site: lamintedlove.webnode.com
Saturday, July 24, 2010
Creating FrontPage Site
The first thing was to come up with a name for my wife’s hobby/business – Laminated Love. Once we had the name, I created a custom Logo from a free heart image that I found on www.webweaver.nu. It’s obviously not that great, but after playing around with different fonts, colors, and layouts, I think I was alright.
After creating my sketched storyboard, I created a word document with the typed content that I planned on using for the web site. I then started using Dreamweaver to create my site, but I found it a little difficult to use since I wasn’t that familiar with the program. I didn’t want to abandon using Dreamweaver, so I looked online for some online Dreamweaver templates that might work. After a lot of searching, I only found one template that I liked, but the layout wasn’t perfect. I tried manipulating the template in Dreamweaver, but I just discouraged when I couldn’t really make the changes I wanted.
My next step was to install FrontPage 2003 (FP 2003), which I thought would be better since I was familiar with using it in class. However, since installing FP 2003, I started to have problems with explorer bombing-out whenever I tried to save word documents, Frontpage HTML files, and email attachments. Since I was away for the weekend, it made it quite difficult to get much done. I did make some changes to my storyboard, and I made some changes to written content of the web site.
When I got back home on Sunday, I spent a lot time taking pictures of the various samples my wife had, and I also went through 5 years worth of photos to get more content of her previous jobs. I found out how critical it is to have the right lighting when taking pictures of the candy bars, mints, and gift “baskets.” I then spent a lot time cropping and resizing the pictures in Photoshop so that the images could be used for the web.
Once in class on Monday I was able to work in FrontPage without any problems. I made a few changes to my web site design, and I picked a FP 2003 template that matched my color scheme of the Laminated Love logo. I did have to make a few color changes to logo in Photoshop to get a better color match. I then spent some more time resizing the photos I planned to use on the site. I did use the photo gallery in FP 2003 to import and adjust the images to be displayed, but in retrospect, I think that I should have just imported the pictures into tables to create a more customized layout.
After I got all of the pictures I wanted to use imported, I spent some time playing with the different font types, sizes and color. I found a purple heading font that matched “By Susan” in the logo, and I found that a black font for the text content of the page looked the best. After toying with the various fonts, I found that Verdana was a nice legible font for the site.
After tweaking the fonts, I adjusted the number of “pictures per row” and added columns on the left and the right of page to get a page layout that I liked. I also made a myriad of changes to the main page, which included adding/adjusting tables, pictures, and text, to try and get the best look. I then tweaked each page layout so that the spacing was about the same; this way when navigating to other pages on the web site it would match. On the main page I also downloaded free email and phone images and customized them in Photoshop.
After creating my sketched storyboard, I created a word document with the typed content that I planned on using for the web site. I then started using Dreamweaver to create my site, but I found it a little difficult to use since I wasn’t that familiar with the program. I didn’t want to abandon using Dreamweaver, so I looked online for some online Dreamweaver templates that might work. After a lot of searching, I only found one template that I liked, but the layout wasn’t perfect. I tried manipulating the template in Dreamweaver, but I just discouraged when I couldn’t really make the changes I wanted.
My next step was to install FrontPage 2003 (FP 2003), which I thought would be better since I was familiar with using it in class. However, since installing FP 2003, I started to have problems with explorer bombing-out whenever I tried to save word documents, Frontpage HTML files, and email attachments. Since I was away for the weekend, it made it quite difficult to get much done. I did make some changes to my storyboard, and I made some changes to written content of the web site.
When I got back home on Sunday, I spent a lot time taking pictures of the various samples my wife had, and I also went through 5 years worth of photos to get more content of her previous jobs. I found out how critical it is to have the right lighting when taking pictures of the candy bars, mints, and gift “baskets.” I then spent a lot time cropping and resizing the pictures in Photoshop so that the images could be used for the web.
Once in class on Monday I was able to work in FrontPage without any problems. I made a few changes to my web site design, and I picked a FP 2003 template that matched my color scheme of the Laminated Love logo. I did have to make a few color changes to logo in Photoshop to get a better color match. I then spent some more time resizing the photos I planned to use on the site. I did use the photo gallery in FP 2003 to import and adjust the images to be displayed, but in retrospect, I think that I should have just imported the pictures into tables to create a more customized layout.
After I got all of the pictures I wanted to use imported, I spent some time playing with the different font types, sizes and color. I found a purple heading font that matched “By Susan” in the logo, and I found that a black font for the text content of the page looked the best. After toying with the various fonts, I found that Verdana was a nice legible font for the site.
After tweaking the fonts, I adjusted the number of “pictures per row” and added columns on the left and the right of page to get a page layout that I liked. I also made a myriad of changes to the main page, which included adding/adjusting tables, pictures, and text, to try and get the best look. I then tweaked each page layout so that the spacing was about the same; this way when navigating to other pages on the web site it would match. On the main page I also downloaded free email and phone images and customized them in Photoshop.
Monday, July 12, 2010
My web site project
My web site is for my wife, and it is to showcase her artistic talents with wrapping candy, life savers, mints, water, and many other items. Initially I’ll just be showing many of the projects she’s done, but I believe that the long-term goal is to actually sell her products online.
I chose this as my project, because I feel that my wife has a real gift when it comes to creating favors for almost any occasion. She really enjoys doing her crafts, and I think that she can use this to make some extra “vacation” money,
As for the images for the site, I plan on creating the buttons with Photoshop, and the images are going to be pictures of the products my wife has to offer. Lastly, I will be using Adobe Dreamweaver from CS4 as my HTML editor.
I chose this as my project, because I feel that my wife has a real gift when it comes to creating favors for almost any occasion. She really enjoys doing her crafts, and I think that she can use this to make some extra “vacation” money,
As for the images for the site, I plan on creating the buttons with Photoshop, and the images are going to be pictures of the products my wife has to offer. Lastly, I will be using Adobe Dreamweaver from CS4 as my HTML editor.
Sunday, July 11, 2010
Week 5 Assignments
Chapter 13 gave some great tips on how to enhance a web site. Tables can assist in breaking-up the site into sections, and it allows you to format the text and pictures into the way you want. A great use of tables it to use “sliced” graphics as menu selections on the site. Slicing the graphics and adding animation really gives a nice visual effect and adds to the “coolness” to your site. Making minor adjustments to hue, saturation, and lightness is also a nice way to make your pictures stand out. I think that I will try to incorporate these features into my web site.
A common problem that people run into is the pixilation of smaller fonts because of anti-aliasing. To correct this, one can play around with the anti-aliasing settings in photoshop, just use an aliased font, retouch the fonts after they’ve been converted to a .jpg, or don’t even use the anti-aliasing feature.
I found it quite interesting on how to use the low-source proxy to show a lower resolution image quickly, and then to load a higher resolution picture for people with slower Internet connections. Another nice feature that I learned about in chapter 13 is the ability to add rollovers and image swaps to a site. A roller is when an image changes when mousing-over a menu item, whereas an image swap is when a new image is displayed when mousing-over a certain area on the web page. Both of these are pretty cool features to enhance a web site.
Another way to enhance a web site, but requires a lot more experience, is to use flash. Flash is used to add multimedia animation to a site. It uses a vector format to display the animation, and its steaming capability makes it much quicker to view animations. Flash animations are also much cleaner and sharper than raster format animations – which are used with gif animations. Flash is more scalable when it comes to adjusting the images, as they don’t lose much quality when changing the size of the image.
Chapter 14 went over how important it is to properly manage your web site – especially if it’s going to grow in size. Many of the web design applications such as FrontPage, Dreamweaver, and GoLive already have site management as a built-in product. Site management software really helps keep your files, images, and folder structure in order.
Another part of having a good web site is to properly test it. It should be checked for any broken links, for missing images, and it needs to be tested on some of the most common browsers, such as Internet Explorer, Firefox, Opera, and Safari. It’s good practice to test it by copying the folder structure of the site to another location on your hard drive.
When testing on different browsers, it’s common to find problems with spacing, how tables are displayed, graphics that are not appearing, and with broken links. When dealing with spacing problems and alignment problems, the use of CSS line spacing and adding transparent gifs can be very helpful. Another neat trick is to add characters to an area that needs spacing, and then to change the font color to match the background.
Before starting a web page, it is critical to ensure that you plan your site very carefully. And storyboarding is a valuable tool to use to plan your site. This will ensure that the web site meets your expectations, and the expectations of the visitors. Storyboarding makes sure you know who your audience is, what content is needed for the site, and it helps you build the structure of your web site. It helps you organize “chunks of data” into a structure that makes sense. A flowchart should be used in this process to assist in the overall design of the site.
A common problem that people run into is the pixilation of smaller fonts because of anti-aliasing. To correct this, one can play around with the anti-aliasing settings in photoshop, just use an aliased font, retouch the fonts after they’ve been converted to a .jpg, or don’t even use the anti-aliasing feature.
I found it quite interesting on how to use the low-source proxy to show a lower resolution image quickly, and then to load a higher resolution picture for people with slower Internet connections. Another nice feature that I learned about in chapter 13 is the ability to add rollovers and image swaps to a site. A roller is when an image changes when mousing-over a menu item, whereas an image swap is when a new image is displayed when mousing-over a certain area on the web page. Both of these are pretty cool features to enhance a web site.
Another way to enhance a web site, but requires a lot more experience, is to use flash. Flash is used to add multimedia animation to a site. It uses a vector format to display the animation, and its steaming capability makes it much quicker to view animations. Flash animations are also much cleaner and sharper than raster format animations – which are used with gif animations. Flash is more scalable when it comes to adjusting the images, as they don’t lose much quality when changing the size of the image.
Chapter 14 went over how important it is to properly manage your web site – especially if it’s going to grow in size. Many of the web design applications such as FrontPage, Dreamweaver, and GoLive already have site management as a built-in product. Site management software really helps keep your files, images, and folder structure in order.
Another part of having a good web site is to properly test it. It should be checked for any broken links, for missing images, and it needs to be tested on some of the most common browsers, such as Internet Explorer, Firefox, Opera, and Safari. It’s good practice to test it by copying the folder structure of the site to another location on your hard drive.
When testing on different browsers, it’s common to find problems with spacing, how tables are displayed, graphics that are not appearing, and with broken links. When dealing with spacing problems and alignment problems, the use of CSS line spacing and adding transparent gifs can be very helpful. Another neat trick is to add characters to an area that needs spacing, and then to change the font color to match the background.
Before starting a web page, it is critical to ensure that you plan your site very carefully. And storyboarding is a valuable tool to use to plan your site. This will ensure that the web site meets your expectations, and the expectations of the visitors. Storyboarding makes sure you know who your audience is, what content is needed for the site, and it helps you build the structure of your web site. It helps you organize “chunks of data” into a structure that makes sense. A flowchart should be used in this process to assist in the overall design of the site.
Sunday, July 4, 2010
Answers to the questions
Computers and software have enabled individuals to become one-person operations with an Internet connection and a laptop – as has web site design. I don’t think that it’s always a good thing, but I definitely think that the pros outweigh the cons. The pros are that it doesn’t cost much to create a web site, and therefore people all over the world can post pictures of their family, hobbies, or other interests they may have. In many cases these sites may be poorly designed, but look at the audience, and I’m that most people are not that concerned about this. When it’s that easy to create web pages, it also gets many more ideas out on the web, and can get creative people recognized. This creativity and/or entrepreneurship can help people make a living. Another pro is that it’s fairly cheap for businesses to have a presence on the web (but depending on the design on the site, this may be a con). On the con side, you could also have people create these business sites that look legitimate, when in fact they may be trying to rip you off. Another con might be that a very good company out on the web might have a very poor web site, and they could lose business because of a potential client never wanting to contact or use the business because of how the person portrayed the company – based on the web site.
The advantage of creating your own web site is that it will cost you a lot less money than paying someone else to do it. However, if you are not that artistic, and the site is for your business you may want to consider spending the extra money to create the site – as the site is a reflection of your business. If you have a poorly designed site, this may steer potential customers away from your business and site. In the end, it all depends how the site will be used.
The difference between usability and accessibility is that usability is how easy it is to navigate a web site, whereas accessibility is the ability of the web site to be accessible for people with disabilities. To make a site “highly accessible,” one needs to ensure that a person with disabilities has a good user experience when accessing the site. People with disabilities use screen readers, and therefore to have a good accessible site means that the web page titles, alt text for images, and other things on the web site to make effective use of the screen readers.
The advantage of creating your own web site is that it will cost you a lot less money than paying someone else to do it. However, if you are not that artistic, and the site is for your business you may want to consider spending the extra money to create the site – as the site is a reflection of your business. If you have a poorly designed site, this may steer potential customers away from your business and site. In the end, it all depends how the site will be used.
The difference between usability and accessibility is that usability is how easy it is to navigate a web site, whereas accessibility is the ability of the web site to be accessible for people with disabilities. To make a site “highly accessible,” one needs to ensure that a person with disabilities has a good user experience when accessing the site. People with disabilities use screen readers, and therefore to have a good accessible site means that the web page titles, alt text for images, and other things on the web site to make effective use of the screen readers.
Chapters 3 and 4
Chapter 3 reviewed the basics of creating web pages. The beauty of creating your own web page is that anyone can view it from anywhere in the world from a computer, smartphone, gaming concole, or an MP3 player/iPod. Its very simple to do, especially when using web authoring software packages like Dreamweaver, FrontPage, Mozilla Composer, and NetObjects Fusion.
Although it’s easy to create a web page, good design is very important. One should be very careful with the layout of the page, fonts, colors, backgrounds, graphics, layers, and frames. The book emphasizes that if you are a beginner, that you should start out small and simple and build on things one you have more experience. It’s good practice to make the site easy to read and easy to navigate.
Table and frame are nice to use, but don’t overdo it. Tables and frames are often confused with one another, but can be easily distinguished by checking to see if the “frame” stays in the same place when navigating the web page. If the whole page moves, it’s a table, and if there are stationary areas on the site, it’s a frame.
Chapter 4 reviews how important it is to keep your web site well organized. To do this, you need to have a good layout for your file structure, and then stick to good naming conventions; use lowercase letters, use letters or numbers, never use a space, the web pages should always end it htm or html, don’t make the file names too long, and ensure that the correct file extension is used for the files.
It’s also good practice to use a naming convention for your files so that it’s easy to find and manipulate the files. Be consistent when creating folders too, and ensure that the web page is updated when renaming files and folders – you don’t want to have a web site with broken links!
Web sites are hosted on web servers, and they are usually maintained by ISPs and larger companies/organizations. A URL, such as http://gizmodo.com/5411442/the-best-gadgets.htm, contains the protocol (http), the domain (gizmodo.com), the folder on the server (/5411442/), and the thml file that the browser it looking for (the-best-gadgets.htm).
Many ISPs provide you with some web space to create your own web page, but sometimes the don’t provide much disk space, or the domain name and link is difficult to remember. It’s easy to just register your own domain, and it’s fairly inexpensive too. There are plenty of companies that sell domain names, such as Network Solutions, the Internic.net, and GoDaddy.com.
When preparing to create your web page you need to know your audience, you need to make an outline of how you think the site should look, and you should keep a folder with all of your materials for creating the site. Planning and organization is key to creating an effective web site.
Although it’s easy to create a web page, good design is very important. One should be very careful with the layout of the page, fonts, colors, backgrounds, graphics, layers, and frames. The book emphasizes that if you are a beginner, that you should start out small and simple and build on things one you have more experience. It’s good practice to make the site easy to read and easy to navigate.
Table and frame are nice to use, but don’t overdo it. Tables and frames are often confused with one another, but can be easily distinguished by checking to see if the “frame” stays in the same place when navigating the web page. If the whole page moves, it’s a table, and if there are stationary areas on the site, it’s a frame.
Chapter 4 reviews how important it is to keep your web site well organized. To do this, you need to have a good layout for your file structure, and then stick to good naming conventions; use lowercase letters, use letters or numbers, never use a space, the web pages should always end it htm or html, don’t make the file names too long, and ensure that the correct file extension is used for the files.
It’s also good practice to use a naming convention for your files so that it’s easy to find and manipulate the files. Be consistent when creating folders too, and ensure that the web page is updated when renaming files and folders – you don’t want to have a web site with broken links!
Web sites are hosted on web servers, and they are usually maintained by ISPs and larger companies/organizations. A URL, such as http://gizmodo.com/5411442/the-best-gadgets.htm, contains the protocol (http), the domain (gizmodo.com), the folder on the server (/5411442/), and the thml file that the browser it looking for (the-best-gadgets.htm).
Many ISPs provide you with some web space to create your own web page, but sometimes the don’t provide much disk space, or the domain name and link is difficult to remember. It’s easy to just register your own domain, and it’s fairly inexpensive too. There are plenty of companies that sell domain names, such as Network Solutions, the Internic.net, and GoDaddy.com.
When preparing to create your web page you need to know your audience, you need to make an outline of how you think the site should look, and you should keep a folder with all of your materials for creating the site. Planning and organization is key to creating an effective web site.
Monday, June 28, 2010
Evaluating Websites
The articles on evaluating websites gave a lot of insight on evaluating web sites, and what criteria to use when doing evaluations. From the various sites, it is clear that authorship, currency of the site, objectivity, meeting the intended purpose, supporting their purpose, and using external references are important things to consider when evaluating sites.
This first site that picked to evaluate this week is the Nazareth Area High School web site, hs.nazarethasd.org. I found a lot of problems with this site. First off, the site is not made for monitors using 800X600 resolutions and therefore a visitor, even when using a much higher resolution, must scroll horizontally and vertically view this site. Secondly, there is very little important information that is given on the page without having to scroll; plus a visitor has to page-down 6 times to get to the bottom of the site. The main page also way too many links, and too much unneeded information – it’s just much too cluttered. There is some contrast, but it’s not used effectively; in fact, it’s really difficult to see the contrast since you need to page-down several times to view the page. There’s also no uniformity to the frame used on the left side of the page; some links try to keep the frame to navigate the site, but others are completely different. I also found couple of links that don’t work.
The good things are: that it shows who the authors are (but it doesn’t tell how to contact them); it is pretty current (shows the end of school is here and it makes-note of the 4th of July); and it’s geared towards parents and students.
The other site that I reviewed was the Lower Nazareth Elementary website, lne.nazarethasd.org. This is a much better site than the High School site, but it still has some major issues. It too is not geared towards the 800X600 resolution and therefore one still needs to scroll to get to the pertinent information. One major problem that I found was that when viewing the main page in Firefox, the menus didn’t work. I found the navigation bars a nice feature, but it should really how which submenu you are on when using the menu. Also, many of the links don’t show where the hyperlinks go.
The good things that I found with this site were that it was easy to find who does the site, and how to contact the person. I also liked the use of chalkboard, the graphics, some of the flash animation. It is also up-to-date, and it is definitely geared towards elementary students and their parents.
As far as applying this information to my site, I think that I plan on learning from their mistakes -- especially when it comes to the High School website. I plan on going with a simpler design with not much clutter; and I’ll try to use better contrasts. From the Lower Nazareth Elementary site, I learned that I like the navigation menu and I might use something similar on my site – however, I’ll ensure that it works in IE, firefox, opera, and safari.
This first site that picked to evaluate this week is the Nazareth Area High School web site, hs.nazarethasd.org. I found a lot of problems with this site. First off, the site is not made for monitors using 800X600 resolutions and therefore a visitor, even when using a much higher resolution, must scroll horizontally and vertically view this site. Secondly, there is very little important information that is given on the page without having to scroll; plus a visitor has to page-down 6 times to get to the bottom of the site. The main page also way too many links, and too much unneeded information – it’s just much too cluttered. There is some contrast, but it’s not used effectively; in fact, it’s really difficult to see the contrast since you need to page-down several times to view the page. There’s also no uniformity to the frame used on the left side of the page; some links try to keep the frame to navigate the site, but others are completely different. I also found couple of links that don’t work.
The good things are: that it shows who the authors are (but it doesn’t tell how to contact them); it is pretty current (shows the end of school is here and it makes-note of the 4th of July); and it’s geared towards parents and students.
The other site that I reviewed was the Lower Nazareth Elementary website, lne.nazarethasd.org. This is a much better site than the High School site, but it still has some major issues. It too is not geared towards the 800X600 resolution and therefore one still needs to scroll to get to the pertinent information. One major problem that I found was that when viewing the main page in Firefox, the menus didn’t work. I found the navigation bars a nice feature, but it should really how which submenu you are on when using the menu. Also, many of the links don’t show where the hyperlinks go.
The good things that I found with this site were that it was easy to find who does the site, and how to contact the person. I also liked the use of chalkboard, the graphics, some of the flash animation. It is also up-to-date, and it is definitely geared towards elementary students and their parents.
As far as applying this information to my site, I think that I plan on learning from their mistakes -- especially when it comes to the High School website. I plan on going with a simpler design with not much clutter; and I’ll try to use better contrasts. From the Lower Nazareth Elementary site, I learned that I like the navigation menu and I might use something similar on my site – however, I’ll ensure that it works in IE, firefox, opera, and safari.
Chapters 7 and 8
Chapters 7 and 8 are all about designing a site that looks nice and is easy to navigate.
Interface design is a very important part of your webpage. It can make or break your web site. The interface is how your site looks, and how to navigate the site, and how one interacts with it. To have a nice interface, one needs to have a plan on how their site should look – and start simple and build from there. It’s a common mistake to over-think or over-do the design, so sometimes simple is better.
When designing a web site, one needs to ensure that the site is viewable by many different types of browsers and screen sizes. The site should use a 800X600 resolution, and it’s imperative that the site fits on the screen, horizontally. If you can’t get it doesn’t fit vertically, just ensure that all of the important information is displayed on the web page without having to scroll.
Use good design and styles to make navigation of the site fun and easy. The site should be easy to navigate between the pages quickly and easily with-out confusing the visitor.
Some Dos:
Make it easy to navigate
Use fonts that are easy to ready
Use contracts effectively. Fonts, graphics, and backgrounds should match.
Some Don'ts:
Don’t make the site too cluttered
Don’t over design
Don’t use large graphics that take long to download/view
Ensure you don’t have to scroll the frames
Don’t over-do the frames.
Interface design is a very important part of your webpage. It can make or break your web site. The interface is how your site looks, and how to navigate the site, and how one interacts with it. To have a nice interface, one needs to have a plan on how their site should look – and start simple and build from there. It’s a common mistake to over-think or over-do the design, so sometimes simple is better.
When designing a web site, one needs to ensure that the site is viewable by many different types of browsers and screen sizes. The site should use a 800X600 resolution, and it’s imperative that the site fits on the screen, horizontally. If you can’t get it doesn’t fit vertically, just ensure that all of the important information is displayed on the web page without having to scroll.
Use good design and styles to make navigation of the site fun and easy. The site should be easy to navigate between the pages quickly and easily with-out confusing the visitor.
Some Dos:
Make it easy to navigate
Use fonts that are easy to ready
Use contracts effectively. Fonts, graphics, and backgrounds should match.
Some Don'ts:
Don’t make the site too cluttered
Don’t over design
Don’t use large graphics that take long to download/view
Ensure you don’t have to scroll the frames
Don’t over-do the frames.
Sunday, June 20, 2010
Chapters 9,10 & 12
Chapter 9 was a good review on color and the differences between CMYK (printing) and RGB (monitors/video).It’s very important to use the RGB mode when posting on the web or when the image is being view on a TV/LCD/monitor. Also, CMYK is a reflective color model and RGB is not.
Chapter 12 went over how important it is to ensure that your web site is easy to read and legible. This is all done by choosing the proper type of font, font size, a font that is cross -platform, and knowing how the web page will appear on various browsers and OSs.
Cascading Style Sheets is quite interesting, and although I'm not sure that I completely understand it, it seems like it's very powerful. I believe that it's used by web designer to easily apply formatting to an entire web site or just individual pages on a web site. I guess it's kind of like a template. It can apply default browser styles, imported styles, linked styles, embedded styles, and inline styles. This form of "programming" can really simplify the tweaking of a web page.
Some things to keep in mind when creating web pages:
- Use color effectively by using creating contrasts – however this may take a little experience to master this.
- Use indexing when manipulating images to save space.
- Don’t over do it when using images. Use a good combination of ppi and color quality to post to your web page. Usually images should be between 72 or 96 ppi and should be able to display in a browser-safe color – although many newer monitors support more than an 8-bit display.
- If possible, crop images to reduce image size.
- For photo images, use the .jpg format and play with quality to see what works best.
- For banners or pictures with flat colors, use the .gif format to save the image, and also play with the quality to see what looks the best without having a huge file.
- using anti-aliasing for better/smoother images
- adding thumbnails, so the person doesn’t have to download a larger image if they don’t want to
- using image maps (a graphic with links on it) so that people with a slow internet connection can navigate the site easily
- adding alternate labels to show graphics will be displayed (also helpful for people with slow internet connections
Chapter 12 went over how important it is to ensure that your web site is easy to read and legible. This is all done by choosing the proper type of font, font size, a font that is cross -platform, and knowing how the web page will appear on various browsers and OSs.
Cascading Style Sheets is quite interesting, and although I'm not sure that I completely understand it, it seems like it's very powerful. I believe that it's used by web designer to easily apply formatting to an entire web site or just individual pages on a web site. I guess it's kind of like a template. It can apply default browser styles, imported styles, linked styles, embedded styles, and inline styles. This form of "programming" can really simplify the tweaking of a web page.
