Digital Pacific Company Blog

Useful tips on web design, hosting, marketing and more…

Posts Tagged ‘favicon’

10 things you should do just before your website goes live

Tuesday, June 15th, 2010

There’s nothing quite like launching a new website. It could be days, weeks or months in the making. Hours may have been spent combing through each and every word, perfecting the message sent across to visitors. Even more time might have been spent playing around with colours and image placement. You may think you’re ready to go live, but are you really?

Any webmaster knows there are a lot of little details that need to be looked at when putting a website up, including everything from checking the links to onpage SEO. With so much on your plate, it is easy to forget a thing or two, so here is a handy list that can be used as a reminder.

1. Create a Favicon.ico

A favicon rounds out a website’s image, providing the tiny icon that can be found in your saved bookmarks, and at the top of browser tabs. Imagine the little “t” for Twitter and the “f” for Facebook. You can create a favicon of your own, and this tutorial will tell you how to do it.

2. Research your website’s colours.

You may not realise how much your website’s colours can impact a Web visitor’s experience until you read the Choosing Website Colours guide. There is definitely more to consider in regards to your palette when you think about your target audience and the cultural meanings of colours.

3. Check your links.

Broken links are links that take you nowhere. The page can either not be found, or it never existed in the first place. The most common cause of broken links is a simple misspell, but sometimes websites switch things around, or simply close down. You should use the W3C Link Checker from time to time to make sure your links are active.

4. Validate your website.

Beyond checking links, it is imperative to check your website’s code and CSS. Simply access the W3C website and type in your URL to see if your site is up to standards.

5. Check your website in all browsers.

The joys of a multi-browser world: what looks good in one, might look completely different in another. It would be a shame to come to this realisation just before launch, so it is always best to check your work from the beginning. You can read more in this article about browser compatibility.

6. Create a robots.txt file.

A robots.txt file is located on your server and tells the search engine bots which pages to crawl (and index), and which to avoid. So, if you want non-pertinent webpages, like login pages ignored by the search engines, then this is the place to specify that. Use this guide to create a robots.txt file of your own.

7. Prevent image theft with watermarks.

If you spent a lot of time and effort getting the perfect images put together for your website, you might want to protect those images by using watermarks. In this way, if people do decided to steal your images, at least it has your watermark on it for some free marketing.

8. Set up your forms to use CAPTCHA.

Spam emails and comments that result from your website can be a huge time drain, and there’s nothing more frustrating than not being productive with your work. CAPTCHA helps to make sure the person leaving the comment or sending the email is not actually a spam bot. Read more about CAPTCHA in the article, Beating Website Spam.

9. Check your onpage SEO.

When it comes to SEO, the basics that should be addressed from the beginning include the title, meta description and meta keywords to name a few. However, SEO is not a one-time activity; the process of optimising a website for the search engines is ongoing. Get some tips and ideas in our DIY SEO Hints and Tips page.

10. Make sure you’re not driving website visitors away.

A while back, we produced a humourous blog posts about all the ways you can make visitors never want to return. Although satirical, it is always a good idea to double check and make sure you’re not committing any of these website crimes.

Get these right, and you’ll be 10 steps closer to a successful website launch. Is there anything we missed that would be helpful? Leave us a comment!

10 things you should do just before your website goes live 10 things you should do just before your website goes live 10 things you should do just before your website goes live 10 things you should do just before your website goes live 10 things you should do just before your website goes live 10 things you should do just before your website goes live 10 things you should do just before your website goes live 10 things you should do just before your website goes live 10 things you should do just before your website goes live

How To Create a Favicon.ico

Thursday, April 30th, 2009

Part of the branding process for a popular website involves having a recognisable image, whether that be through a logo design or website theme and colour scheme. You might even notice when navigating your bookmarks or browser tabs that many websites, like Twitter and Digital Pacific, have that ever-so-tiny favicon.ico image present. Favicon.ico actually stands for favourite icon, and now you can make your own, further pushing your own brand, by following these simple steps.

How To Create a Favicon.ico

Step 1: Create a tiny image, 16 x 16 pixels to be exact. Yes, it is tiny, so make it as simple as possible while also making it clear to web users that it is in fact for your website. For tips, browse some of your favourite websites taking note of the image designs they went with, noting what works and what doesn’t. The image file can be created in either Photoshop, or by using a favicon conversion of a normal picture.

a) When using Photoshop, one can actually install a plugin that allows Photoshop to export to the .ico (Windows Icon) file format. This plugin can be installed from this website. Using Photoshop has its advantages because it also allows you to work with a larger canvas, such as 64 x 64 pixels, and resize without much image distortion. Try many different techniques before choosing your final product. The favicon file might be enhanced by simplifying or sharpening more than normally expected. When happy, save your file in the favicon.ico format.

b) In order to use a favicon created from a normal image, you will need to run it through an image generator. Be careful when using this process as some favicon.ico generators create some horrible looking images. Take into account that the output will still only be 16 x 16 pixels square, so anything too terribly intricate might look like a blob in the end. The best way to go about this process would be to use the favicon.ico Generator site. This website simplifies the process significantly by letting you upload an image file and then tweak it on the screen to create the optimal output level.

Step 2: Once you have the favicon.ico file on your computer, it is time to upload it to your website. This file must be placed into the same directory that contains your index page file, most often in the root.

Step 3: A line of code must now be placed in the header of the pages you would like the favicon.ico image to load with. Somewhere in between the <head> and </head> section, place this line:

<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />

*To complete this process, you may need to contact your web designers for assistance unless you are directly responsible for updating the code of your website design.

Step 4: Pull up your website in a browser of your choice to see your new favicon in action. If the image does not show up, you may need to refresh or clear the cache.

If unhappy with the outcome, start over and make changes as necessary. Otherwise, enjoy the new addition to your web branding experience!

How To Create a Favicon.ico How To Create a Favicon.ico How To Create a Favicon.ico How To Create a Favicon.ico How To Create a Favicon.ico How To Create a Favicon.ico How To Create a Favicon.ico How To Create a Favicon.ico How To Create a Favicon.ico