如何打造出色的 GitHub 个人资料

真可惜！

欢迎👋

如果您是 GitHub 新手或主要使用私有 GitHub 存储库，则可能您还没有 GitHub 个人资料。

GitHub 个人资料可以为访问您个人资料的用户提供基本信息。拥有一份精心制作的个人资料甚至可以帮助您脱颖而出，尤其是当您开始为开源项目做出贡献并开始受到关注时。

在本文中，我将展示如何创建你自己的 GitHub 个人资料。我还会分享如何获取个人资料的灵感。最后，我将分享一些资源和技巧，帮助你创建一个很棒的 GitHub 个人资料！

创建你的 GitHub 个人资料

在开始自定义 GitHub 个人资料之前，您首先需要创建一个。

这是GitHub 提供的有关如何设置个人资料的简短指南。

但您需要做的就是：

创建一个与您的 GitHub 用户名相同的新存储库。
将文件添加README.md到您的新存储库。

例如，我的 GitHub 用户名是kshyun28。要创建我的个人资料，我需要创建一个名为kshyun28的存储库，然后添加一个README.md文件。

设置好您的repository和README.md文件后，请前往您的 GitHub 个人资料https://github.com/YOUR-USERNAME验证您的个人资料是否可见。

就我而言，应该是https://github.com/kshyun28。

自定义您的 GitHub 个人资料

现在您已经有了 GitHub 个人资料，是时候发挥创意了！

关键在于在个人资料中展现你的个性。你的 GitHub 个人资料不必像 LinkedIn 那样过于正式。

我还建议从简单的开始。这有助于你的 GitHub 个人资料建立并运行。以后当你有新想法时，你可以随时改进你的个人资料。

GitHub 风格的 Markdown、格式和 HTML

要自定义你的 GitHub 个人资料README.md，你需要使用GitHub Flavored Markdown。如果你之前写过 Markdown 内容，那么格式化对你来说应该很容易。

如果这是您第一次使用 markdown 写作，您可以访问GitHub 的文档来熟悉可用的格式选项。

您还可以使用HTML为您的个人资料添加额外的格式选项。

我发现以下 HTML 标签很有用：

不间断空格：nbsp;
div 居中对齐：<div align="center"> </div>

您可以使用大多数 HTML 标签，但 GitHub Flavored Markdown 会过滤掉以下 HTML 标签：

<title>
<textarea>
<style>
<xmp>
<iframe>
<noembed>
<noframes>
<script>
<plaintext>

💡：要了解更多信息，请参阅与 HTML 块相关的GitHub Flavored Markdown Spec 。

寻找灵感

为了帮助你入门，我建议你看看其他优秀的 GitHub 个人资料，从中汲取灵感。你可以访问awesome-github-profile-readme，我在创建个人资料时就从那里获得了灵感。

由于这些个人资料是开源的，您可以将一些好的想法用于您的精彩个人资料！

你也可以查看我的个人资料来获取一些想法。😉

添加徽章

想要在你的个人资料中添加徽章，可以查看markdown-badges。该仓库提供丰富的徽章选择，涵盖编程语言到 Netflix 等流媒体平台。

如果您找不到所需内容或想要创建自定义徽章，您可以访问shields.io，这是markdown-badges所使用的。

这是我在我的个人资料中使用markdown-badges 的一个例子。

添加图标

为了在您的个人资料中添加skills或tech stack部分，我建议使用提供漂亮图标的技能图标。

如果您的图标不受支持，您可以访问simpleicons，它有超过 2900 个流行品牌的 SVG 图标。

下面是一个示例，我在我的个人资料的技术堆栈部分中使用技能图标。

使用表情符号

在 GitHub Flavored Markdown 中，您可以使用表情符号。要查看受支持表情符号的完整列表，您可以访问此emoji-cheat-sheet。

如果您想自己获取支持的表情符号列表，可以使用GitHub 的 Emoji API。

在浏览器上访问https://api.github.com/emojis应该会显示所有支持的表情符号的 JSON 响应。

{
  "+1": "https://github.githubassets.com/images/icons/emoji/unicode/1f44d.png?v8",
  "-1": "https://github.githubassets.com/images/icons/emoji/unicode/1f44e.png?v8",
  "100": "https://github.githubassets.com/images/icons/emoji/unicode/1f4af.png?v8",
  "1234": "https://github.githubassets.com/images/icons/emoji/unicode/1f522.png?v8",
  "1st_place_medal": "https://github.githubassets.com/images/icons/emoji/unicode/1f947.png?v8",
  "2nd_place_medal": "https://github.githubassets.com/images/icons/emoji/unicode/1f948.png?v8",
  "3rd_place_medal": "https://github.githubassets.com/images/icons/emoji/unicode/1f949.png?v8",
  "8ball": "https://github.githubassets.com/images/icons/emoji/unicode/1f3b1.png?v8",
  ...

这是我在个人资料中使用表情符号的一个例子。

添加 GitHub 统计信息

要为你的 GitHub 活动添加卡片和统计信息，我建议使用github-readme-stats。你可以使用不同的布局和主题自定义统计卡片。

下面是我将 GitHub 统计信息添加到我的个人资料的示例。

添加引号

在你的个人资料中添加随机的引言可以给访客带来愉悦的体验。我发现github-readme-quotes就非常适合做这件事。

这是我的个人资料页面。我个人喜欢添加一些引言，为我的个人资料访客提供一些价值。

改善无障碍设施

自定义个人资料时，请确保尽可能多的人都能看到。并非所有人都能查看或加载图片。有些人有残疾，而有些人的网速较慢。

提高个人资料可访问性alt text的一种方法是向图像添加描述。

<!-- Markdown Image -->
![Image Alt Text](image-source)
<!-- HTML Image Tag -->
<img alt="Image Alt Text" src="image-source" />

然后，为了测试您的配置文件的可访问性，您可以尝试禁用网络浏览器上的图片加载功能。这里有一份关于如何在 Google Chrome 上禁用图片加载功能的指南。

这是在 Google Chrome 上禁用图像加载后我的个人资料的样子。

GitHub 个人资料成就

虽然这与自定义您的 GitHub 个人资料无关README.md，但我觉得有必要将其包括在内。

如果您访问您的 GitHub 个人资料，您会注意到Achievements左侧边栏上有一个部分。

收集这些成就很有趣，并且可以提高您的整体 GitHub 个人资料。

要了解可获得的成就以及如何获得这些成就，请查看GitHub 个人资料成就列表。

结论

总结一下，我们介绍了如何创建 GitHub 个人资料。然后，我演示了如何使用 GitHub Flavored Markdown 和 HTML 格式设置个人资料。之后，我分享了如何从中汲取灵感，打造属于自己的个人资料。最后，我提供了一些关于如何自定义个人资料的技巧和资源。

希望这些内容能帮助你创建精彩的 GitHub 个人资料。我很期待看到你的成果！

感谢您的阅读，欢迎在这里发表评论或与我联系。

资源

文章来源：https://dev.to/jdg2896/how-to-make-your-awesome-github-profile-hog

如何打造你的精彩 GitHub 个人资料 ɪ'ᴍ ᴋɪʀᴀɴ！欢迎👋