Websites in Photoshop

Astrocookie

I work pretty well with Photoshop CS4, but I don't know or care much about Web development.

Does anyone know if those programs that build websites from Photoshop documents by using the layers and making slices and stuff actually produce good results or are they crap?

I need a way to translate the concepts and designs I come up with in Photoshop into actual working websites. It would be better if I could spend like 300 bucks on something like sitegrinder than spending thousands of dollars hiring a dude.

Grenn

You don't care much about web development but you want a way to turn your designs into websites? o_O

Well, you can slice up a PSD file and output it as tables but that's not a good way to build a website. Building a site is not just a matter of making it look like your design... there's a lot more to it. You need to build in cross-browser/platform compatibility and make sure your code translates well however your users interact with the site.

If you're serious about being able to design sites then my advice is to learn basic (X)HTML and CSS.

exmello

Standards in web design enforced by the limitations of HTML are good thing. You may be tempted to reinvent the wheel with your art, but in general this makes for a confusing user experience. This is why flash based websites were nothing more than a fad.

Wassermelone

I used photoshop to design my website using slices to chop it up into bits.

I used dreamweaver (not great) to throw together the rest. Its not hard if you have even a little code know how.

ಠ_ರೃ

Sitegrinder has a trial version you know

flatlinegraphics

there are no shortcuts in web dev. you wouldn't design and book in photoshop and sent the printer psds, you shouldn't just hit export and expect anything great.

does save for web and slices work? sure. i use it every day. i don't output html from it though, and i would strongly suggest you do not either. the pages work, if barely, but there is a lot of crap included. to the point where you literally get what you see, no more, no less. need to change something? back to your comp, reexport, try again. reuse assets for multiple pages? probably going to have to reexport.

there is only basic crossbrowser compatibility, there is tons of crap loaded into the pages, and if anyone else ever has to use your output, they will swear to stab you over the internet.

learning basic html should take all of an afternoon. just do it. css, maybe a bit more. advanced html/css, may take a lot more time. try flash instead. may make more sense to you. outputs exactly what you see. still not great, but easier (for basic stuff with more design than function).

tl;dr: sure it works, sorta, but don't do it.

Astrocookie

Flash is a piece of shit that I will never use. If it disappeared tomorrow the world would be a better place.



That said, the only option would be to learn CSS I guess, because fuck the inflexibility of HTML. I need things to be placed exactly where I want on a page.

Can Dreamweaver do CSS easily, as in almost with like a drag and drop functionality?

I'll learn CSS if it's pretty much the only way, but fuck

BoomShake

Astrocookie wrote: »

That said, the only option would be to learn CSS I guess, because fuck the inflexibility of HTML.

CSS is used to style structures written in HTML/XHTML. It's not a replacement.

Also, don't ever use that shit export for anything other than the roughest of mockups. Do it by hand with your design as a guide.

Astrocookie

Is there an all in one book I can just pick up and teach myself web design with, that covers all the aspects, from browser compatibilities to localizations?

BoomShake

The tutorials on http://w3schools.com/ are a pretty good intro to standards-compliant code. Once you know that, then you can get into the various wonkyness of different browsers and how to work around them.

Dranyth

Astrocookie wrote: »

I need things to be placed exactly where I want on a page.

You may wish to re-evaluate this sentiment.

I only say that because between different browsers, different versions of browsers and the multiude of screen sizes and devices viewing web content, trying to get a site to look exactly the same is an exercise in futility.

Also, getting things placed 'exactly where you want on a page' is harder than you can imagine, even with current CSS.

Rye

Astrocookie wrote: »

Is there an all in one book I can just pick up and teach myself web design with, that covers all the aspects, from browser compatibilities to localizations?

Are you looking to make lots of sites or just a personal site? If it's just a site, I'd be able to help you code up a cross-browser compatible simple template (I'm sure others could help too).

A note on cross browser compatibility: It's not as bad as people make it sound. All browsers will listen to height, width, offsets and floating (logically flow based on parent container's size) which will get all your shiny images into position.

It starts getting hairy when you deal with text, padding and margins, but with some basic good practices you avoid all of that.

Seriously, no need to buy a book just post questions. We can hand hold all the way to the last bracket It would be nice if you took a look at w3schools though. It's the most official and thorough, making web design books obsolete for most people.

robotbebop

Astrocookie wrote:

It would be better if I could spend like 300 bucks on something like sitegrinder than spending thousands of dollars hiring a dude.

Really? Thousands of dollars? I do this like, every day at my full-time job, and my wage is $17/h, and our billable rate is $100/h. The MOST it ever takes me to do a site these days is 9 hours. Most of the time though? I can do PSD -> HTML/CSS/JS in under 4 hours. That's $400 billable, or less than $100 wage. And that is definitely doing proper HTML+CSS. No tables. No div hell. Real CSS. Real standards compliance. AND 90%* of the time working in every browser that matters. (IE6+/FF2+/Safari. And really, if it works in FF it works generally anywhere.)

So, unless you're contracting out to people who obviously lack experience, it shouldn't cost you more than $1000 per-site.

This also means that if you can find people like me, you're getting a better product for less. You can spend money on whatever Site Grinder is, but automated software doing the job that a real person should do never ends well.

EDIT: * that 10% is IE6 fuckery; so, really, who cares.

Astrocookie

I'm only looking to make one site, with multiple pages in it.


robotbebop can I see some examples of sites you've done so I can see what 100/h gets in web design?