smash_it for Fireworks

by cdwise 4. October 2008 07:07

Here at Webmaster Jam Chris Heilmann showed this lovely Firefox extension smush-it.com that will optimize images on any web page. It does not change image quality but reduces file size by taking out the information a camera, or graphics editor adds to images for its own use. Kewl, the first new tool I will add from this conference.

Tags:

Web Design

Website Dos and Don'ts

by cdwise 31. August 2008 12:35

Today I was looking at some of my old articles and realized that just because I wrote something a few years ago doesn't mean that it has lost its relevance to today's Internet. A prime example is an article I wrote almost five years ago called website dos and don'ts as part of a presentation I did to the Houston Area League of PC Users (http://www.hal-pc.org).

I'm going to repeat my article below with a few annotations (in purple):

What your site should always have:

A Domain Name: In an ideal world you would have your business name as your domain name.
Unfortunately that isn't always possible since the same name maybe used by more than one business. If you can't get the exact business name try variations that may include you geographic location such as BusinessNameHouston.com or BusinessNameTexas.com.
While having the .net name or one of the soon to be released Top Level Domain names such as BusinessName.net, BusinessName.us (country code) or BusinessName.biz maybe an acceptable alternative most people expect a business to have a .com extension.

A homepage that loads quickly. The main Web page for a business should load in 10-15 seconds or less.The biggest mistake made by new businesses on the net is trying to impress customers with a fancy, super-duper all-action web page that takes 10 minutes to load. Problem is, after the first 30 seconds your potential customer is gone! He or she is off surfing a competitor's page.
Only after you have captured a customer's interest, you can get a little fancier on your internal pages. Customers will wait longer once you have their attention. If your page will take longer than 30-45 seconds to load make sure that enough of the page loads during that time so that the customer can see that it is worth waiting for. Bandwidth can kill you! Just because it loads quickly on your high speed broadband connection don't expect your customer's to have the same quality connection. Remember that many people are using cellular devices such as iPhones, Blackberries and Windows Mobile phones to access the web. Optimize your site for a connection no faster than 40kb or to be safer still 28.8kb.

Contact information: If the customer can't find out who you are, where you are physically located and how to reach you by telephone and email the customer is not likely to have enough confidence in your company to do business with you. If this information is not on every page of your site a link to it should be.

Effective Site Navigation: Your site needs to be well organized and easy to navigate so that your customer or potential customer can find out the information they need to do business with you.
Simple, descriptive links that tell the customer where to find the product information, full description, price and any other information you would like to know before placing an order make doing business with you a pleasure. Customers who can't find what they are looking for within 3-4 clicks will click their way right off your site and over to a competitor.
Keep a link back to your home page on every page of your site. Give serious consideration to keeping the main category links available on each page as well.

Product Pictures: If you are selling products as opposed to services you should provide good clear pictures. Start with a small thumbnail photo and link it to a larger picture that will provide clear detail. Pictures should be optimized to load quickly but still maintain sharp quality. There are many creative but quickly loading photo galleries and other techniques such as lightboxes that give you options not available even 2-3 years ago, use them.

Appropriate Meta Tags: Carefully drawn up keywords and site description so that you attract those visitors looking for products and services your business provides. "Hits" on your website are not the goal. Being found by customers and potential customers is what your site is there for, properly crafted meta tags and page titles help reach that goal. Meta keywords are not as important as they used to be but as long as you don't try to stuff everything under the sun in them they may still be useful, if only to help you focus on what the page is about. Some search engines will display your description text so if you use the description meta make sure it is accurate.

Accessibility & Compatibility: Make your site friendly to those who are not using the "latest and greatest" technology. Also, consider those who use alternative devices to access the Internet whether it is a screen reader for the visually impaired or a net appliance for the "technology challenged".
Check your site for compliance with Section 508 of the American's with Disabilities Act, especially if you do business with the government or want to do business with any branch of the government.
Check your site in different web browsers and at different screen resolutions. While the most common screen resolution at this time is 800x600 screen resolutions can range from 544x372 (WebTV) to 1600x1200. While the vast majority of people are using version 4+ browsers it still pays to take a look at your site in at least Internet Explorer 5/6 and Netscape 4.x/6 to see how your customer maybe seeing your site. Depending on your target audience you may also want to view it in AOL and/or on one of the web appliances such as WebTV or AOLTV.

What a business site should not have:

Use A Free Hosting Service: Having a url like http://tripod.com/~businessname not only give you an unprofessional appearance after all how successful can a company be that can't even afford $15 $8 to register a domain name) but the advertising required by the free hosts are designed to take visitors from your site to someone who had paid the free host to send them customers. It could even be a direct competitor of your business.

"Cool Stuff" that serves no direct purpose on your website, such as: Sound: Unless sound is an essential part of your business sound does not belong on a business website. If you have a business reason for using sound, do not have it start automatically on page load. At a minimum give visitors the option to turn the sound off without having to turn off their speakers.

