I think the first option could potentially be improved if the background color is not removed entirely, but set to something that is different from the page background, like a shade of gray that is either lighter or darker than the page background's gray.

I think the first option could potentially be improved if the background color is not removed entirely, but set to something that is different from the page background, like a shade of gray that is either lighter or darker than the page background's gray.

−

Option 2 (no border) could also work, and is used by a few wikis with dark background, such as the Elder Scrolls Wiki and Bioshock Wiki. This may be the easiest option.

+

Option 2 (no border) could also work, and is used by a few wikis with dark background, such as the Elder Scrolls Wiki and Bioshock Wiki. This may be the easiest and most practical option.

Option 3 (the new gallery) - I'm not too familiar with this type of layout. I think it might have some problems with pages that have irregularly-shaped images ([//deusex.wikia.com/wiki/Mustang_Arms_.357_Magnum?gallery=new#Gallery https://deusex.wikia.com/wiki/Mustang_Arms_.357_Magnum?gallery=new#Gallery])

Option 3 (the new gallery) - I'm not too familiar with this type of layout. I think it might have some problems with pages that have irregularly-shaped images ([//deusex.wikia.com/wiki/Mustang_Arms_.357_Magnum?gallery=new#Gallery https://deusex.wikia.com/wiki/Mustang_Arms_.357_Magnum?gallery=new#Gallery])

Line 8:

Line 8:

The same technique is also used in the [[Ammunition (DXMD)]] page, where you see that all the ammo box images line up neatly. In the ammo listing page, if you were to crop out the side transparency areas for the revolver ammo image, then that image would have to be rescaled and then centered in the table cell in order for it to be of the same height and aligned with the other ammo boxes.

The same technique is also used in the [[Ammunition (DXMD)]] page, where you see that all the ammo box images line up neatly. In the ammo listing page, if you were to crop out the side transparency areas for the revolver ammo image, then that image would have to be rescaled and then centered in the table cell in order for it to be of the same height and aligned with the other ammo boxes.

+

+

However, you are right that when displayed in gallery view, it looks a bit weird if there are large transparency areas. If you crop the images, I would crop all three similar images to have identical margins.

Latest revision as of 04:36, November 24, 2018

I think the first option could potentially be improved if the background color is not removed entirely, but set to something that is different from the page background, like a shade of gray that is either lighter or darker than the page background's gray.

Option 2 (no border) could also work, and is used by a few wikis with dark background, such as the Elder Scrolls Wiki and Bioshock Wiki. This may be the easiest and most practical option.

Regarding the empty transparency areas - I made all story item images of the same dimension (1,420 × 870) in part because I pasted all the screenshots as layers into a single image, and cropped them all to the same size all at once. Doing so has one additional benefit, which is that when placed in a table (as in the above story item page), the images are neatly aligned. Otherwise, if the images are not of the same dimension, or have different transparency margins from one another, then they would not align as well.

The same technique is also used in the Ammunition (DXMD) page, where you see that all the ammo box images line up neatly. In the ammo listing page, if you were to crop out the side transparency areas for the revolver ammo image, then that image would have to be rescaled and then centered in the table cell in order for it to be of the same height and aligned with the other ammo boxes.

However, you are right that when displayed in gallery view, it looks a bit weird if there are large transparency areas. If you crop the images, I would crop all three similar images to have identical margins.