Digital Pacific Company Blog

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

Posts Tagged ‘photoshop’

5 Professional Image Editing Programs

Monday, November 23rd, 2009

For those who have decided to be brave and attempt to code their own website, here are some additional tools (yes, there are plenty of tools to go around) to help you put the design into that site. These design tools will assist in creating more dynamic and creative layouts and themes by providing the ability to customise photos, graphics and icons to specific needs. Design tools should definitely be used in conjunction with coding tools in order to maximise the entire website building experience.

5 Professional Image Editing Programs Adobe Photoshop is a professional quality, high-end photo and graphics editing tool. Used by web designers, graphic designers, photographers and more, Photoshop is considered to be the leading image manipulation and editing software on the market. However, one might find the price tag a bit on the high side, keeping most users isolated to more serious or motivated designers. Photoshop runs on both Windows and Mac OS X. Photoshop can be used to manipulate photos and graphics that add to a website’s design, or it can be used to create the entire layout.

5 Professional Image Editing Programs
Inkscape is an open-source software used to edit vector images. Inkscape has many similarities and capabilities as with Photoshop and Corel Draw to name a couple, but it boasts being set apart from these other editors because of its ability to store the image as a scalable vector graphic (SVG). Inkscape runs on Linux, Windows, Mac OS X and even some Unix-like operating systems.

5 Professional Image Editing Programs Gimp, as stated on its website, is a “GNU Image Manipulation Program.” Gimp is perfect for touching up photos and even creating authoring tools, such as paintbrushes. Gimp gives you the same feel as if using Photoshop, or another fancy image editing tool, but it does so at no cost. Some features include the ability to edit animations, mass edit images or convert image formats. There are even a range of plugins and extensions to customize the tool to your needs. Created for Unix, this tool also runs on Windows and Mac OS X.

5 Professional Image Editing Programs
IcoFX has plenty of features to enable the easiest icon editing possible. With this program, you can create icons from imported images, work with PNG file formats and even run batch processing. Best of all, it is free to use. IcoFX unfortunately only runs in a Windows environment.

5 Professional Image Editing Programs
Greenfish Icon Editor Pro is another free icon editing program. It offers layer support and great filters to take these little images to a professional level. Greenfish Icon Editor is small and portable, meaning it can be installed onto a USB drive for use on the go.

Most of the tools mentioned above are available for free download and use, which is great when it comes to building your own website. Even if you are not building an entire site, these tools are perfect options for designing various other business related items, or for just managing your personal photos.

Are there any great design tools not listed here that you think should be? We are always happy to hear from our readers, so leave a comment and help build our list!

Additions to the List from Comments:

Aviary is a free, online editing system with programs to edit vector images, work with image markup, image editing and even audio remixing. Looks like another amazing tool.

Paint.NET is another free yet powerful software program that lets you work with features found in top programs, such as Adobe Photoshop.

Tags: gimp, greenfish, icofx, image editing, inkscape, photoshop
Posted in Webmaster | 5 Comments »

Preventing Image Theft with Watermarks

Thursday, September 24th, 2009

Did you know that anytime you put an image up on your website, you are opening yourself up to the risk of image theft? It’s true! It seems that nothing is safe in this world anymore, not even the images you use to showcase your products and services online. Just think about the time, and money, that went in to getting those little guys web friendly in the first place, and now someone else might be using your hard work to their benefit.

Fortunately, there are ways you can protect your website from image theft. Even though you can use a .htaccess file to restrict anyone trying to hotlink directly to your website’s images, there is still the risk that someone can download and re-upload the image to their website as his/her own. To combat this issue, we recommend to our clients the use of “water marking”, which is the process of adding a semi-transparent image over the top of any image.

As seen in the images above (click for a larger view), the watermark is the transparent image overlay of a domain name, business name or brand. Once applied to the main image, it provides a way for the image owners to prove it belongs to them. Because of the fact that the image now contains the information for someone else’s business or other endeavour, image thieves are less likely to steal or hotlink it. And, if they do, it just provides some free advertising back to your website or brand!

You, too, can add similar watermarks to your images by using some simple software, such as Picture Shark. The software is free and allows you to easily set the look and placement of the watermark before the final product is created. We suggest using your domain name as the watermark image.

For those using a content management system (WordPress & Drupal), there are plugins available to help speed up the watermarking process. The NextGEN Gallery, for example, offers WordPress users the ability to apply watermarks to their photo galleries, while Drupal users can take advantage of the Image Watermark module.

If you’re looking for a more customised process to add a watermark to your photos and help prevent image theft, there is always Photoshop. By using Photoshop, you can have more control over the look of your watermarks than with the previous standard processes. You can even Create a Photoshop Action to Watermark Your Images.

Of course, this doesn’t completely protect you from image theft. Web visitors can still right-click and save your images, but the great thing about the watermark is that if someone else does decide to use your image, your domain name or brand is always displayed. How’s that for a little free advertising?

Tags: drupal, hotlink, image theft, photoshop, Picture Shark, watermarks, wordpress
Posted in Webmaster | No Comments »

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.

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!