Hacker News Reader

Comment by natesm | Hacker News Reader

I'd consider Illustrator instead. It's vector based, it's great for layout, and boxes are boxes, not a set of pixels are are coincidentally shaped like a rectangle (admittedly, Photoshop is also capable of this, but it's much more limited). It's also intuitive - you move things by clicking on them and dragging them. Pretty much all of the things it seems that you'd like to do would be possible and easy to do in Illustrator. As you said, you're not interested in photo editing.

If you do decide to stick with Photoshop (and they're by no means mutually exclusive, as long as you're willing to pay for both), stay away from old tutorials. Recent versions introduced nice nondestructive things, like smart objects, smart filters, and layer styles. Those are much preferable to the destructive alternatives that we had to use in the past.

View on HN

Don't ever use illustrator for web design. Monitors uses pixels and you need to work in pixels if you expect to do great work. Use Illustrator when you are illustrating.

Amazingly, Illustrator allows you to output to multiple formats. However, it's vector based work allows your designs to work in far wider range of places beyond just the pixelated world of the web.

Logos, icons, or other illustrations should be done in Illustrator. If you do a 500px logo in Photoshop, you are effective fixed at 500px.

If you're merely referring to using Photoshop as a glorified layout editor for creating a quick rendition of the site, I guess that's fine. But then it's overkill by a large margin for the task.

If you expect to do graphics for the web, learn illustrator. If you except to merely mock up a site to later have it used merely as a reference for CSS/HTML, then their is less expensive software out there.

After you make something in Illustrator, you must must must look at the raster result it makes when you actually commit to a size and make actual png files.

Just slinging vectors at a problem fails in the last mile, often causing blurriness or jaggies.

You need illustrator + photoshop or illustrator + fireworks to really "do a job" as they say.

My design partner uses Illustrator for layout quite successfully. It doesn't handle pixel perfect layouts but gets us so close so quickly that it's well worth it. Out final stage involves editing the UI "sprites" in Photoshop for pixel perfection. So, yes, Illustrator is a valid web design package.

No need for that step, ask you designer to try this. In settings, make set all increments to pixels. Then set the grid to 1px X 1px (in some unobtrusive color) When creating a new doc, always go to view / (check) snap to grid / then whenever making a sprite simply put everything together, and draw a rectangle around it. With the rectangle still selected, make sure its height and width are in even pixels, and Go to object / artboards / convert to artboard. Hit save for web, and you are done! (hint, make sure strokes are always set to inside, or outside, and never centered, adobe defaults to center, so creating some reusable graphic styles can make this quicker) I have created a special key command for convert to artboard, since I use it about 80 times a day. Also, its typically better to double click and enter height and width then to draw a rectangle to insure the dimensions are in absolute pixels.

This is just plain wrong. Before adobe released the "align to pixel grid" and the preview in pixels (since CS or before) there has always been any easy way to work on a pixel grid, and snap everything. If you dont know how.. thats one thing but its certainly not the case you are describing.

Reply on news.ycombinator.com