Layer 4 copy
doc
tut
blog
forum
doc
tut
blog
forum
home

Upload your PSD file...

Take a quick look at the Guidelines to see how to prepare your PSD file


 

Please wait - we are now uploading and converting your file...

 

Wait! You can upload your PSD, but you aren't logged in! If you submit now, you won't get any of the cool Unlimited features. You'll just get plain XHTML and CSS DIVs. Create a new account to use all the great Unlimited features free for 2 weeks.

Guidelines

Upgraded to Unlimited yet?

Unlimited users get All the new features including animated drop down and fly out menus, automatically generated forms, tool tips, can convert PSD files that are up to 8MB and more! Regular users don't get the special features and have a 4MB cap on PSD file size. Upgrade to Unlimited now!

Here are a couple simple guidelines about your .psd files that will make working with psd2css Online and other sites powered by psd2css Online easier and more productive:

Note! These are guidelines to make it work - not the documentation about all the cool features.
You can find the documentation here.

  • Opacity and Blending Options - Layers with Opacity at anything other than 100% or Blending Options set need to be rasterized. In Photoshop you can right click on the layer and choose 'Rasterize Type' or 'Rasterize Layer', or just merge the layer with any other raster layer (even a blank one). In The Gimp you can make an empty layer just below the one you want to rasterize, then right click on your layer and choose 'Merge Down'. That will rasterize the layer and merge it with the empty layer too.
  • Don't make too many layers - if you are an advanced artist, you probably made your work using lots of layers that all combine together to make individual parts of your art. For example, your logo might be made up of 5 or 6 layers - but the logo will always stay one single element, always together. Don't upload your psd file with that logo still all separated out into the 5 or 6 layers - merge them down to one 'logo' layer.
  • Use 8 bit RGB images - 16 bit, indexed image depths, and other color spaces won't work - use 8 bit RGB images
  • The Final Crop - Just before you send your PSD to be converted, it's a good idea to crop the image to exactly the size it is already. I know that doesn't sound like it makes any sense, but it's possible to have layers defined that are much larger than the visible area in the photoshop file (those layers will 'stick out' of the visible area). Not only can very large areas cause problems for the tool, but after conversion you'll have very large images that are absolute positioned via CSS to only show the part you want - looks good, but very inefficient. Please do the Final Crop before sending your PSD file for conversion. Here is a video explaination of The Final Crop: http://psd2cssonline.com/node/204
  • Visible/Invisible Layers - psd2css Online will convert and generate images for your invisible layers. If you don't want those layers to show up in your web page, then please make a 'working' copy of your PSD file and delete the invisible layers for conversion by psd2css Online
  • Layer Comps (Photoshop CS) - Layer Comps in Photoshop CS are an awesome tool that can help your work flow while building multiple page web sites to be converted with psd2css Online. However, the ability for Layer Comps to remember positions is lost in psd2css Online. If you have a position for a layer in one Layer Comp and move that layer for another layer comp, that layer will only generate one CSS layer and it will be in the position within the lastmost Layer Comp. Layer Blending Effects are already mentioned above, as well as visibility. So you can use Layer Comps to be a productive web designer, but don't utilize the 'position' Layer Comp Option in Photoshop.
  • The Gimp Layer Sizes - The Gimp likes to make layers as big as the entire image. This makes for a really inefficient web page - lots of big image files. For any layer in The Gimp where the actual art is smaller than the whole page (probably all your layers), choose the layer to edit, then in the layer menu choose 'Autocrop Layer'. Tutorial 3 shows this little work around in action.
  • 4MB/8MB psd File Size Limits for regular/Unlimited Users - You must be an Unlimited user in to get the 8MB file size limit. We are currently investigating larger file sizes. Bandwidth issues are the focus.
  • Help out the guy writing psd2cssonline - ok, not really a guideline I suppose, but if you upload a psd file and it doesn't do what you think it should, send it to me at support@psd2cssonline.com. I'll make it work (as time permits). Thanks
copyright (c) 2009 psd2css Online, Inc.

 

 

User login

Become a Fan of our Facebook Page

Need help or have a question?
support@psd2cssonline.com

| Privacy | Terms of Use |

copyright (c) 2008, 2009, 2010, 2011 psd2css Online, Inc.
Patent Pending

Syndicate content