Web Design

As a web developer, I have  evolved into building sites that are an intricate maze of pages that allow the user to surf the site.  The idea is to provide multiple avenues to arrive to each page, which should be short to allow reading without much scrolling.  If the user needs to scroll, build another page.  Pages can be targeted for search engines.

But there are single page websites out there which have their place.  A nice example of this Seven Places Productions, a WordPress implementation with an elegant graphic design.  It is almost a one page site.  They cheat on “our services” by showing examples, which are separate posts.  But they use sliders to allow all the content to be on a single screen.

There are also less desirable solutions.  I shy away from sliders that move a long way, because it tends to make me dizzy.  Think Green Meeting is an example of this.  It is complicated to build, and I need to take seasick pills if I browse the whole site.

A single page site may work well if there is not too much content or too many pages (less than 10).  If graphic design is a premium, this could be a way to go.

I always felt that one page sites would compromise on SEO, but this may not be the case.  I’m not convinced, but Mayur Jobanputra in his blog, gives 6 reasons why one page sites offer advantages for SEO.  I have to believe, however, that a well structured website with many pages, cross-linked, will always do better than a single page site.

For simple sites that don’t need much content, there are creative ways to build a single page site and have it work to your advantage.  One page, however, does not necessarily translate to inexpensive.  The sophisticated graphic design (I particularly like the top right corner peeling away for recent sites) means the single page can cost at least as much as a multi-page site.

Transparent PNG files don’t always work in IE6.  A nice solution is outlined at http://bjorkoy.com/past/2007/4/8/the_easiest_way_to_png/ .  It has a nice solution using CSS and JS.

I implemented it at NYBoatcharter.com.

last time, used online tool on http://www.html-kit.com/favicon.

A favicon should be 16 X 16 pixels with 16 colors and the file name should be favicon.ico. IconEdit32 is a good freeware program that allows you to create favicons as well as icons of other sizes and color depths. IrfanView is an excellent freeware image viewer that supports the icon (.ico) image format. You can use it to shrink one of your regular images to a 16 X 16 size, then decrease the colors to 16 and save as a “.ico” file. I like to use IrfanView to get an image down to specifications, then edit it with IconEdit32. Remember, if you don’t save it as “favicon.ico,” it won’t work. Also, don’t just shrink an image to icon size and rename it with a “.ico” file extension. That won’t work either because it’s not a real icon file.

Installing a favicon on your website

Simply upload the file, favicon.ico to the root web directory of your hosted website with your favorite FTP program, Microsoft FrontPage, Dreamweaver MX or whatever. Make sure your favicon file is named “favicon.ico.” When someone bookmarks your site with a browser that supports favicons, your favicon will appear. Alternatively, you can use this code between the <head></head> (x)HTML tags:

<link rel=”shortcut icon” href=”http://www.thenameofyoursitehere.com/favicon.ico” mce_href=”http://www.thenameofyoursitehere.com/favicon.ico”/>

Where can I get favicons?

You can feast upon Clickfire’s collection of over 100 quality free favicons and download them for use on your website. To find out more about favicons, visit the definitive favicon site, Favicon.com.

Favicons with Photoshop

For a good tutorial on how to create favicons with Photoshop, check out the link below.  You need to download a plugin.

http://www.photoshopsupport.com/tutorials/jennifer/favicon.html

http://www.2createawebsite.com/build/hex-colors.html — put in Hex or RGB values and view color

http://meyerweb.com/eric/tools/color-blend — this will give ranges of colors between two.

http://www.web-source.net/216_color_chart.htm — This is a table which has a nice flow of colors

http://www.somacon.com/p142.php — This has a pretty extensive list of CSS colors.

http://www.321webmaster.com/hex-to-rgb.php — RGB to HEX color converter