- Tweet Author: The author's name should be presented as the author's Twitter username or name with the username present. The name should be linked to the user's Twitter profile page at http://twitter.com/username, made actionable using a Web Intent, or linked within your service's internal representation of the author's profile, which should contain a link to the user's Twitter profile page. The author's username should be styled differently than the Tweet text and links (bold, color, size, or other typographic convention), and should not be preceded by an @ symbol.
- @mentions: Mentions of other Twitter usernames must link to the profile page at http://twitter.com/username, made actionable using a Web Intent, or linked within your service's internal representation of the user's profile, which should contain a link to the username's Twitter profile page.
- Hashtags: If any hashtags ('#' followed by a string of characters) are mentioned in the Tweet, they should link to a twitter.com search results page for that query term (for example, http://twitter.com/search?q=%23newtwitter) or an internal representation of the results containing a link to the Twitter search page.
- URLs: If any URLs are included in the Tweet, they must be hyperlinked and the hyperlink must link to the location passed through the API. Hyperlinked URLs are best displayed when visually differentiated (colors or underline).
- Branding: If one Tweet is displayed independently, it must be labeled with either the Twitter wordmark or the Twitter Bird (consult our Image Resources), or with text reading "Content from Twitter." If multiple Tweets are grouped, the Twitter wordmark or "Content from Twitter" must be placed in a close proximity to the grouped content.
Tweet Box: If showing a box for users to Tweet from, "What's Happening?" should be written above the text field. This Tweet box should also either be near Tweets that include the Twitter wordmark or the Twitter Bird, or the Twitter wordmark or the Twitter Bird should be present within the box.
- Tweet button: The button should be displayed and labeled as "Tweet" if the content is being posted exclusively to Twitter, or "Update" if directing to other services in addition to Twitter.
- Character count: A character count helps users counts down to stay within 140 characters
Exceptions to the above will be made on a case by case basis by email approval. Please contact email@example.com if you feel that an exception is necessary.
The following are suggestions based on how Tweets look on Twitter. You may find that this isn't the most relevant way to display the data you show, and we encourage your creativity. However, if you're looking for some direction, please see the following:
- Avatar & Alignment: We show the user's avatar on the left side of the Tweet. Remaining Tweet content is aligned‐left, immediately to the right of the avatar. The avatar links the user's Twitter profile page at http://twitter.com/username.
- Timestamp and Permalink: This information can be shown either relative, e.g. "2 minutes ago", or absolute, e.g. "8:45 AM, Jul 8th"). The timestamp should be on its own line after the Tweet text and styled differently to be less prominent than the Tweet text (lighter color and/or smaller size). The timestamp should also link to the Twitter hosted permalink page for the individual Tweet.
- Tweet Actions: Reply, Retweet, and Favorite actions should always be available from a Tweet, and should be displayed with their respective action icons. They should be arranged left to right as Reply, Retweet, Favorite. Easily accomplish this by utilizing Web Intents.
- Source: Along with the timestamp and permalink, you may choose to display the client or means by which the Tweet was posted (e.g. "from web" or "from Twitter for iPhone"). If client is supplied, please make sure it links to the source page URL provided.
- Multiple Tweets: If showing multiple Tweets at once, they can be visually separated by horizontal lines, empty spaces, or alternate background colors. The empty space should be proportional to the overall height of the Tweet itself.
- Multiple Tweets, One Author: We find that when showing multiple Tweets from the same user, it looks best if the profile picture is not repeated with each Tweet. Showing one avatar with content from the same user provides for a simpler experience.
- Chronological order: It usually makes sense for Tweets to be ordered in reverse chronological order (latest first), but we understand that this might not always be the most relevant way to arrange Tweets. When shown as search results or other criteria (keyword, user, or other editorial constraints) Tweets may be ordered by those criteria.
- Name with Username: If the full name is displayed alongside the Twitter username, the Twitter username should be visually differentiated (e.g. color or bold) and more prominent.
- Search Link: Information becomes more discoverable when a search term links to a Twitter search results page. If you have a product that returns search results for Tweets, we recommend that the term links back to the relevant search page within Twitter.
- Web Intents
- Guidelines for Use of Tweets in Broadcast or Other Offline Media
- Twitter Logos
- Birds, Favorite, Reply, Retweet Icons & Sprites
For more on how to use the Twitter marks, see http://support.twitter.com/forums/26257/entries/77641