当前位置: 首页 > news >正文

制作出色的 GitHub 个人资料

如果你是 GitHub 的新手,或者主要使用私有 GitHub 存储库,那么你很可能还没有 GitHub 个人资料。

GitHub 个人资料有助于为访问您的个人资料的人提供基本信息。拥有一个制作精良的个人资料甚至可以帮助你脱颖而出,尤其是当你开始为开源项目做出贡献并且人们开始注意到你时。

在本文中,我将展示如何创建自己的 GitHub 配置文件。我还将分享从哪里获得个人资料的灵感。最后,我将分享资源和技巧,以帮助您创建一个很棒的 GitHub 个人资料!

创建 GitHub 个人资料

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

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

但您需要做的就是:

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

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

示例 GitHub 配置文件存储库

设置完 repository 和 README.md 后,访问 https://github.com/YOUR-USERNAME 的 GitHub 个人资料,验证您的个人资料是否可见。

自定义 GitHub 个人资料

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

这里的关键是让你的个性显示在你的个人资料上。您的 GitHub 个人资料不必像 LinkedIn 那样过于正式。

我还建议从简单开始。这有助于启动并运行 GitHub 配置文件。当您以后有新想法时,您可以随时改进您的个人资料。

GitHub 风格的 Markdown、格式设置和 HTML

要自定义 GitHub 配置文件,您将使用 GitHub Flavored Markdown。如果你以前写过 Markdown 内容,格式化对你来说应该很容易。README.md

如果这是你第一次用 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 风格 Markdown 规范。

寻找灵感

为了帮助您入门,我建议您查看其他很棒的 GitHub 个人资料以获取想法。你可以去 awesome-github-profile-readme 看看。

由于配置文件是开源的,因此您可以将一些好主意用于您的出色配置文件!

添加徽章

要将徽章添加到您的个人资料中,您可以查看 markdown-badges。该存储库有多种徽章可供选择,从编程语言到 Netflix 等流媒体平台。

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

下面是一个示例

Markdown 徽章示例

添加图标

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

如果您的图标不受支持,您可以转到 simpleicons,其中包含 2900 多个流行品牌的 SVG 图标。

下面是一个示例

图标示例

使用表情符号

在 GitHub Flavored Markdown 中,您可以使用表情符号。要查看支持的表情符号的完整列表,您可以转到此表情符号备忘单。

如果您想自己获取支持的表情符号列表,可以使用 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 上与 github-profile 主题一起加星号最多的存储库之一,所以我不能将其排除在外。

然后我找到了这个漂亮的资源 beautify-github-profile,您可以在其中找到更多自定义个人资料的方法。

GitHub 个人资料成就

虽然这与自定义您的 GitHub 个人资料无关,但我觉得有必要包含它。README.md

如果你转到你的 GitHub 个人资料,你会注意到左侧边栏上有一个部分。Achievements

GitHub 个人资料成就

这些成就的收集起来很有趣,可以改善你的整体 GitHub 个人资料。

若要详细了解可用的成就以及如何获取这些成就,请查看 GitHub 个人资料成就列表。

结论

回顾一下,我们演练了如何创建 GitHub 个人资料。然后,我展示了如何使用 GitHub Flavored Markdown 和 HTML 格式化您的个人资料。之后,我分享了您可以从哪里获得自己的个人资料的灵感。最后,我提供了有关如何自定义个人资料的提示和资源。

我希望这可以帮助您制作出色的 GitHub 个人资料。我很想看看你能想出什么!

相关文章:

  • C#编程-描述内存分配
  • 2020年认证杯SPSSPRO杯数学建模D题(第一阶段)让电脑桌面飞起来全过程文档及程序
  • Python学习之路-编码风格
  • 外包做了5个月,技术退步一大半了。。。
  • 《计算机网络》 第三章 数据链路层
  • PostgreSQL ZIP版安装完全手册
  • Diffusion扩散模型学习3:Unet学习实现
  • 2023春季李宏毅机器学习笔记 03 :机器如何生成文句
  • 【实用技巧】Windows 电脑向iPhone或iPad传输视频方法1:无线传输
  • 杨中科 ASP.NET Core 中的依赖注入的使用
  • 寒假前端第一次作业
  • 模型\视图一般步骤:为什么经常要用“选择模型”QItemSelectionModel?
  • Android 事件分发介绍
  • scala 安装和创建项目
  • 代码随想录算法训练营Day20 | 40.组合总和||、39.组合总和、131.分割回文串
  • [nginx文档翻译系列] 控制nginx
  • 【159天】尚学堂高琪Java300集视频精华笔记(128)
  • 【5+】跨webview多页面 触发事件(二)
  • 07.Android之多媒体问题
  • 345-反转字符串中的元音字母
  • Android开源项目规范总结
  • Fabric架构演变之路
  • HTTP传输编码增加了传输量,只为解决这一个问题 | 实用 HTTP
  • react-core-image-upload 一款轻量级图片上传裁剪插件
  • React-生命周期杂记
  • SegmentFault 社区上线小程序开发频道,助力小程序开发者生态
  • vue--为什么data属性必须是一个函数
  • Vue小说阅读器(仿追书神器)
  • 分类模型——Logistics Regression
  • 复习Javascript专题(四):js中的深浅拷贝
  • 高性能JavaScript阅读简记(三)
  • 前端每日实战 2018 年 7 月份项目汇总(共 29 个项目)
  • 推荐一个React的管理后台框架
  • 微信支付JSAPI,实测!终极方案
  • 最近的计划
  • 做一名精致的JavaScripter 01:JavaScript简介
  • 400多位云计算专家和开发者,加入了同一个组织 ...
  • 好程序员大数据教程Hadoop全分布安装(非HA)
  • ​queue --- 一个同步的队列类​
  • ​一文看懂数据清洗:缺失值、异常值和重复值的处理
  • ## 临床数据 两两比较 加显著性boxplot加显著性
  • (2)STL算法之元素计数
  • (C++17) std算法之执行策略 execution
  • (Matlab)遗传算法优化的BP神经网络实现回归预测
  • (附源码)spring boot基于小程序酒店疫情系统 毕业设计 091931
  • (附源码)springboot 房产中介系统 毕业设计 312341
  • (免费领源码)python+django+mysql线上兼职平台系统83320-计算机毕业设计项目选题推荐
  • (四)Tiki-taka算法(TTA)求解无人机三维路径规划研究(MATLAB)
  • (五)关系数据库标准语言SQL
  • (已更新)关于Visual Studio 2019安装时VS installer无法下载文件,进度条为0,显示网络有问题的解决办法
  • (最简单,详细,直接上手)uniapp/vue中英文多语言切换
  • .net refrector
  • .netcore 获取appsettings
  • .net打印*三角形
  • .Net调用Java编写的WebServices返回值为Null的解决方法(SoapUI工具测试有返回值)