The Galleries – A Different Challenge
When I began this adventure of “refactoring
historyofcuba.com”, nothing seemed more confusing to me than the galleries.
There were many of them in a variety of flavors, from xhtml1.0 to html4.1strict
and so on.
On most pages the HTML was a
mess, as if different people had worked on them during different stages of
psychotherapy with Dr. Hannibal Lecter. There were also JavaScript pop-up
galleries, some of which will remain for the sake of nostalgia or because they
add something significant.
Clearly those pages were made for
a different age. It wasn’t difficult to see that, in an iconic presidential
election year, some of these outdated and stubborn galleries had to go.
Here’s the list of “former”
galleries:
·
Independence Gallery
·
Early History Gallery
·
Missile Crisis Gallery (JavaScript)
·
Revolution Gallery (JavaScript)
·
Entrance Gallery
·
Loann in Havana (JavaScript)
·
Tina Panziera in Havana
I decided to focus on Entrance
Gallery (lagaleria/index.htm) which featured a shitload of thumbnails, two
sub-folders and 90 gallery pages (one per thumbnail). Que Cosa!? This was
an effort to consolidate the various galleries above into one official… museum
but remained incomplete and abandoned (and not used on the Site Count made during
the first Obama Administration). The index page was an xhtml1.0 monstrosity,
with JavaScript mouse-over teeth and html table spikes. I must have still been high
on hope at the time.
For the new Cuban History
Gallery, the pages were combined, expanded or eliminated, as deemed appropriate.
This gave me the opportunity to make
improvements and simplify user options. Instead of links to specific galleries,
the site could provide links to specific topics and personalities from a
context-meaningful page…
To enhance the rejuvenation of
the site, I created a completely new version of the thumbnails gallery (left)
using flexbox. This page would also serve as “Home” for the Cuban History
Gallery.
It also seemed prudent to
completely remove Independence Gallery and Early History Gallery
from the site, both remnants of the tragic version nine. There were many other
pages that pointed to these now-defunct galleries… those links will have to be
hunted and “taken out” on a page-by-page basis.
Refactoring all these pages would
be a long and painful process, so I cheated; I created a new template for a new
gallery, and I remade the gallery one page at a time, often keeping the same
file name.
Aside from the expected
elimination and replacement of neo-lithic HTML with Post-Netflix HTML that
includes unordered lists styled with Flexbox, the new design features one
universal “look” for all the pages.
After the template was completed,
this was the basic process:
1.
Open the new template and open an old
gallery page
2.
Copy the title, meta keywords and description
from the old page into the template
3.
Copy the desired content from the old
gallery page and close the file.
4. With everything in the template page, save
it over the old gallery page, with the old name.
5. Continue to whatever actual re-factoring
remains necessary on the new page.
6.
Make world peace. (I got that one from
Martin Rand-Hendriksen. It seemed like a good idea.)
And there you have it. Everything
old is new again.
It’s like moving your good stuff
into a new apartment, getting rid of the junk and keeping your old address.
Most of the work time is spent polishing
the new page, paying attention to new details and, in some cases, adjusting and
enhancing the content.
For example, the Martí Gallery now features new artworks and images. and an additional Martí on a Stamp Gallery is new to the site, after nearly a decade on the shelf as “something
I’ve got to finish…” (the stamps came from my dad, who’s a stamp
collector).
One thing still missing from most
of the galleries is the brief descriptions that describe the image or
personality, with links to additional content. Somehow, within my fuzzy world
view, is the idea that these descriptions are less urgent than completing the
refactoring for the rest of the site… or am I just customizing the refactoring
process to my whims? So be it. The missing descriptions will appear at a later
date.
A gallery navigation system
allows you to walk the galleries as if you were in a museum. The NAV BAR appears twice on each gallery
page; at the top and at the bottom.
As of now, the total number of gallery
files has been trimmed to 30, but a few galleries will be added sometime in the
future, such as; Jose Maceo, Jose Maria Heredia, Maceo’s
mother, Captain General Martinez Campos and perhaps one or two
others. I list them here so they can be a reminder.
The Stylesheet
The stylesheet used on the
galleries, galeria.css, was originally made two decades ago just as the Florida
Supreme Court hand-picked G.W. Bush to be our next President. Netflix had
not started their streaming service yet, but you could rent DVDs by mail (and avoid
the useless conversations that took place while waiting in line at the video
store).
For a few years the stylesheet
just sat there until it was finally used on the new Independence Gallery. By
then the site had many more pictures and I recognized the need to show them on
their own.
Refactoring this stylesheet was
the least bothersome part of working with the galleries. This may be my
favorite of the four stylesheets used on historyofcuba.com… or so it seems,
perhaps only because I’ve spent so little time with it.
Labels: refactoring html