Confirmed users
1,136
edits
Webdev:Web Design Best Practices: Difference between revisions
→Common Design Issues: Added couple (maybe too obvious) ones
(→Common Design Issues: Added couple (maybe too obvious) ones) |
|||
| Line 4: | Line 4: | ||
* Variable content | * Variable content | ||
** Different languages have longer or short text lengths and this affects height and width of elements | ** Different languages have longer or short text lengths and this affects height and width of elements. | ||
** Clever design based on letters in a word, puns, or number of words cannot be localized (L O V E in a square, GAME above OVER, etc) | |||
** Content changes over time, and designs should be flexible enough to handle these changes | ** Content changes over time, and designs should be flexible enough to handle these changes | ||
** Because form field labels often have variable length when translated, they should not be placed next to form fields | ** Because form field labels often have variable length when translated, they should not be placed next to form fields | ||
| Line 21: | Line 22: | ||
* If you must use rounded corners or some other enclosing graphic device, provide a layered version that shows these areas with expanded content so that the developer has resources for background graphics | * If you must use rounded corners or some other enclosing graphic device, provide a layered version that shows these areas with expanded content so that the developer has resources for background graphics | ||
* Photoshop documents must be fully layered (all elements should be on separate, labeled layers to make selection and isolation easier) | * Photoshop documents must be fully layered (all elements should be on separate, labeled layers to make selection and isolation easier) | ||
* Keep text in images to an absolute minimum. You will be creating a new image per locale. | |||
* l10n - Design and code should work for languages which flow the page right to left (RLT). | |||
* If a grid based layout is used, provide a PSD layer with measurements | |||
* Keep number of unique layouts to a minimum | |||
== Resources and other links == | == Resources and other links == | ||