Comparing Photoshop and GIMP for Web Design

The financial barriers to entry to most online pursuits are extremely low. It should never cost more than a few dollars to set up and maintain a website.

gimp vs photoshop

Web design is the same – you can edit code, HTML and CSS using free text editors. However, there is one expense that stands head and shoulders above the rest, and that’s image editors. Photoshop has been the market leader for well over 20 years.  And, whether you purchased it on it’s own, buy it as part of Adobe’s Creative Suite or, now, subscribe to Creative Cloud, compared to everything else, it’s pricey!

I have just created a course on Udemy called Designing A Website in Photoshop, Illustrator (& GIMP) (at a discount if you click that link). The course shows how you can create a pixel-perfect image of a WordPress website design, customised completely to a client’s specifications.

My clients like to see an image of their website home page designed in Photoshop first. Then, once this is passed, developing and creating the website is easy.

In the video, I do the same tasks in both Photoshop and GIMP. Although most things are possible in GIMP, things are generally easier and quicker in Photoshop.

The disadvantages of GIMP

These were the main drawbacks I’ve discovered using GIMP.

  • No way to select multiple layers
  • No way to apply same text styles to multiple text layers
  • Can’t add effects to editable text
  • No way to export images optimised for web (possible with plugin)
  • Buggy – it does crash occasionally
  • Hard to arrange layers – no ability to group layers as with Photoshop
  • Poor (or virtually nil) support for vectors

All the disadvantages can be overcome. By purchasing Photoshop you are spending money to buy yourself time and less frustration – that’s assuming you are familiar with Photoshop’s interface.

Designing A Website in Photoshop, Illustrator (& GIMP)

Here is the promo video for my new course on Udemy called Designing A Website in Photoshop, Illustrator (& GIMP) (33% discount if you click that link).

The course shows how I mock up a web page designs for a clients. Here is an example of one of the images I show how to create:

mock up website home page

What do you think?

Do you mock-up or design web pages in image editors first? What do you use, Photoshop, GIMP, Illustrator, or even Inkscape?

Did you enjoy the article? If so, please share!

Download my 2 free e-books and 2 free MP3s on running an online business & getting clients

Plus a list of my 12 favorite resources for online business

two free books and two free mp3s and a list of favorite online tools

Comments

  1. says

    Great stuff as usual Rob. I started with GIMP but recently couple of months back I started to use Photoshop. Now I can’t think of GIMP or go back to GIMP. :)

    • says

      Thank you for commenting, Mayu. Yes, if you’ve got Photoshop, you’ll prefer it to GIMP. But GIMP is a great second best if you don’t want to buy Photoshop. :)

  2. says

    I use Fireworks a lot here in my 9 to 6 work. I think Fireworks has great features that no other software have.
    The feature I like most it’s his “Pages” capability. I can have multiple pages of a site designeg within just one file. and each page has its own group of layer. The problem today is that Fireworks is out of the market.
    I’m starting trying Inkscape cause I’m a “vector minded person”. It’s free and I would recomend it to someone who is starting freelance.
    Anyway, every person has to try and choose what’s good for him.

    • says

      Hello Rodrigo, a lot of people preferred Fireworks for web design and they are so disappointed that is has been discontinued by Adobe.

      I’m going to be looking into Inkscape more soon.

      Thank you for the comment.

  3. says

    For a developer like me Gimp is a good fit (and free I like free). I tend todo basic stuff like resizing, cropping etc… Its ok at opening PSDs also but not able to access some of the features.

  4. Jatin says

    Well frankly speaking Photoshop is definitely a step ahead from Gimp.

    But if you just need a good program to crank up graphics for web and don’t need support for CMYK mode which is usually used in print design, Gimp is a solid alternative to Photoshop for web graphics.

  5. Paul M says

    Well, I just spent a while trying to work out how to put text on a page in GIMP. Ahaha! I think, there’s this “text editor”. Weird, not in-place, but heh… now I can enter text.

    WAIT! No I can’t Because if I try to type a character that’s assigned to a keyboard shortcut… BOOM!

    The GIMP has wasted a lot of my time this afternoon and I am currently in a state of loathing and borderline hatred.

    • says

      Paul, I googled this: Click on Edit> Preferences; Go to the “Interface tab”; Click on the “Remove all the Keyboard shortcut”; A small dialog shall open, click on the “Clear” button. Note that: to restore the use of Keyboard shortcut, simply click on the “Reset Keyboard shortcut to default value” button. Hope this helps!

Leave a Reply

Your email address will not be published.

Notify me of followup comments via e-mail. You can also subscribe without commenting.