Web Tip of the Week- From Design to Development
The creation of a new website entails various steps starting initially with an idea, and (hopefully) ending with an attractive, functional website that communicates the desired message to the correct audience.
Sounds simply enough when it’s described in one sentence, but the above process involves very distinct steps that all add together to create the “pillars” that form a website.
If you are familiar with Web Design/Photoshop, then I’m sure you’ve seen those brilliant, graphic designs, that contain multiple lighting effects and heavy image content to illustrate key points or main features. Well this all looks pleasing to the eye, but when we flip the page to developing the design, problems are bound to occur.
With the current standards for Web Development, quite a few of these “lighting effects” such a nice glow behind an image, are not supported with any of the web languages. The only way to achieve such effects would be to slice certain bits or your PSD file specifically for those lighting/pattern/etc effects and inserting them into the site as background images or some other kind of image.
Now that being said, heavy image based websites require more delicacy in development for the sake of optimization. You should be asking question like, “Do we really want to sacrifice optimization/time for these minute details that only add marginal attraction to the design?” The answer is for you to decide.
So tip of the Week? Design and Development should have some overlap. As a developer, knowing how to use the basics of Photoshop is required (slicing and dicing PSDs for the web) in order to build the design. However, when we look at designers, many of them work solely from the perspective of looks and ignore functionality.
It would be much better, from an optimization perspective, if designers took into consideration HOW their designs are going to be built. Now I know that is the job of the developer, but all I suggest it that designers understand basics elements of what it means to convert a static image to a live website. This is especially critical for web development teams who operate on deadlines to meet client needs.