# SaaStock Gallery Pages — SEO, AEO & GEO Master Playbook (v2) Extends the master SaaStock SEO playbook. Covers the full pipeline from raw camera files in Google Drive to live, schema-optimized gallery pages on saastock.com. --- ## Step 0: Image Processing Pipeline Before any page gets built, raw event photos need to be triaged, classified, renamed, captioned, converted, and organized. This is the step most teams skip — and then every image hits the site as `DSC03753.jpg` with no alt text, no schema, and zero SEO value. ### 0a. Export from Google Drive Source folders follow the pattern `S23 Photos Shared > Pitch Comp`, `S23 Photos Shared > Expo`, etc. Files are camera defaults (`DSC03753.jpg`, `DSC03771.jpg`). **Workflow options (fastest to slowest):** 1. **Google Drive desktop app** (recommended) — syncs Drive folders to your local filesystem. The `S23 Photos Shared` folder appears as a regular folder on your Mac. Drag-and-drop from there into Conductor or the processing pipeline. No manual download step. 2. **Drive → zip download** — select all, download as zip, unzip locally. Works but slow for large folders. 3. **Drive API / rclone** — for bulk automation across dozens of event folders. Overkill for a single event, useful when processing 10+ historical galleries at once. ### 0b. Visual classification Go through each image and assign it to a section. Minimums are listed — there is no hard maximum. If you have 30 good live shots, use 30. | Section | Minimum | What to look for | |---------|---------|-----------------| | `live` | 10+ | Stages with audience visible, expo floor with foot traffic, networking areas with people, speaker on stage mid-talk. **Crowd energy is the priority — never show empty chairs or thin crowds.** Every live photo should make the event look packed. | | `bts` (behind the scenes) | 10+ | Sponsor booths (before or during the event), rigging, LED wall assembly, empty venue pre-build, production crew at work. This section absorbs both booth setup and build-out photos — there is no separate "setup" section. The more sponsor booths photographed, the better. 15–20 booth photos is normal for a large event. | | `signage` | 2–4 | Partnership rate boards, wayfinding, next-edition booking boards. | | `map` | 1 | **The official floor map for the event.** See "Floor Map as Source of Truth" below. | | `video` | 1+ | Highlight reels, booth pan clips, walkthrough clips. No upper limit — if you have 10 good clips, use 10. | **Floor Map as Source of Truth** Every event folder should be scanned for the master floor map — the layout diagram showing booth positions, stage locations, and sponsor names. This image is critical for three reasons: 1. **Sponsor verification.** The floor map lists every company that paid for space. Cross-reference it against the sponsor list in the event's `data.ts`. Any company on the map but missing from the sponsor list gets backfilled immediately. 2. **Tagging.** The floor map image gets tagged with section `map` and a standardized file name: `map-floorplan-[series]-[year].webp` (e.g., `map-floorplan-europe-2023.webp`). This naming convention is non-negotiable — it enables a future `/maps/` rollup page showing floor plans from every event side by side. 3. **Schema.** The floor map `ImageObject` gets additional properties: `"@type": "ImageObject"` with `"about": { "@type": "Event", "@id": "..." }` and `"name": "Official floor plan — SaaStock [Series] [Year]"`. It should also carry `"representativeOfPage": false` (the hero live shot stays representative). If no floor map is found in the Drive folder, flag it explicitly — don't silently skip it. The map may exist in a different subfolder (look for `Floor Plan`, `Floorplan`, `Map`, `Layout`, `Expo Layout`) or in the event's Dropbox/shared folder outside Drive. **Selection criteria (keep/kill):** Keep: - Shows scale (wide shots with visible crowd density) - Shows sponsor branding clearly (booth name legible) - Shows energy (audience engaged, speaker mid-gesture, packed aisle) - Shows production quality (LED walls, lighting rigs, stage design) - Named speakers on stage (verifiable from the speaker list) Kill: - Blurry, dark, or poorly composed - Duplicates of the same moment (pick the best one) - Close-ups of food, lanyards, or swag with no brand context - **Empty chairs, thin crowds, or sparse aisles** — these undercut the event's credibility. If a photo shows a half-empty room, kill it regardless of other qualities. - Photos where individuals are identifiable in unflattering or unguarded moments ### 0c. Intelligent renaming Every file gets renamed before it touches the website. The naming convention encodes section, subject, and is URL-safe. **Pattern:** `[section]-[subject-slug].[ext]` **Section prefixes:** | Section | Prefix examples | |---------|----------------| | Live — stages | `stage-bootstrap-audience`, `stage-mainstage-keynote`, `stage-muckrack-overnight-success` | | Live — panels | `panel-audience-and-stage`, `panel-speaker-mic-closeup` | | Live — audience | `audience-silent-disco`, `audience-networking-lounge` | | Live — expo | `expo-overview-from-balcony`, `expo-crowd-foot-traffic` | | Live — team | `team-founderpath-selfie`, `team-saastock-crew` | | Behind the scenes — booths | `expo-[company]-booth`, `expo-[company]-booth-wide`, `expo-[company]-booth-overhead` | | Behind the scenes — build | `mainstage-led-setup`, `mainstage-rigging-build`, `venue-podcast-stage-overview` | | Signage | `branding-dublin-2024-booking`, `branding-usa-austin-2024` | | Map | `map-floorplan-europe-2023` | | Video | `video-expo-hall-walkthrough`, `video-founderpath-booth-pan` | **Rules:** - All lowercase, hyphens only, no spaces or underscores - Company names in booth photos use the company name as-is: `expo-vanta-booth`, `expo-chargebee-booth` - Speaker names in stage photos use the talk subject, not the speaker name: `stage-muckrack-overnight-success` not `stage-greg-galant` - Never use camera defaults (`DSC03753`, `IMG_4523`, `MG_0082`) - Never use sequential numbers (`photo-1`, `photo-2`) — they carry zero semantic value **Batch renaming:** Create a CSV mapping file first, then apply: ```csv original,renamed,section,keep DSC03753.jpg,stage-pitch-comp-speaker-1.jpg,live,yes DSC03771.jpg,stage-pitch-comp-wide.jpg,live,yes DSC03778.jpg,stage-pitch-comp-branding.jpg,live,no DSC03788.jpg,stage-pitch-comp-judges.jpg,live,yes ``` ### 0d. Alt text + caption generation For each kept image, write two distinct pieces of text: **Alt text** — what the image shows, for screen readers and Google Images indexing. Pattern: `[Context] at SaaStock [Series] [Year] — [specific visual description]` Context labels (only two): - `Live during SaaStock Europe 2023` — for any photo taken while the event was running (audience present, doors open) - `Behind the scenes at SaaStock Europe 2023` — for everything else: booth setup, rigging, empty venue, production crew, build-out. One label covers all non-live photos. Rules: - Never start with "Image of" or "Photo of" - Include company names visible in frame (e.g., Founderpath, Vanta) - Include venue name (RDS Simmonscourt) and city (Dublin) - Keep under 125 characters where possible; go longer for accuracy - Never duplicate alt text across images on the same page **Caption** (`
`) — editorial context that the alt text can't convey. Pattern: `[Context label] — [one sentence of editorial insight]` Rules: - Start with the same context label prefix as the alt text - Add information the viewer can't see: "17 years from a 2005 podcast to $50M+ ARR" or "Founderpath's Wall Street Journal feature wall" - Link speaker names to `/speakers/[slug]/` where profiles exist - Link company names to sponsor pages or external URLs where relevant - Never duplicate the alt text verbatim — Google penalizes identical alt + caption **Example pair:** ``` Alt: "Live during SaaStock Europe 2023 — Muck Rack founder Greg Galant on the Bootstrap Stage with his Overnight Success Story timeline slide" Caption: "Live during the event — [Greg Galant](/speakers/greg-galant/)'s 'Overnight Success Story' slide: 17 years from a 2005 podcast to $50M+ ARR and a $180M Susquehanna Series A." ``` ### 0e. Convert to WebP All images ship as WebP. No JPEG fallback needed — WebP is supported by every browser since Safari 14 (2020) and every relevant crawler. **Conversion specs:** | Output | Width | Quality | Use | |--------|-------|---------|-----| | Full-res | 1600px (long edge) | 80 | Lightbox / direct link | | Thumbnail | 600px (long edge) | 75 | Grid display / srcSet | **Tools:** - `cwebp` (Google's CLI): `cwebp -q 80 -resize 1600 0 input.jpg -o output.webp` - Squoosh CLI: `squoosh-cli --webp '{"quality":80}' --resize '{"width":1600}' input.jpg` - Sharp (Node.js): for batch processing in a build script **Video:** Ship `.mp4` (H.264) as the primary format. Add `.webm` (VP9) as the first `` for Chrome/Firefox efficiency. Always generate a poster frame as `.webp`. ### 0f. Directory structure ``` /[series]/[year]/gallery/ ├── photos/ ← Full-res WebP (1600px) │ ├── stage-bootstrap-audience.webp │ ├── expo-founderpath-booth-wide.webp │ └── ... ├── thumbs/ ← Thumbnails (600px) │ ├── stage-bootstrap-audience.webp │ ├── expo-founderpath-booth-wide.webp │ └── ... └── video/ ├── video-expo-hall-walkthrough.mp4 ├── video-expo-hall-walkthrough.webm ├── video-expo-hall-walkthrough-poster.webp └── ... ``` ### 0g. Build the photo manifest As you process each image, log it in a JSON manifest. This manifest drives the HTML generation, JSON-LD schema, image sitemap, and sponsor outreach list. ```json { "event": "SaaStock Europe 2023", "series": "europe", "year": 2023, "venue": "RDS Simmonscourt", "city": "Dublin", "country": "Ireland", "dates": "October 16–18, 2023", "stats": { "attendees": 3521, "speakers": 164, "countries": 53 }, "media": [ { "type": "image", "file": "stage-bootstrap-audience", "section": "live", "width": 1600, "height": 2134, "dateCreated": "2023-10-17", "representativeOfPage": true, "name": "Bootstrap Stage at standing-room capacity", "alt": "Live during SaaStock Europe 2023 — Bootstrap Stage at RDS Simmonscourt, Dublin, with a packed standing-room crowd", "caption": "Live during the event — Bootstrap Stage at standing-room capacity. Dublin 2023's RDS hall amplified the Bootstrap Stage well past its seated capacity.", "about": [] }, { "type": "image", "file": "expo-founderpath-booth-wide", "section": "bts", "width": 1600, "height": 1200, "dateCreated": "2023-10-15", "representativeOfPage": false, "name": "Founderpath sponsor booth in the expo hall", "alt": "Behind the scenes at SaaStock Europe 2023 — Founderpath sponsor booth with purple branding, stools, monitors, and a Wall Street Journal display", "caption": "Behind the scenes — Founderpath's expo booth coming together the day before opening at RDS Simmonscourt. Branded stools, lead-capture USB drives, and a Wall Street Journal feature wall.", "about": [ { "type": "Organization", "name": "Founderpath", "url": "https://founderpath.com" } ] }, { "type": "video", "file": "video-expo-hall-walkthrough", "section": "video", "duration": "PT28S", "dateCreated": "2023-10-17", "name": "27-second walkthrough across the expo hall and Mainstage", "alt": "Live during SaaStock Europe 2023 — walkthrough clip across the expo hall and Mainstage at RDS Simmonscourt", "caption": "Live walkthrough across the SaaStock Europe 2023 Mainstage and expo floor at RDS Simmonscourt." } ] } ``` --- ## Step 1: Page Structure ### URL pattern ``` saastock.com/europe/2023/gallery saastock.com/usa/2026/gallery saastock.com/europe/2024/gallery ``` Always nested under the event, never standalone. ### Required sections (in order) 1. **Hero** — dark background, event name, gallery subtitle, stat bar (X live photos, Y behind the scenes, Z videos) 2. **Section nav** — pill buttons linking to `#live`, `#bts`, `#signage`, `#map`, `#video`. Only show sections that have content. 3. **Video lead** — if a highlight reel exists, lead with it. Video is the highest-engagement format and Google rewards video above the fold. 4. **Live during the event** — photos taken while doors were open. Stages, audience, expo floor, networking. Every photo should show crowd energy. 5. **Behind the scenes** — sponsor booths (setup or live), rigging, build-out, production, empty venue. This is one combined section — no separate "setup" and "build-out." 6. **On-site signage** — partnership boards, wayfinding, next-edition booking boards. 7. **Floor map** — the official event floor plan. Tagged as `map` section, always included when available. See "Floor Map as Source of Truth" above. 8. **More video** — vertical clips, booth pans, backstage. No upper limit on count. 9. **About this event** — 2-paragraph summary with key stats, speaker links, and `Speakable` schema (see below). This is the AEO-critical section. 10. **More galleries nav** — prev/next links to other editions' galleries. Add only when a second gallery exists; don't link to nowhere. ### Section badge labels | Section | Badge text | Color | |---------|-----------|-------| | Live event | `Live · during the event` | Green (#0BA86A) | | Behind the scenes | `Behind the scenes` | Slate (#3F4861) | | Signage | `On-site signage` | Pink (#E91E8C) | | Floor map | `Official floor map` | Navy (#160E41) | --- ## Step 2: Schema (JSON-LD) ### Use `@graph` — not multiple `