[tor-project] Expanding our people page

Damian Johnson atagar at torproject.org
Sun Jul 9 17:10:05 UTC 2017


Thanks Arturo!

> - You probably need a bit more padding around left and right of the columns
> (10-20px) and a little bit more top and bottom (I think you already added
> some padding, but it still seems a bit too clutterred in my opinion)

There was a 5px padding between the columns and 15px vertically.
Bumping the column padding to 10px indeed looks better.

Shrinking the icons and making the margin apply to them (rather than
just the description) looks a lot better so gonna move forward with
the icons for now.

> - I like the idea of using icons for the links to PGP keys and twitter, but
> I would put them below the IRC handle (and not in the upper right corner).
> I would also use a monochrome icon set instead of something with colors. An
> icon set I usually use is font-awesome: http://fontawesome.io/. I think for
> those two items you can probably use: http://fontawesome.io/icon/key/ and
> http://fontawesome.io/icon/twitter/ or
> http://fontawesome.io/icon/twitter-square/.

Hmmm, just tried moving the icons there but didn't seem to work as
well imho. I can provide before/after screenshots if folks are curious
how this looks. Monochrome looked good on Atlas since it used a
consistent aesthetic. Not so sure about here though.

> - How long do you expect the description text to be? If you anticipate it
> being quite long, maybe it’s worth trying out a single column layout to
> avoid the description text overflowing and creating asymetry in the boxes.

If the descriptions are very long they wrap below the photo so I'm
keeping description length below that. I realize I could use a clear
to avoid the wrap but I think having this limitation is a good thing
since it prevents anybody's description from becoming TL;DR.

> - For the placeholder image (the onion icon) I would also go for something
> monochrome to avoid it creating too much visual overload
> (see: https://github.com/TheTorProject/tor-media/blob/master/Onion%20Icon/Black_Icon.svg).

Hmmm. Gave it a try but honestly not sure monochome onions looks better...

https://www.atagar.com/transfer/tmp/people_page-monochrome_onion.png

If folks want this though that's fine.

> Maybe even give it a give it an `opacity: 0.8` to make it even more subdle.
> If when trying that out it doesn’t look right and you still want to use the
> colored one, be sure to use the official color icon version
> (https://github.com/TheTorProject/tor-media/blob/master/Onion%20Icon/Onion_Color.svg)
> that doesn’t have the weird shading on the onion leafs and body of the
> onion.

Oooh, that does look better. I had to scale up the trac icon to make
it work - svg export is a lot more crisp.

> Do you have the css and source of these? That would be useful to try some of
> these ideas out.

Yup, here it is.

https://gitweb.torproject.org/project/web/webwml.git/tree/about/en/corepeople_alternate.wml#n13

Thanks for the suggestions Arturo!


More information about the tor-project mailing list