检查社交平台或消息中的链接预览图片，核对尺寸、宽高比、文件大小和元标签，调整图片与网址设置，排查图片不显示或重要内容被裁切的原因。
Use when auditing Open Graph tags or generating og:image assets. Applies to any page that may be shared on social networks or messaging platforms.
这项技能检查在社交平台或消息中分享网址时显示的图片，并整理图片尺寸与元标签。它会获取Open Graph的og:image指定的图片，核对宽度、高度、宽高比和文件大小。还涵盖生成或缩放为1200×630像素、以80%至85%的质量导出JPEG，以及审查图片网址和尺寸信息标签。
适合在页面发布前检查分享图片，或排查社交平台不显示图片、重要内容被裁切等问题。也可用于审查多个页面的Open Graph标签，确认标签中的尺寸与图片实际尺寸一致。
og:image，检查尺寸、文件大小及网址设置。”资料推荐1200×630像素，宽高比约为1.91:1。文件应小于5MB，最好小于1MB，并使用JPEG或PNG。较旧的平台对WebP支持有限。图片网址必须使用绝对HTTPS网址。
本介绍由 AI（OpenAI Codex）根据公开的 SKILL.md 撰写。准确的规格请查看下方原文。
AI 仅根据 SKILL.md 的内容，从 4 个方面进行了评估。星标数和热度不计入评估。
总分按每项 A=25 分、B=15 分、C=5 分相加。 由 AI（OpenAI Codex）于 2026年10月23日 评估。仅供参考，安装前请同时查看原文。
安装前可以查看交给 AI 代理的指令内容。
An incorrectly sized og:image is displayed poorly or not at all on social platforms—Facebook, Twitter/X, LinkedIn each crop or skip images that don't meet their requirements, resulting in blank or distorted link previews.
Find the og:image meta tag in <head> and fetch the image URL. Check the image dimensions and file size. Flag if width < 1200px, height < 630px, aspect ratio differs significantly from 1.91:1, or file size exceeds 5 MB.
Generate or resize the og:image to exactly 1200×630 pixels. Export as JPEG at 80–85% quality to balance visual quality and file size. Reference the absolute HTTPS URL in the og:image meta tag. Add og:image:width and og:image:height tags to help platforms render the image without downloading it first.
Social platforms use og:image to construct the visual card shown when a URL is shared. An image too small may be skipped or shown as a thumbnail. An image with the wrong aspect ratio gets cropped, often cutting off important content. The recommended 1200×630 size ensures optimal display across Facebook, LinkedIn, Slack, and iMessage.
Check the og:image meta tag value. Fetch the image and verify: (1) dimensions are at least 1200×630 px, (2) aspect ratio is approximately 1.91:1, (3) file size is under 5 MB, (4) URL is absolute HTTPS, (5) og:image:width and og:image:height tags match actual dimensions. Flag relative URLs or images smaller than 600×315 px.
For full implementation details, code examples, and framework-specific guidance,
see references/rule.md.
Rule page: https://frontendchecklist.io/rules/seo/og-image-size
还没有评价。欢迎分享你的使用感受。
无需登录即可发表。欢迎分享使用感受、提问，或说明在哪些环境下无法运行。
还没有评论。来写第一条吧。
Create and review custom 404 pages that help visitors recover from broken or moved links through search and navigation. Check the rendered page and HTTP response so missing content returns a proper 404 status.
中文简介正在准备中。当前显示英语简介。
Audit or create a dedicated About page that explains a website’s purpose and identifies its people or organization. Review the rendered output and supporting information, including expertise and contact details, to find gaps.
中文简介正在准备中。当前显示英语简介。
Review and add automated accessibility checks for components, pages, and continuous integration workflows. Use axe-based tools to detect structural and attribute issues, while identifying checks that still need keyboard or screen reader testing.
中文简介正在准备中。当前显示英语简介。
Review sign-in, registration, multi-factor authentication, and account recovery for accessibility barriers. Find blocked paste, difficult code entry, and inaccessible backup methods, then suggest authentication paths that support password managers, autofill, or device approval.
中文简介正在准备中。当前显示英语简介。
Review form errors, success messages, and live updates so screen reader users receive important notifications. Check the HTML delivered to the browser, announcement settings, display duration, and dismissal controls, then identify specific elements that need changes.
中文简介正在准备中。当前显示英语简介。
Review HTML tables so screen reader users can understand how headers and data relate. Check header markup, table descriptions, and merged cells, then identify specific fixes and ways to verify them.
中文简介正在准备中。当前显示英语简介。