summaryrefslogtreecommitdiff
path: root/doc/development
diff options
context:
space:
mode:
authorGitLab Bot <gitlab-bot@gitlab.com>2020-04-06 21:09:19 +0000
committerGitLab Bot <gitlab-bot@gitlab.com>2020-04-06 21:09:19 +0000
commit7915c41e4261719719e791602c8235574157164c (patch)
tree6c1fc8c4ad4e974878c879fcc2c7c8f7d56d0cee /doc/development
parent495c22d1245b6212b21b7379a542df73dfa77206 (diff)
downloadgitlab-ce-7915c41e4261719719e791602c8235574157164c.tar.gz
Add latest changes from gitlab-org/gitlab@master
Diffstat (limited to 'doc/development')
-rw-r--r--doc/development/documentation/styleguide.md31
1 files changed, 30 insertions, 1 deletions
diff --git a/doc/development/documentation/styleguide.md b/doc/development/documentation/styleguide.md
index 75e38c3a5be..8e9ff0fb218 100644
--- a/doc/development/documentation/styleguide.md
+++ b/doc/development/documentation/styleguide.md
@@ -769,7 +769,7 @@ To indicate the steps of navigation through the UI:
a valid name for an illustration is `devops_diagram_v11_1.png`.
- Keep all file names in lower case.
- Consider using PNG images instead of JPEG.
-- Compress all images with <https://pngquant.org/> or similar tool.
+- [Compress all PNG images](#compress-images).
- Compress gifs with <https://ezgif.com/optimize> or similar tool.
- Images should be used (only when necessary) to _illustrate_ the description
of a process, not to _replace_ it.
@@ -796,6 +796,35 @@ directly to an HTML `img` tag:
<img src="path/to/image.jpg" alt="Alt text (required)" class="image-noshadow">
```
+### Compress images
+
+You should always compress any new images you add to the documentation. One
+known tool is [`pngquant`](https://pngquant.org/), which is cross-platform and
+open source. Install it by visiting the official website and following the
+instructions for your OS.
+
+GitLab has a [raketask](https://gitlab.com/gitlab-org/gitlab/-/blob/master/lib/tasks/pngquant.rake)
+that you can use to automate the process. In the root directory of your local
+copy of `https://gitlab.com/gitlab-org/gitlab`, run in a terminal:
+
+- Before compressing, if you want, check that all documentation PNG images have
+ been compressed:
+
+ ```shell
+ bundle exec rake pngquant:lint
+ ```
+
+- Compress all documentation PNG images using `pngquant`:
+
+ ```shell
+ bundle exec rake pngquant:compress
+ ```
+
+The only caveat is that the task runs on all images under `doc/`, not only the
+ones you might have included in a merge request. In that case, you can run the
+compress task and only commit the images that are relevant to your merge
+request.
+
## Videos
Adding GitLab's existing YouTube video tutorials to the documentation is