Animation: Excessive animation has several drawbacks. It has a bad effect on page load times. Why not?

  • It is associated with off site advertising.
  • It distracts visitors from other usually more important content on the page. There are exceptions which include small carefully selected and targeted animations appropriate to the company's business or part of the website's logo.

*Exception:Used sparingly animations can be an effective tool but used inappropriately they give an unprofessional business image.

Background: Busy or bright colored backgrounds can interfere with getting your message across to your customer. In most business sites the message is in the text. This doesn't mean that you have to stick to black text on a white background. Just make sure that the text is clear, easy to read and that the background does not significantly increase the load time of the page.

Multimedia: While a fancy introduction can be "cool" consider the following before adding animation to your site: Why you are using multimedia?

  • Does it serve a valid business Is it there "just because you (or your webmaster) knows how to do it?
  • Is that java wave applet really appropriate to your company's business service or product line?
  • Remember the golden rule about download times, if the application or multimedia doesn't serve a useful functional purpose think carefully before putting it on your site.

If the application does serve a business function then load it via link that provides a clear description of what will be loaded including what technology is need to view it such as Flash 4/5 player, Real Media Player, Windows Media Player, QuickTime, etc..

Small Fonts and Wide Pages: The screen does not have the same resolution as paper and small fonts are difficult to read. Remember the different screen resolutions available? What looks fine to your 20 something webmaster on his 19" digital monitor at 1024x768 maybe unreadable on your customer's 3 year old 15" 800x600 monitor especially when the customer has to continually scroll side to side in order to attempt to read the line of text.

So what do you think? Are the guidelines above still relevant?

 

Technorati Tags:

Tags:

Web Design

Expression Web relative vs document links

by cdwise 21. July 2008 02:26

Life with Expression Web would be much simpler if Expression Web supported root relative links properly.

I am seeing where people are using third party generators to create menus for their website. Then they want to put these menus into their Expression Web site.

In order for your menu links to work regardless of what level in your site the requesting page is at you need to use what is called root relative links. That means that when the page is requested it is resolved based on the root level of your website instead of where the the page requesting the link is located. Take a site that has a root, two folders: articles and products with additional folders and pages in each of those folders.

site1

This means if you have a page in the "articles" folder in your site and the link goes to the "products" section Expression web using document relative links would create a link like "../products/page.html".

Translated the path means go up one level from "articles" then over to "products" and send the page.html to the browser.

With a root relative link it would look like "documents/page.html" without the ".." since it is instructing the server to go to the root and send the page.html in the documents folder.

If you had a folder in articles that was named 2008 and had a page named july-20.html and wanted to go to the documents/page.html the document relative path would be "../../documents/page.html" while the root relative path would stay the same as in the earlier example of "/documents/page.html".

The problems with document relative roots if the links are in a server side include page or are embedded in JavaScript that are generated using document relative links with root level of the site as the base is when you are on the "articles/2008/july-20.html" and the path from the page is "products/page.html" the server will be trying to find a the page at "articles/2008/products/page.html" because it is looking for a path that starts from the requesting page.

For links it is easy enough to modify the links created by the their party tool (assuming it doesn't support root relative links natively since many do).

Tags:

Expression Web | Web Design

Google & Flash

by cdwise 17. July 2008 04:52

Some of you may have read the announcement not long ago that Google would now be able to index Flash files. Some said that meant HTML sites were dead and Flash would become "de rigour". Something I disagreed with for a wide variety of reasons not the least of which was a strong "wait and see" attitude towards how well Google would be able to implement indexing of Flash content.

Seems that I might have been right to be skeptical that Google would get everything in Flash, at least if you read what they have to say over on Sitepoint. http://www.sitepoint.com/blogs/2008/07/16/google%e2%80%99s-flash-indexing-disaster/ 

While it may not be quite the disaster they are painting it certainly does seem that Google was a mite premature in their implementation and documentation.

Technorati Tags: ,

Tags:

Web Design

Expression Design

by cdwise 9. May 2008 00:32

Okay I normally limit my posting to Expression Web, general web design-development or Dreamweaver but thought I'd mention some graphic topics for a change.

First, the Expression Design team has started putty tutorials -video blogs in then blog at http://blogs.msdn.com/xdesignsupport/default.aspx

Next, I see people asking how attach text to a path. Since Fireworks is the image program I use most I found this tutorial worthwhile http://www.tommylogic.com/tutorial-blog/web-design-tutorials/39-web-related/66-fireworks-text-shape-tutorial

Finally, something I find myself needing to to is remove backgrounds from images. This is the best tutorial I know of for using Fireworks to remove the background http://www.tommylogic.com/tutorial-blog/web-design-tutorials/39-web-related/66-fireworks-text-shape-tutorial

Tags:

Training | Web Design



Outstanding Hosting