Remember Me
SEND

Best Practices

This guide covers the restrictions of elements and how to avoid them. Web designing tips and clear web design examples will help you achieve good results in your work.

Related: 960 grid, Creative background design with stretch

Elements and widgets in the Divine Elemente provide great opportunities to work with CMS, publishing formats, functions, etc. However, while designing your template it is desirable to take basic web design standards and peculiaritues of web browsers and CMS into account.

Best practices and standards. Differences between good and bad PSD sources

Best practices and standards: Differences between good and bad PSD sources

In order to publish your website faster in higher quality with Divine Elemente, it’s important to get a valid PSD template.

Useful advice and descriptions of  a few working features of the Divine Elemente algorithm given below.


1. PSD Template: Eliminate Visual Disorder

Elements in Divine Elemente give great possibilities of publishing on various CMS, image formats, various functionality, etc.; and following the standard technologies of Photoshop, different CMS, browsers, etc., you may achieve perfect results. In order your theme looks qualitative, you are to take care of your PSD template’s quality

In order to produce a high-quality theme, you must produce a well-organized PSD template.

Following a few simple tips you can achieve astonishing results in Divine Elemente.


2. Element: One Type Layer And/Or One Merged Image

At elements’ creation, you can use as many layers as necessary to create a required element’s design. At conversion, all layers in an element’s group will be merged in one image for fast publishing. Divine Elemente algorithm. Work with graphic layers.

Divine Elemente algorithm: work with graphic layers.

Divine Elemente algorithm. Work with text layers.

Divine Elemente algorithm. Work with text layers.

That’s why, at element’s creation, place the necessary text layer on top of all others in the group.


3. No Overlap: Grid Blocks & Slices In Photoshop

First of all, at template’s designing, watch over an element’s arrangement. No element’s layer should overlap the boundary of a grid block. An example of correct and incorrect elements' arrangement concerning a layout grid.

An example of correct and incorrect elements’ arrangement concerning a layout grid.

In case element’s layers overlap a grid block’s boundary yet, this element cannot be assigned in the Publish Editor. More details on elements’ arrangement can be found in the “Elements” guide.

Secondly, it’s not desirable that elements overlap each over.

An example of correct and incorrect elements' arrangement in a template.

An example of correct and incorrect elements’ arrangement in a template.

As you can see, at correct elements’ arrangement and following basic standards of web design, your template will look not only accurate, but it’ll allow you to work with Divine Elemente much more convenient.


4. Elements On Complex Background

At template’s creation, it’s necessary to take into account the fact that elements can be moved down with their background on the website’s page, and such elements will not look good on the complex background.

That’s why it’s very important to select a correct format of an element’s image.

Elements on complex background. Selection of image's format.

Elements on complex background: Image format selection.

In Divine Elemente you can set the quality and format for each element. More details on elements properties can be found in the “Properties” guide.


5. Type: Differences Between Point & Paragraph Text

Point and Paragraph text's use

Point and Paragraph text’s use

Point text is recommended for such web elements as ‘Logo’, ‘Navigation menu’, ‘Texts’ that will not be changed in the CMS.

Paragraph text is recommended for elements, which contain more than one line of a text, and for elements, which boundaries should be set accurately (‘Posts’ > ‘Titles’; ‘Posts’ > ‘Contents’; ‘Posts’ > ‘Comments’, etc.)

Read more about Advanced text effects and publishing.


Extensions and Updates

In the future this guide will be expanded greatly. Check back often.

Free and paid extensions will be available ASAP.


Related Guides and Tutorials:

Subscribe to Our Newsletter
Success! You`ve been signed up. Please check your e-mail for our confirmation message.
"" is already subscribed to list Divine Project Newsletters
Invalid email
JOIN!
* Your e-mail address will only be used for our newsletter.
Get your social on
Subscribe to Divine Elemente
No Comments

Leave a comment


Your name (required)

Your E-mail (required)

Link to your website:

Your message (required)

captcha

Ping backs:

  1. [...] coding (in Photoshop too!): Create a basic theme, put graphics to groups, [...]

    Pingback Divine Photoshop Plugin - PSD to WordPress June 19, 2011 @ 11:41 am

Loading
"" is already subscribed to Divine Project Newsletter.
Invalid email
Success! You`ve been signed up. Please check your e-mail for our confirmation letter.
FREE UPDATES Enter your E-mail: JOIN US Privacy
10168 subscribers Divine Project RSS
Top-10 Tags
Powered by Google
Help translate Elemente GUI

Adobe®, Photoshop®, Fireworks®, Illustrator®, Flash® are registered trademarks of Adobe Systems Incorporated.


How to make WordPress theme from PSD template | How to Create Basic PSD template | How to Upload WordPress Theme to Internet | How to Change WordPress Themes | Sell / Buy WordPress Themes

© 2012 Divine Elemente. All Rights Reserved. Design by Ivan Sulimenko