|
In newfangled, we refer to the implementation of the design of a site structure
"skin". Terribly original, but not an accurate description. Preparing files for Photoshop
"Skinning" is an important step in Web development and should be so
any developer or programmer can understand and work with them. May require investment
a little time to prepare the design files, but ultimately, save time and production
can lead to cost savings for the client.
Photoshop Documents
First, create documents Photoshop (PSD) files to the main page and sub-pages.
In May it seems an efficient DSP for your page design is easier
work with small, several files in the PSD, each with a single model. This method has also
reduces the likelihood that something was lost in the process of counting. To maintain
total number of small files PSD, which represents the entire site with a page design
handful of sub-page templates. Simpler is better.
If you want to score bonus points with the web developer, creating a "style guide" that PSD
provides cascading style sheets (CSS) specifications for the content of the site. CSS defines a
website page elements such as the font size and style for the body text, page headers,
deputy chiefs, etc. Download a sample file of the PSD (1.7MB)
Optimizing Photoshop layers
In each of the PSD, the layers and layers files must be well organized and identified. Do not
Developer guess layer 56 contains, provide descriptions as "the main navigation
State. "Using the layer of records linked to the group and eliminate layers all layers or
layer styles to reduce congestion and reduce the file size of the PSD.
To highlight the layers that have the functionality, assigned a color. For example, if
which created a "state" of a layer of navigation map, to assign a color and leave
layer in the "off" state (by clicking on the icon of the eye next to the layer). To assign a
color, right-click (or Control-click) on the layer to open the menu functions of the layer.
Select Properties from the layer ... "And in the dialog box to select a color from the band
the menu. You can assign a color to the layer and folders (color highlights
apply to all sections of the file.)
Another useful tool to highlight the particular characteristics of their design is Photoshop Notes
Tool. You can find it in the toolbar (which looks like a small note). Place
notes anywhere in your design, but it seems that small yellow icons that you can double-click
change. Keep a copy of the notes, any program installation
should be established in an e-mail that can be printed for reference.
"Working" Files vs "Skinning" Archives
I have two copies of each division when preparing files for production: "work" with copy
All images and text separately rather flat layers, and a "skin" which is a copy
optimized for the developer.
Working files are useful for subsequent editions, when the client wants a change of funds
graphic or updating the main navigation bar. All graphs of your text (with custom fonts) and
art multi-layer intact and be easy to change.
Skinning PSDSs are the files that you give to your developer. Graphic text should be
plot of a work of art to eliminate the need for custom fonts in the process of counting.
Text that will be generated in HTML format should be maintained as a text layer with anti-aliasing
people with disabilities. Complex graphics and must be crushed to keep the file of the PSD in small and simple
size. Download a sample file of the PSD (2.2MB)
Here are some suggestions for the optimization and organization. By working with more and more DSP
files, you will discover other ways to reduce production time, save money and
maintenance of its website grumbling under his breath every time you send a
design.
Premium Web Templates - $1+ million worth of templates for instant download!
Web Design Tags: Design Site |
