Shared links to the game show no preview: no Open Graph, Twitter or canonical tags

Đang mở Phù hợp với người mới
  • Có gì không ổn?
#76 0 bình luận 0 reaction 0 người được giao Xem trên GitHub

Chưa có ai nhận issue này.

Đánh giá

Độ khó
2/5
Thời gian dự kiến
1-3 giờ
Mức phù hợp với người mới
62/100
Loại issue
Tính năng
Độ rõ ràng
Khá rõ ràng
Mức độ hoạt động
Sôi nổi
Công nghệ
html, javascript, markdown
Lĩnh vực
frontend, web-dev

Hướng nghiên cứu

Thay đổi nằm trong <head> của index.html quanh các dòng 6-17, nơi có các thẻ title, description và icon hiện tại. Thêm liên kết canonical cùng các thẻ meta Open Graph và Twitter từ đề xuất sửa lỗi, sau đó chạy npm test, vì tests/unit/offline.test.js yêu cầu index.html và sw.js luôn đồng bộ. Ảnh thẻ mạng xã hội assets/social-card.png (1200x630) vẫn cần được tạo trước khi kiểm tra og:image đạt yêu cầu.

Do mô hình lập chỉ mục viết ra từ nội dung của issue.

Mô tả

enhancement good first issue severity: low

Summary

The game page has a title and description but no Open Graph, Twitter card or canonical tags, so a link to the game shared in chat or on social media shows no image and, in some apps, no preview at all.

Where

  • index.html:6-17 (<head>)

Details

The live page's <head> contains only charset, viewport, <title>, the three stylesheets, description, theme-color, the two icons and the manifest. There is no og:title, og:description, og:image, og:url, og:type, twitter:card or <link rel="canonical">.

Impact

Anyone sharing https://tmhsdigital.github.io/Static_Chess/ gets a bare link or a text-only card. The page is also reachable as /index.html, and without a canonical URL both addresses can be indexed.

Suggested fix

Add to <head>:

<link rel="canonical" href="https://tmhsdigital.github.io/Static_Chess/" />
<meta property="og:type" content="website" />
<meta property="og:title" content="Static Chess" />
<meta property="og:description" content="Chess in the browser for two players or against the computer. Works offline." />
<meta property="og:url" content="https://tmhsdigital.github.io/Static_Chess/" />
<meta property="og:image" content="https://tmhsdigital.github.io/Static_Chess/assets/social-card.png" />
<meta name="twitter:card" content="summary_large_image" />

The image needs to be created: a 1200x630 PNG of the board in play, saved as assets/social-card.png. Open Graph images must use absolute URLs.

Acceptance criteria

  • The tags above are present on the live page
  • The og:image URL returns 200 and is 1200x630
  • npm test still passes (tests/unit/offline.test.js compares index.html with sw.js)

Getting started

  • Relevant files: index.html, assets/
  • How to run tests: npm test, npm run format

Filed by repo-audit/pages-audit at 0144de7. Severity: low. Effort: S. audit-key: enhancement|index.html|og-meta

Ngôn ngữ chính
JavaScript
Star
4
Fork
2
Merge trung bình
4 giờ 8 phút
Pull request đã merge (30 ngày)
1

Chuẩn bị môi trường

Bắt đầu từ đâu

  1. Đọc hết issue, rồi đọc hướng dẫn đóng góp của dự án.
  2. Bình luận trên issue rằng bạn sẽ nhận — tránh hai người làm cùng một việc.
  3. Fork repository và làm thay đổi trên một nhánh.
  4. Mở pull request có tham chiếu số hiệu của issue.

Issue khác của TMHSDigital/Static_Chess

Tất cả issue của TMHSDigital/Static_Chess

Issue tương tự

Thêm issue về JavaScript

Nhận issue mới trong hộp thư của bạn

Bản tóm tắt ngắn những issue GitHub phù hợp với người mới.