CubingZA / CubingZA-Website

Website for Cubing South Africa (CubingZA)
https://cubingza.org
MIT License
4 stars 1 forks source link

Photo/Video Gallery #37

Open AlphaSheep opened 1 year ago

AlphaSheep commented 1 year ago

Create a photo gallery section that showcases pictures from past events and competitions.

elfishhenry commented 3 months ago

If I were to add this, where would should I make it accessable? Navbar, about sub-menu or somewhere else?

AlphaSheep commented 2 months ago

If I were to add this, where would should I make it accessable? Navbar, about sub-menu or somewhere else?

I think deciding where to show the page is a minor issue. With a photo/video gallery, we need to do quite a bit of work both on the technical and the admin side, because we need:

elfishhenry commented 2 months ago

Alright, I'll need to play with the api a little bit more to learn what I'm doing then I'll start working on it.

elfishhenry commented 2 months ago

If I were to add this, where would should I make it accessible? Navbar, about sub-menu or somewhere else?

I think deciding where to show the page is a minor issue. With a photo/video gallery, we need to do quite a bit of work both on the technical and the admin side, because we need:

  • A way for people to submit photos and videos, with a robust moderation process that includes confirming ownership and rights.
  • Storage - We'd have to think about where to store the images (I have lots of ideas, just need to settle on one). For videos, embeddin Youtube works for a handful of videos, but is quite messy when there are many videos.
  • A pipeline for creating srcsets for the photos.
  • Careful management of image load order, prioritising above the fold and below the fold images. We could just page it, but speaking from experience, people are much more likely to scroll than to navigate to a new page.

Storage: Maybe use a website like Imgur or even store it on a google drive, if you have enough funds to buy a decent amount of storage.
If this would be how we would do it, would we require them to upload it to the website then send the link, or they send the image and we upload the ones to the selected service for them? Maybe an extra storage device for hosting these pictures?

For the organization of the images; first come first serve? Maybe as you said folders, and we display the most recent pictures at the top, then organize the rest into folders of events or competitions sorted by date of the last day of the comp?

Image submission: Maybe google forms like the WCA uses.

Pipeline for secrets for images? Why?

Other than all of these I think I get it sorted.

AlphaSheep commented 2 months ago
  1. Regarding the storage, I wouldn't want to use an image service that requires people to give up more rights than necessary. I would rather use S3 or something like that that keeps the rights questions between us and the person uploading. I wouldn't want people uploading to another website and sending links, because then we have to manage when images get deleted (many services don't error, but rather send a placeholder when the image isn't there).
  2. For image load order, this is incredibly important for page load speed, and impacts SEO considerations like how Google scores the page. One way to improve perceived performance is to prioritise loading "Above the Fold" images, and then lazy load the "Below the Fold" images. You can look this up if you're interested.
  3. Using srcsets (not a typo) is another way to improve performance, mainly for phones and tablets. It's a way to let the device choose what resolution images to load so you can have a fast page load on mobile, and then really high detail on a laptop or desktop.