[Marketing] Website quickfix: sponsors page design notes

[Jody Garnett]

Some good news, it looks like we can find the design documents from
GetInteractive, and can revise engineer some details, to recover the
sponsors page:

   - Checking meeting notes sponsor wireframes were sent to the list for
   discussion
   - Email indicates this google document
   <https://drive.google.com/file/d/0B08AjQ2hqLipMmxRWFYtR1ZKLWM/view?resourcekey=0-5X32G9CAEXeMePkQPGI8cQ>
and
   I can see the wireframe on page 17
   - It looks like the wordpress theme is very simple, and relied on some
   care being used when producing the sponsors images


This leaves us with a clear "quickfix":
a) go through the sponsors logos and place each on a 740 x 412 template
(taking care to centre and adjust so the result is "fair" visually)
b) restore the css styling (rows and columns) matching design

Here are my research notes for anyone wishing to check my work...
Jody

NOTES

*GetInteractive Design*


   - When editing a sponsors page - and adding a logo the image produces a
   warning indicating:
      - Width should be at least: 740px
      - Height should be at least: 412px
   - 740 by 412px (aspect ratio of 1.80)
   - The easiest thing to do is recreate the sponsor logos in this size and
   then multi-column layout becomes easier
   - The wireframe shows rectangles, with some margins between them (which
   would mitigate some of the relative size conflicts we are experiencing)




*Looking at wordpress media:*

The original logos provided by GetInteractive all have filenames
sponsor-xxxxx

sponsor-gaia3d-e1594996762376.png


   - August 9, 2017
      - 16 KB
      - 358 by 160 pixels (aspect ratio 2.24)


sponsor-geodan.png


   - August 9, 2017
      - 14 KB
      - 358 by 160 pixels (aspect ratio 2.24)


Further more these were created with a consistent amount of white space.


Newer logos did not keep this aspect ratio, or the recommended size:

OrangeMan-Logo_RoundOrangeENG.png


   - December 29, 2021
   - 24 KB
   - 380 by 385 pixels (aspect ratio 0.99)


camptocamp_logo_square_moto_2020_cmyk-1.png


   - February 22, 2021
      - 63 KB
      - 897 by 447 pixels (aspect ratio of 2.01)


*Changes to page theme*

   - The logos are now arranged in square, not the rectangles from the
   wireframe
      - CSS allows logos to completely fill the available square (example
      500x500 pixels)
      - Q: I wonder if we can compare with the initial GetInteractive
      design in version history


*Checking www_osgeo/origional branch:*

wp-content/themes/roots/templates/atomic/organism-sponsors-list.php
(grayscale indicates to me that this is for the footer)

        <li class="col-sm-2 list-item sponsors-item grayscale">
            <?php if ($url): ?><a href="<?php echo $url ?>"><?php endif; ?>
                <?php gi_load_template('templates/atomic/atom-image.php',
array(
                    'src' => $logo['url'],
                    'title' => $sponsor->post_title,
                    'width' => 195,
                    'height' => 80
                        )); ?>
                <?php if ($url): ?></a><?php endif; ?>
        </li>

wp-content/themes/roots/templates/atomic/organism-sponsors.php
(this must be for the individual rows)

            <li>
                <?php if ($sponsorUrl): ?><a href="<?php echo $sponsorUrl;
?>" target="<?php echo $target; ?>"><?php endif; ?>
                    <?php
                    echo
gi_load_template('templates/atomic/atom-image.php', array(
                        'src' => $sponsorImage['url'],
                        'title' => $sponsor->post_title,
                        'width' => $size,
                        'height' => $size
                    ));
                    ?>
                <?php if ($sponsorUrl): ?></a><?php endif; ?>
            </li>


wp-content/themes/roots/archive-sponsor.php
(Not sure why these pages all say "archive" but this does the rows)

    <section class="block diamond-sponsors">
        <div class="container">
            <h2>Diamond sponsors <?php echo $currentYear; ?></h2>

            <div class="row">
                <?php
gi_load_template('templates/atomic/organism-sponsors.php',
array('sponsorType' => 'diamond', 'size' => 400, 'target' => '_blank')); ?>

            </div>
        </div>
    </section>



--
Jody Garnett
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.osgeo.org/pipermail/marketing/attachments/20240202/63204fbc/attachment-0001.htm>
-------------- next part --------------
A non-text attachment was scrubbed...
Name: image.jpg
Type: image/jpeg
Size: 106764 bytes
Desc: not available
URL: <http://lists.osgeo.org/pipermail/marketing/attachments/20240202/63204fbc/attachment-0001.jpg>