AI 技能人工智能【免费下载链接】marketingskillsMarketing skills for Claude Code and AI agents. CRO, copywriting, SEO, analytics, and growth engineering.项目地址https://gitcode.com/GitHub_Trending/mar/marketingskills点击查看免费下载本指南围绕开源仓库 GitHub_Trending/mar/marketingskills 中 site-architecture 技能 的核心参考资料 mermaid-templates.md 展开系统讲解如何用 Mermaid 语法绘制可视化站点地图Visual Sitemap。你将获得 7 套可直接复制运行的模板覆盖基础层级、导航分区、URL 标注、Hub-and-Spoke 内容模型、内部链接流向、重构前后对比与颜色编码约定并学会将其融入页面层级设计、URL 规划与内部链接策略的完整工作流适用于 AI Agent 与人工共同产出可交付给设计团队的信息架构方案。Mermaid 与 ASCII 树何时该用可视化站点地图在动手画图之前先明确一个工具选择问题。site-architecture 技能SKILL.md同时维护了两套表达层级的方式ASCII 树适合快速草稿层级、纯文本上下文如终端、聊天窗口以及结构简单的站点Mermaid适合可视化演示、表达复杂关系、标注导航分区Header / Footer / Sidebar或内部链接模式。当你要把信息架构方案分享给设计团队做导航与线框参考时Mermaid 是首选。该技能自带的评估用例evals/evals.json 中的 eval 5就明确要求产出能被大多数工具渲染的 Mermaid 图并将其作为与设计团队协作的标准交付物。下面的 7 套模板全部来自 mermaid-templates.md可直接复制、修改节点名称与连接关系后使用。模板一基础层级Basic Hierarchy最简单的自顶向下页面层级适合在规划早期快速建立全局认知要点拆解graph TDtop-down声明自顶向下绘制方向与浏览器用户从上往下浏览的心智模型一致节点用ID[标签]形式ID是节点唯一标识如HOME、FEAT标签是显示文本标签内的br/是 Mermaid 支持的 HTML 换行用来把页面名和URL 路径分两行展示--表示父子关系被指向的节点在层级上是子页面。这套模板对应 SKILL.md 中的层级级别Hierarchy Levels模型/是 L0/features是 L1 一级栏目/features/analytics是 L2 栏目页再往下的详情页则是 L3。画图时建议为每个节点标注其所在的层级级别便于检查是否有页面被埋得太深——SKILL.md 的3 次点击规则提醒我们任何重要页面都应当能在 3 次点击内从首页到达如果关键页面深埋在 4 层以上就该考虑扁平化。模板二带导航区域的层级Hierarchy with Navigation Zones利用subgraph子图把页面按出现在哪个导航区域分组直观呈现 Header、功能页、Footer 各自承载的页面实战价值在于它把两件事合并在了一张图上层级关系——HOME -- FEAT -- F1表达页面归属导航位置——subgraph表达每个节点出现在哪块导航里。这与 SKILL.md 的导航设计规则相互印证Header 主导航最多4–7 项超过会引发决策瘫痪CTA 按钮如Get Started ★永远放在最右侧Logo 在左侧链接回首页导航项按访问优先级排序。该技能还补充了 Footer 的分栏组织方式Product / Resources / Company / Legal 四栏与侧边栏、面包屑等其他导航类型完整模式可参考 navigation-patterns.md。模板三带 URL 标签的层级Hierarchy with URL Labels每个节点同时展示页面名与 URL 路径用small把 URL 渲染成较小字号区分层级信息这张图最适合在确定 URL 结构阶段使用。SKILL.md 给出了配套的 URL 设计原则画图时应逐条核对人类可读——/features/analytics而不是/f/a123连字符而非下划线——/blog/seo-guide而不是/blog/seo_guideURL 反映层级——路径应与站点结构一致统一尾部斜杠策略一律小写——/About应 301 到/about短而具描述性——/blog/how-to-improve-landing-page-conversion-rates太长/blog/landing-page-conversions更优。同时 SKILL.md 提供了一张按页面类型划分的 URL 模式表Feature 页/features/{name}、博客/blog/{slug}、文档/docs/{section}/{page}、对比页/compare/{competitor}等可以与模板三组合成完整的URL 地图表交付物。完整的六大站点类型SaaS、内容站、电商、文档站、混合站、小企业站的层级与 URL 模板见 site-type-templates.md。模板四Hub-and-Spoke 内容模型Hub-and-Spoke Content Model面向内容密集型站点的经典模型一个 Hub 枢纽页连接多个 Spoke 分支文章Spoke 之间再互相链接图例说明实线-- Hub 与 Spoke 之间的主链接虚线-.- Spoke 之间的交叉链接cross-linksstyle HUB fill:#f9f,...通过粉色填充 加粗描边让 Hub 枢纽页在视觉上脱颖而出。这个模型与 SKILL.md 的内部链接策略直接对应。SKILL.md 定义的四种链接类型中Hub-and-Spoke正是把集群内容连接到枢纽页每个 Spoke 都要链接回 HubHub 链接到所有 SpokeSpoke 之间按相关性互相链接。典型的落地形态如下Hub: /blog/seo-guide (comprehensive overview) ├── Spoke: /blog/keyword-research (links back to hub) ├── Spoke: /blog/on-page-seo (links back to hub) ├── Spoke: /blog/technical-seo (links back to hub) └── Spoke: /blog/link-building (links back to hub)该技能的内链规则还包括不允许孤立页每个页面至少有一条入站内链、锚文本要具描述性不要用 click here、每 1000 字内容约 5–10 条内链、重要页面首页、关键功能页、定价页获得更多内链、全站实现面包屑、文章底部提供相关内容区。模板五内部链接流向Internal Linking Flow用graph LRleft-right 从左到右展示不同站点区块之间的交叉链接配合子图把站点划分为 Marketing / Content / Product 三大区域这张图表达的正是 SKILL.md 中的跨区块链接Cross-section功能页链接到相关案例研究、博客链接到产品页等。图的布局方式graph LR适合宽度较大的信息架构方案与模板一、二的graph TD形成互补——同一套节点关系可以根据展示场景在两种方向间切换。SKILL.md 给出的内链审计清单可以作为画完这张图之后的验证步骤每个页面至少有一条入站内链没有 404 的失效内链锚文本具描述性不是 click here 或 read more重要页面拥有最多的入站内链所有页面都实现了面包屑博客文章存在相关内容链接跨区块链接连接功能页与案例研究、博客与产品页模板六重构前后对比Before/After Restructuring把当前结构和建议结构放在同一张图的左右两个子图里并排对比一个关键的 Mermaid 工程细节由于两个子图处于同一张图中节点 ID 必须全局唯一所以Before子图统一加B_前缀、After子图统一加A_前缀避免 ID 冲突导致渲染错误。这张模板对应站点重构场景——evals/evals.json 中的 eval 2 描述了典型的导航混乱、50 页面、用户找不到内容的存量站点重构需求其期望输出正是先做内容清单content inventory再应用 3 次点击规则与扁平/深度权衡重组页面给出Before/After 结构图并处理被移动页面的 301 重定向。从图例可以直观看到Before 侧是首页直挂 8 个子页的扁平失序结构After 侧收敛为 Features / Resources / Company 三个二级栏目每个栏目再挂子页深度与可发现性达到平衡。模板七颜色编码约定Color-Coding Conventions用节点样式区分页面状态、优先级或类型适合评审会上快速标注哪些要新建、哪些要删除、哪些保持不动颜色图例绿色#4CAF50现有页面无需变更蓝色#2196F3需要新建的页面红色#f44336需要删除或重定向的页面黄色#FFC107需要重构或移动的页面紫色#9C27B0高优先级 / CTA 页面注意style语句的写法style 节点ID fill:颜色,color:#fff其中color:#fff让节点文字反白以保证对比度。文档中给出了黄、紫两个约定的色值#FFC107、#9C27B0虽然示例代码只展示了绿蓝红三种用法但在实际使用中可以用同样的style语法为待重构和高优先级 CTA节点上色——例如为定价页 CTA 使用紫色高亮。把这 7 套模板放入 Agent 工作流在 marketingskills 中这些模板不是孤立的绘图素材而是 site-architecture 技能完整交付链路的一部分。当用户或 AI Agent请求规划/映射/重构网站层级、导航、URL 结构与内部链接时SKILL.md 会引导产出如下五类交付物其中 Mermaid 图与其余四类相互印证页面层级ASCII 树——每个节点带 URL 的完整站点结构用 SKILL.md 规定的树形格式可视化站点地图Mermaid——用graph TD配合子图标注导航分区即本指南的模板一至模板六URL 地图表——页面 / URL / 父页面 / 导航位置 / 优先级五列可与模板三配套使用导航规格——Header 项有序、含 CTA、Footer 分区与链接、侧边栏、面包屑实现说明内部链接计划——Hub 页及其 Spoke、跨区块链接机会、孤立页审计、关键页推荐链接数。该技能的评估体系evals.json覆盖了典型触发场景可以作为验证自己绘图能力的自测清单新建 SaaS 官网eval 1期望产出含主页/功能页/定价/关于/博客 对比页与集成页的 ASCII 树与 Mermaid 图并给出导航建议4–7 个 Header 项存量站点重构eval 2期望先做内容清单、应用 3 次点击规则、给出 Before/After 结构图并处理 301 重定向URL 结构争论eval 3期望应用 URL 模式表推荐更短更干净的路径并给出完整 URL 地图程序化 SEO 扩展eval 4新增 200 个集成页 50 个对比页时期望用 Hub 页承载/integrations、/compare、套用 Hub-and-Spoke 内链模型、让程序化页面不占用主导航、并考虑爬取预算。绘制规范与最佳实践小结综合模板与 SKILL.md总结一套可复用的绘制规范方向选择默认graph TD自顶向下跨区块链接流向分析模板五改用graph LR横向布局宽屏展示更清晰子图命名subgraph Header Nav加引号避免空格或特殊字符导致解析问题ID 管理节点 ID 全图唯一重构对比图中用B_/A_前缀区分前后两个阶段模板六标签换行br/分行展示页面名 URLURL 可用small弱化视觉权重模板三线型语义实线--表示主结构链接虚线-.-表示交叉/辅助链接模板四颜色语义遵守绿/蓝/红/黄/紫五色约定配合style 节点ID fill:色值,color:#fff统一反白文字模板七与文字工具互补快速草稿用 ASCII 树见 SKILL.md 的 ASCII Tree Format 章节正式交付或跨团队评审用 Mermaid 图。掌握这 7 套模板之后你就能在数分钟内把任意站点的层级、导航、URL 与内链策略沉淀为可渲染、可评审、可交付的视觉资产——无论是新建站点的第一版 IA 草图还是存量站点的重构提案都能直接用这套开箱即用的 Mermaid 素材库完成。赞分享AI 技能人工智能【免费下载链接】marketingskillsMarketing skills for Claude Code and AI agents. CRO, copywriting, SEO, analytics, and growth engineering.项目地址https://gitcode.com/GitHub_Trending/mar/marketingskills点击查看免费下载相关推荐【亲测免费】 XML 站点地图生成器高效构建网站站点地图XML 站点地图生成器高效构建网站站点地图 1. 项目基础介绍 该项目是一个开源的XML站点地图生成器旨在帮助开发者轻松创建网站的站点地图。项目主要使用Jaclaude-seo 的 Sitemap 架构实战XML 站点地图校验、质量门禁与规模化生成指南claude seo 的 Sitemap 架构实战XML 站点地图校验、质量门禁与规模化生成指南 站点地图Sitemap是搜索引擎发现与理解网站结构的入口MaterialStyledDialogs终极指南打造Android平台最美自定义对话框MaterialStyledDialogs终极指南打造Android平台最美自定义对话框 MaterialStyledDialogs是一款专为Android开上一篇eslint-plugin-react 的 jsx-one-expression-per-line 规则详解让 JSX 每行只容纳一个表达式下一篇Qlever性能调优秘籍内存管理与并发控制的最佳实践创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考
