[WikiCaretakers] Insert screenshots cleanly

paul haensch paul at fsfe.org
Wed Sep 20 13:34:13 CEST 2017


On Tue, Sep 19, 2017 at 10:17:29PM +0200, Johannes Zarl-Zierl wrote:
> Another workaround is to wrap the image block in a pagebox environment:
> 
> {{{#!wiki pagebox
> [[attachment:clone.png|{{attachment:clone.png||width=200}}]]
> }}}

I strongly recommend against using a pagebox for this. It may achieve a
desired optical effect in our current design, but semantically it is
completely different from what should be achieved. For example it might look
completely different in a future design, or in a rendering for paper, slides,
eReaders, etc. As a rule of thumb: Never argue with a markup engine ;-)

> > Ideally I want the images to be _between_ the paragraphs, not next to
> > them.  Or something else that doesn't look bad, really.
> > 
> > Does someone have any suggestions?

I have enabled a markup, that can do what you asked for, see below. I think
that a floating image might actually be appropriate though.

> @Paul: I think we discussed the issue some time ago. Is there some better 
> solution? Maybe we could introduce another alignment option for images?

First of all: the wiki style tries to display articles in the corporate design
set by the website. Where an image accompanies a text without being the primary
content provider itself, it is often displayed as being framed by the text.
Examples are [1], [2] (the quotation photographs), or [3] (the cycle gallery).

[2] https://wiki.fsfe.org/TechDocs/FellowshipSmartCard
[2] https://fsfe.org/campaigns/valentine/2011/valentine-2011.en.html
[3] https://fsfe.org/campaigns/ilovefs/

Different from this are banner graphics (in the same examples), or sometimes
diagrams and screenshot walkthroughs.

Since the images in the Git documantation are already scaled to be only
recognizable when clicked, I would rather consider them an instance of
accompanying imagery. Possible visual styling would be to to have them
displayed right or left of the text, i.e. by _prepending_ them to the
paragraph, which they should accompany or by setting them to be right aligned:

  [[attachment:clone.png|{{attachment:clone.png||width=200,align=right}}]]

For the latter case I have added corresponding behaviour when an image is
*indented* by a whitespace. This is reminiscent of quotations in the markdown
syntax, which unfortunately we cannot currently have on the wiki.
You might want to allow the image to grow wider, when displaying it on a lone
paragraph. Even on small screens it will never grow beyound the text frame.

-- 
Paul Hänsch                     █▉            Webmaster, System-Hacker
                              █▉█▉█▉                                  
Jabber: paul at jabber.fsfe.org    ▉▉     Free Software Foundation Europe
-------------- next part --------------
A non-text attachment was scrubbed...
Name: signature.asc
Type: application/pgp-signature
Size: 833 bytes
Desc: not available
URL: <http://lists.fsfe.org/pipermail/wikicaretakers/attachments/20170920/b7faaca3/attachment.pgp>


More information about the WikiCaretakers mailing list