5142
Comment: Removed 'when designing a web page' section - as it's now integrated with UserInterfaceReviewNotes.
|
3620
Moving to top-level and renaming for specific use with UserInterfaceReviewNotes.
|
Deletions are marked like this. | Additions are marked like this. |
Line 1: | Line 1: |
## page was renamed from DeveloperDocumentation/UserInterfaceChecklist | |
Line 34: | Line 35: |
== Template code == * Template code should be indented with two spaces. ||'''Don’t use this''' ||'''Use this instead''' || ||`<b>` ||`<th>`, `<dt><dfn>`, `<strong>` || ||`<br>` ||`<li>`, `<div>`...`</div>` || ||`metal:fill-slot="pageheading"`||`metal:fill-slot="main"`|| ||`<h3>` ''(unless `<h2>` is used earlier in the page)'' ||`<h2>`, `<div>` || ||`<hr>` ||''nothing'', `<table class="listing">` || ||`<i>` ||''nothing'', `<em>`, `<var>` || ||`onclick=` ||''Mochi``Kit to attach event handlers to elements (and to create the elements too, if they do nothing without Java``Script).<<BR>>See the JavaScriptStyleGuide for more information.''|| ||`style=` ''(unless this style is used nowhere else)'' ||''HTML elements, classes'' || ||`<ul><li tal:repeat="bar bars"`...||`<ul tal:condition="bars"><li tal:repeat="bar bars"`...|| ||`<div tal:replace=`...<<BR>>`<span tal:replace=`...||`<tal:one-word-summary replace=`... <<BR>> `<tal:one-word-summary replace=`... <<BR>> ''(functionally identical, but more informative for those reading the code later)''|| ||' ''(ASCII single quote used for an apostrophe)'', ' || &``#8217; ''or'' ’ ''or'' ’ || ||"foo" ''(ASCII double quotes)'', " || “ ''and'' ” ''or'' “ ''and'' ” || ||'foo' ''(ASCII single quotes)'' || ‘ ''and'' ’ ''or'' ‘ ''and'' ’ || See also PageTemplateHacking, which may be mergable with this page. |
These are low-level design guidelines for Web pages, e-mail messages, and other Launchpad output. They cover common mistakes, and are not a substitute for having an interface designer involved in the design of any visible change.
Text
These guidelines apply to Web pages, e-mail messages, and any other media used in the future.
Don’t use this |
Use this instead |
abort |
stop |
above |
this, these |
click |
nothing |
below |
this, these |
DOAP |
nothing |
FOAF |
nothing |
illegal |
not allowed |
invalid |
incorrect (or more specific error) |
just |
nothing |
Malone |
Launchpad or Launchpad’s bug tracker |
Note: |
nothing |
Note that |
nothing |
please (unless announcing serious inconvenience) |
nothing |
Rosetta |
Launchpad or Launchpad Translations |
simply |
nothing |
Soyuz |
nothing |
the following |
this, these |
the form |
nothing |
this form |
nothing |
this page |
nothing |
to the left |
better page layout |
to the right |
better page layout |
* |
better text ordering |
! |
nothing (or, if in real danger, <strong>) |
Capitalization
- Buttons should be Headline Case; the last word capitalized, and all other words capitalized except those three letters or fewer that are prepositions, articles, or conjunctions.
- Everything else should be sentence case, including headings, checkbox labels, menu items, and e-mail Subject lines.
Menu items
- Menu items should start with a verb if practical.
use of "Show", "List", or "View" TBA
Notifications, warnings, and errors
Follow the guidelines specified in AlertMessages.
Cancelling actions
The actions at the end of a form should consist of a button, followed by the word "or" and a Cancel link:
( Summary of Action ) or Cancel |
The "Cancel" link should return you to the page you came from. (To get this link, define the cancel_url @property in the browser class.)
E-mail messages
These guidelines apply to all e-mail messages:
- Don't wrap paragraphs manually in the message template. The e-mail machinery can do this more consistently (especially if the message contains variables).
- If the message is from a subscription, the footer should consist of three lines:
the URL of the relevant resource (e.g. the bug report)
"You are precise reason for getting this message"
"To unsubscribe: <URL of unsubscription page>" ?? -- TBD
These guidelines apply to notifications not being sent on behalf of a Launchpad user:
From addresses should be @launchpad.net, not @canonical.com or @ubuntu.com, and should have a display name starting with "Launchpad".
- The Web page that tells you you're being e-mailed should say what the From address will be.
- The Subject line should be informative, and use sentence case.
- The body text should be copyedited by someone fluent in the language being used.