Advertising sustains the DA. Ads are hidden for members. Join today

2.7. Technical Guidelines for Images

Last updated on
11 January 2024

This topic contains the technical guidelines for finalizing images in the Guide. Separate from that, we have several guidelines for topic writers, related to images (topic writers should just make rough screenshots):

Here are the technical image guidelines, which mostly apply to screen shots:

  • All images should be PNG files.
  • Make the image show as small of an area of the page as possible. This means that window borders, browser toolbars, and the navigation toolbar within the website should definitely be trimmed away. In addition, if the screen shot is illustrating how to fill in a small part of a form, or what a small area of the page looks like, trim so that the image only shows that part of the page.
  • The automated screen shot images are captured using an ImageMagick import command, from the command line, and then trimmed. Manually-generated images should (if possible) also be captured in this manner, so that the dots per inch and other factors are similar. Use a 72 pixels per inch setting.
  • Annotations, such as boxes for highlighting, should be kept to a minimum (it makes images harder to regenerate). If possible, trim the image instead. If an annotation is needed, it should be made in red (hex color code: #e62600).
  • Firefox browser should be used, with the text zoom set to the default, and the browser window width about 1200 pixels wide.
  • Make sure to set up the website by following the steps in the guide for all previous topics, before taking the screen shot. Also make sure that no steps after this topic have been completed, if they would change the screen shot. And be sure you are using the correct version of the core software.

Attributions

Written/edited by Jennifer Hodgdon and Joe Shindelar.

 

This page is generated from AsciiDoc source from the User Guide. To propose a change, edit the source and attach the file to a new issue in the User Guide project.

Source file: guidelines-images.asciidoc

Help improve this page

Page status: No known problems

You can: