I am creating a simple website for a non-profit. Here is their old site: http://www.baldingfordollars.com

I'm going to use drupal to create a new site for them. I was planning on making a Drupal template using a simple 3-column (perhaps fixed column like this andreas01 (http://andreasviklund.com/templates)). They are also paying a graphic designer (since I don't have very good graphic design skillz). Anyways, I would like to start with a Drupal template and modify it from there OR start with some nice HTML and CSS mock-ups and translate those into Drupal (I think I could manage to do that) sort of like what is described here: http://support.bryght.com/articles/converting-css-html-design-phptemplat...

The graphic designer (not chosen by me) lists on their resume:
Adobe InDesign CS
Adobe Photshop
Adobe Illustrator
Microsoft Word
Dreamweaver
Quark Express
Flash

I don't know what InDesign or Illustrator are supposed to do, but can Dreamweaver create simple HTML/CSS?

Or is it incapable of doing so? Should I try and get the graphic designer to create HTML/CSS or should I just let her create ugly HTML using dreamweaver, port it to CSS, and then port that to PHPTemplate. I've done the translation from ugly Adobe GoLive HTML to HTML/CSS twice before and it takes a lot of time, is annoying, and I'd rather not have to do it again. Those were for personal websites or friends.

This new project is paid work and I'm not sure the best way to go about it. Should I take on the task of translating the ugly Dreamweaver HTML to HTML/CSS (and add more time and cost to the project proposal) or should I force the graphic designer to make it HTML/CSS? (not sure if that is possible given her software and skills?) A related question is, is there any software out there that will create nice HTML/CSS that I can suggest to her?

Thanks,
Dave

Comments

robby1066’s picture

Get a static mockup from her (preferably a layered photoshop file if you can deal with those), and chop the layout into CSS yourself. Dreamweaver technically *can* be used to create clean html and be styled with CSS, but that usually depends on the designer / production artist knowing how to use Dreamweaver to do that. If the designer is primarily a print designer (which I believe is at least not an unfair assumption given that both InDesign and Quark are on her resume), she might not have a lot of knowledge about the tech side of page layouts. Having a quick conversation with her wouldn't hurt, just to get an idea of what her proficiency is with that stuff.

That being said, I know when I'm building a template, I don't really want to be constrained by the way someone else chopped up the graphics, so I always try to get a .psd file and do all the chopping / optimization work myself.

Hope that helps!

dgrant’s picture

When you say "chopped" what do you mean exactly? The only thing it brings to mind from my own experience, is when I helped with a website recently, the graphic designer had the header split into 3 graphics: http://www.willmusic.ca/about.php. I believe she did that in Adobe GoLive, but I'm not sure why she or GoLive decided to split the graphic. I had to use an image editor to stick them together for my CSS version: http://www.willmusic.ca/photos.php (so far that's the only page I've converted to use my CSS template, the rest of the site is all in tables).

I use Gimp, and yes when I do my own work I always prefer layers over some flat image for obvious reasons. I just don't know what exactly you mean by "the way someone else chopped up the graphics." Do mean it in the same way I mentioned above?

So you think static image-based (with layers) mockup is the best in the situation (yes I do think she is more of a print designer although she has worked with some websites, in other words, she's an artist, not an HTML or CSS guru).

It's too bad I only have GIMP, not photoshop. I just googled to see if GIMP supports psd and I got mixed search results... it looks like it might.

robby1066’s picture

Yeah, by "chopped", I mean taking the static layout image (psd, .tiff, etc) and making the different images that will get used in the final html/css rendered layout, and your example is exactly why I cut up the images myself. A lot of times a designer or another developer will cut up a layout into images in a way that makes perfect sense to them, but for whatever reason, you would've preferred them another way. It's just easier to always do that part yourself, in my opinion.

I know nothing about GIMP, other than I think it supports most standard formats, so maybe have a look at layered tiff files if it can't take a psd file (I think it can, but maybe not the latest version of PSD).

q0rban’s picture

I will echo the above and suggest getting the image and chopping it up. Then, I think the easiest way is to hack an existing theme with the new images.

The most flexible theme I've found, as far as graphic design is concerned, is FriendsElectric... You can view a site that I did this very thing with here... This is the friendselectric theme.

Most likely the reason the header you mentioned was chopped into three pieces is to make it fluid. If you go to that site above, you will notice that as you resize your window, everything resizes fluidly inside it. This is one advantage to chopping up designs into little pieces...

cheers...

shane birley’s picture

I work with a lot of non-profits and spending a little money will save a lot of time. But, it all depends upon the budget you have.

Unless you want to become a hard core themer - which I think would be cool too! :)

---
Shane Birley
Vicious Bunny Creative
http://www.vbcreative.com

---
Shane Birley
Left Right Minds
https://www.leftrightminds.com

dgrant’s picture

Shane,
It looks like we're both in Vancouver.
Can you recommend any "themers" for me? What would be the cost for creation of a simple theme based on some psd's created by a graphic artist?

Dave

shane birley’s picture

If you are interested, give me a call. My contact information is on my web site. I have converted many web site comps into Drupal sites and know a number of designers who I can introduce you to.

---
Shane Birley
Vicious Bunny Creative
http://www.vbcreative.com

---
Shane Birley
Left Right Minds
https://www.leftrightminds.com