Card de partajare 1200×630, og:locale și apple-touch-icon
Rezolvă primele șapte puncte din #8 (closed). Al optulea — câmpul shareImage pentru
produs, colecție și articol — vine în MR separat: e migrare de bază plus ecran
de admin, și n-are efect până nu alege Vitalie pozele.
Ce era
Previzualizarea oricărei pagini fără poză proprie era banda de logo 700×95, cu fundal transparent. E sub minimul acceptat de platforme, deci pe cele mai multe cardul apărea fără nicio imagine, iar unde apărea, transparența se turna pe negru și se vedea un wordmark negru pe un dreptunghi negru. Acoperea 54 de pagini, printre ele prima pagină în toate cele trei limbi.
Ce s-a schimbat
og-default.jpg — 1200×630, opac, wordmarkul centrat, generat din
hyperice-logo.svg. Fundalul negru e ales de Vitalie dintre două variante
randate. 11 KB.
og:image:width / og:image:height — doar pentru card. O pagină de produs
își folosește propria poză (800×869) și a-i pune eticheta 1200×630 ar strica
prima randare, exact invers decât e rostul celor două tag-uri. Am semnalat
abaterea față de litera issue-ului; motivul e în comentariul din cod.
og:image:alt — numele site-ului pentru card, titlul paginii pentru o poză
proprie.
og:locale — ro_MD / ru_RU / en_US, plus câte un og:locale:alternate
pentru celelalte două limbi, reciproc între cele trei versiuni ale aceleiași
pagini.
apple-touch-icon.png — 180×180, opac (iOS ignoră transparența și o umple
cu negru), referit din index.html cu ?v=1, aceeași regulă de adresă fixă ca
la favicon.
tools/image-optimizer — comit separat. Unealta citea iconița ca „PNG care
ar trebui să fie JPEG" și îi schimba numele, adică exact adresa pe care o caută
iOS. Numele impuse de platformă sunt acum protejate; bugetul și fratele WebP
rămân obligatorii și pentru ele.
Verificare
-
npx tsccurat pe ambele;oxlintcu singurul avertisment preexistent; 196 de teste frontend, 431 backend, ambele build-uri trec. - Randat local, pe cele trei limbi: cardul, dimensiunile și
og:image:altapar doar unde trebuie; pe/products/hypervolt-3se folosește poza produsului, fără dimensiuni, cualt= numele produsului.og:localeiesero_MD,ru_RU,en_US, fiecare cu exact celelalte două ca alternate. -
sips:og-default.jpg1200×630hasAlpha: no;apple-touch-icon.png180×180hasAlpha: no. - Unealta rulată din nou: 622 de imagini, toate în formă, iconița nu s-a
redenumit,
npm run checkcurat.
Teste noi (24). Fiecare a fost verificat prin mutație — se strică
implementarea, se confirmă că testul pică, se repară. Printre ele: două teste
care țin cele două copii ale constantelor (cardul și maparea de limbi) egale
între server și aplicație, pentru că o schimbare într-un singur fișier ar trece
altfel nedetectată; un test care verifică octeții reali ai iconiței, inclusiv
absența chunk-ului tRNS (un PNG cu paletă poate fi transparent fără să aibă
canal alfa); și unul care prinde dimensiunile rămase în urmă când vizitatorul
trece de la o pagină cu card la una cu poză proprie.
Reparat pe drum
Construiam lista de limbi cu alternatesFor(path), dar path are deja
prefixul de limbă pus, deci ar fi produs /ru/ru/... dacă cineva ar fi folosit
și căile de acolo. Azi se citea doar limba, deci nu se vedea. Ambele fișiere
merg acum direct pe lista de limbi, care e oricum sursa din care derivă
alternatesFor.
Ce nu se poate verifica de aici
Facebook Sharing Debugger cere ca pagina să fie live, deci criteriul acela se confirmă după deploy.