View Full Version : From Illustrator to Website

12-23-2011, 04:07 PM

I've worked on several websites for clients, although i am more of a programmer than a web designer. The websites i've built in the past have been mostly done on Photoshop (the graphics, buttons, etc...) and then i use those in my HTML/CSS to put it all together.

Normally, what i have done in Photoshop and i know can be done in Illustrator is to use slicing in order to get different "parts" and images saved so it's ready to use in the HTML part of the development.

However, I've gotten a request from a friend who has a design that has been done in Adobe Illustrator. The design has moving parts, moving background, an introduction video that starts automatically once the initial intro is done, and i have no idea how to go from his design to a working website. The person that worked on the design is a third party, and my friend asked me to look at the design and see if i can take that design and get it up and working.

Honestly, I'm inclined to tell him it's beyond what i've worked with, and since i don't have enough knowledge, he should get someone else who has more experience.

But at the same time, since the design/artwork is done (arguably the hardest part), i'm curious whether it's something simple that i can grasp and learn quick enough to help him turn this into a working website or whether it will require more experience than what i have to offer at this point.

I've looked around for explanations or tutorials, and found a lot of good illustrator tutorials, but none that explain how to take the illustrator design file and use it for the coding part of the process (html,css, etc...).

Does anyone have any thoughts? Any good resources i can look at? Any tips?

Thanks in advance!


12-23-2011, 11:32 PM
I don’t know how you have created your websites in the past but if you know HTML and CSS the rest shouldn’t be all too hard to grasp, especially if you’re a programmer.

Dynamic things on a website (animations, autoplay a video, etc.) are usually done with JavaScript. That means once you have the HTML and CSS done and got it working so far you’d use JS to enhance the functionality (make sure that the site doesn’t rely on JS in order to work since JS can be disabled for whatever reason; the site should still be usable and understandable without). It’s difficult to say what to do without knowing anything about the design comp, though.

12-26-2011, 06:45 PM
Not sure if this helpful to you, but I'll keep my finger's crossed...


01-16-2012, 05:03 PM
Infinity clipping path (http://http://www.infinityclippingpath.com/) offers the promising clipping Path, image masking, photo restoration,
photo retouching, photo enhancement, raster to vector tasks, color corrections, image manipulation,
creating shadow, logo design, catalog design, raster to vector, web design with fast pace at
most attractive price within very short time interval rather than others.