privacyguides.org/docs/meta/uploading-images.md
fria e6bedf136d
docs: Update size requirements for company logos (#2808)
Signed-off-by: redoomed1 <161974310+redoomed1@users.noreply.github.com>
Co-Authored-By: Jonah Aragon <jonah@triplebit.net>
2024-11-14 13:50:36 -06:00

2.7 KiB

title description
Uploading Images A guide for website contributors on uploading images in the proper format and location.

If you make changes to this website that involve adding new images or replacing existing ones, here are a couple of general recommendations:

Images

  • We prefer SVG images, but if those do not exist we can use PNG images. Additionally, for cover images, we prefer that they are obtained from Unsplash and are in the WebP format.

Company logos should be square if possible, and at least 200x200px if they are PNGs (non-vector images).

Optimization

PNG

Use the OptiPNG tool to optimize PNG images:

optipng -o7 file.png

SVG

Inkscape

Scour all SVG images.

In Inkscape:

  1. File Save As..
  2. Set type to Optimized SVG (*.svg)

In the Options tab:

  • Number of significant digits for coordinates > 5
  • Turn on Shorten color values
  • Turn on Convert CSS attributes to XML attributes
  • Turn on Collapse groups
  • Turn on Create groups for similar attributes
  • Turn off Keep editor data
  • Turn off Keep unreferenced definitions
  • Turn on Work around renderer bugs

In the SVG Output tab under Document options:

  • Turn off Remove the XML declaration
  • Turn on Remove metadata
  • Turn on Remove comments
  • Turn on Embeded raster images
  • Turn on Enable viewboxing

In the SVG Output under Pretty-printing:

  • Turn off Format output with line-breaks and indentation
  • Indentation characters > Select Space
  • Depth of indentation > 1
  • Turn off Strip the "xml:space" attribute from the root SVG element

In the IDs tab:

  • Turn on Remove unused IDs
  • Turn off Shorten IDs
  • Prefix shortened IDs with > leave blank
  • Turn on Preserve manually created IDs not ending with digits
  • Preserve the following IDs > leave blank
  • Preserve IDs starting with > leave blank

CLI

The same can be achieved with the Scour command:

scour --set-precision=5 \
      --create-groups \
      --renderer-workaround \
      --remove-descriptive-elements \
      --enable-comment-stripping \
      --enable-viewboxing \
      --indent=space \
      --nindent=1 \
      --no-line-breaks \
      --enable-id-stripping \
      --protect-ids-noninkscape \
      input.svg output.svg

WebP

Use the cwebp command to convert PNG or JPEG image files to WebP format:

cwebp -q 70 -m 6 input_file -o output.webp