{"id":74920,"date":"2023-10-26T09:00:24","date_gmt":"2023-10-26T16:00:24","guid":{"rendered":"https:\/\/round-lake.dustinice.workers.dev:443\/https\/github.blog\/?p=74920"},"modified":"2023-10-26T09:17:00","modified_gmt":"2023-10-26T16:17:00","slug":"5-tips-for-making-your-github-profile-page-accessible","status":"publish","type":"post","link":"https:\/\/round-lake.dustinice.workers.dev:443\/https\/github.blog\/developer-skills\/github\/5-tips-for-making-your-github-profile-page-accessible\/","title":{"rendered":"5 tips for making your GitHub profile page accessible"},"content":{"rendered":"<p>The README on your GitHub profile acts like a front door to your work, skills, and professional self, so it&#8217;s important that everyone who visits your profile can read and understand it. In this post, we&#8217;ll be sharing some tips to help you make your README more accessible. Making content accessible means designing it so that people with disabilities can navigate and interact with it just as easily and comfortably as everyone else.<\/p>\n<h2 id=\"why-are-accessible-readmes-important\"><a class=\"heading-link\" href=\"#why-are-accessible-readmes-important\">Why are accessible READMEs important?<span class=\"heading-hash pl-2 text-italic text-bold\" aria-hidden=\"true\"><\/span><\/a><\/h2>\n<p>By making the README on your GitHub profile accessible, you:<\/p>\n<ul>\n<li>Invite trust and exploration into your repository.<\/li>\n<li>Increase clarity and usability for everyone, not just people with disabilities.<\/li>\n<li>Demonstrate your commitment to inclusivity.<\/li>\n<li>Build good habits for all .md files.<\/li>\n<\/ul>\n<h2 id=\"tips-for-making-your-readme-accessible\"><a class=\"heading-link\" href=\"#tips-for-making-your-readme-accessible\">Tips for making your README accessible<span class=\"heading-hash pl-2 text-italic text-bold\" aria-hidden=\"true\"><\/span><\/a><\/h2>\n<p>The great news is, you can make your README more accessible without needing to code! You can do this by checking the .md file for:<\/p>\n<ul>\n<li>Link context<\/li>\n<li>Image alt text<\/li>\n<li>Heading structure <\/li>\n<li>Plain language<\/li>\n<li>Use of emoji<\/li>\n<\/ul>\n<h3 id=\"make-links-descriptive\"><a class=\"heading-link\" href=\"#make-links-descriptive\">Make links descriptive<span class=\"heading-hash pl-2 text-italic text-bold\" aria-hidden=\"true\"><\/span><\/a><\/h3>\n<p>Assistive technology presents links in isolation, for example, by presenting a list of links or by reading out the name of each link, so it\u2019s important that links make sense on their own. Links with ambiguous text such as <code>click here<\/code>, can be difficult to distinguish from other links on the page that say the same thing. This leaves users without context as to what they\u2019re clicking into.<\/p>\n<ul>\n<li>Make link text specific, for example, <code>blogpost about accessibility<\/code>, instead of using generic text like <code>this<\/code> or <code>here<\/code>.<\/li>\n<li>Avoid multiple links with the same link text.<\/li>\n<li>Include context about the link destination.<\/li>\n<\/ul>\n<h4 id=\"bad-example\"><a class=\"heading-link\" href=\"#bad-example\">Bad example:<span class=\"heading-hash pl-2 text-italic text-bold\" aria-hidden=\"true\"><\/span><\/a><\/h4>\n<blockquote><p>\n  Read my blog post about crafting an inclusive and accessible resum\u00e9 <a href=\"https:\/\/round-lake.dustinice.workers.dev:443\/https\/github.com\/orgs\/community\/discussions\/62531\">here<\/a>.\n<\/p><\/blockquote>\n<h4 id=\"good-example\"><a class=\"heading-link\" href=\"#good-example\">Good example:<span class=\"heading-hash pl-2 text-italic text-bold\" aria-hidden=\"true\"><\/span><\/a><\/h4>\n<blockquote><p>\n  Read my blog post, &#8220;<a href=\"https:\/\/round-lake.dustinice.workers.dev:443\/https\/github.com\/orgs\/community\/discussions\/62531\">Crafting an inclusive and accessible resum\u00e9<\/a>,&#8221; on GitHub Community.\n<\/p><\/blockquote>\n<h3 id=\"add-alt-text-to-images\"><a class=\"heading-link\" href=\"#add-alt-text-to-images\">Add ALT text to images<span class=\"heading-hash pl-2 text-italic text-bold\" aria-hidden=\"true\"><\/span><\/a><\/h3>\n<p>Using image descriptions (sometimes called &#8220;alt text&#8221;) helps make sure that everyone can extract meaning from the images in your README file. People with low vision who use a screenreader access the image description to understand the context of the image that is displayed.<\/p>\n<ul>\n<li>Think of alt text like a tweet: be succinct, concise and descriptive.<\/li>\n<li>If a longer description is required in addition to the alt text, include the long description  in a <code>&lt;details&gt;<\/code> tag or link to an external resource.<\/li>\n<li>Include any image text in the description.<\/li>\n<li>Consider the context\u2014why was this image used? What does it convey or communicate?<\/li>\n<li>You don&#8217;t need to include \u201cimage of, photo of\u2026\u201d as that is communicated by the screenreader, but it is appropriate to include \u201cscreenshot of\u2026\u201d as this image context is important to convey.<\/li>\n<\/ul>\n<p>Alt text should help users understand the meaning or intent of the image, which will be different depending what type of image it is.<\/p>\n<ul>\n<li>The alt text for a chart or infographic might summarize the data (in addition to the surrounding text including details of the data).<\/li>\n<li>A photo of you might describe your physical appearance or surroundings.<\/li>\n<li>A screenshot of a project might outline the most important elements of the product.<\/li>\n<\/ul>\n<p>In Markdown, add alt text by putting the image description inside the square brackets:<\/p>\n<p><code>![Mona the Octocat in the style of Rosie the Riveter. Mona is wearing blue coveralls and a red and white polka dot hairscarf, on a background of a yellow circle outlined in blue. She is holding a wrench in one tentacle, and flexing her muscles. Text says \"We can do it!\"]([https:\/\/round-lake.dustinice.workers.dev:443\/https\/octodex.github.com\/images\/welcometocat.png](https:\/\/round-lake.dustinice.workers.dev:443\/https\/octodex.github.com\/images\/mona-the-rivetertocat.png))<\/code><br \/>\n<img data-recalc-dims=\"1\" decoding=\"async\" loading=\"lazy\" src=\"https:\/\/round-lake.dustinice.workers.dev:443\/https\/i0.wp.com\/octodex.github.com\/images\/mona-the-rivetertocat.png?ssl=1\" alt=\"Mona the Octocat in the style of Rosie the Riveter. Mona is wearing blue coveralls and a red and white polka dot hairscarf, on a background of a yellow circle outlined in blue. She is holding a wrench in one tentacle, and flexing her muscles. Text says 'We can do it!'\" ><\/p>\n<h3 id=\"use-proper-heading-formatting\"><a class=\"heading-link\" href=\"#use-proper-heading-formatting\">Use proper heading formatting<span class=\"heading-hash pl-2 text-italic text-bold\" aria-hidden=\"true\"><\/span><\/a><\/h3>\n<p>Proper headings give structure to Markdown content. When information is structured properly, people who use assistive technology can understand the structure of the content and navigate directly to different sections. Using correct headings also helps visual users scan content more easily, including some people who may struggle with large amounts of unstructured text, such as people with ADHD or dyslexia.<\/p>\n<p>Think of it like a newspaper front page, with the largest headings at the top, and smaller headings near the bottom. This presents the most important information in a weighted fashion.<\/p>\n<p>Markdown uses <code>#<\/code> to create headings in a hierarchy. Use one <code>#<\/code> for the page title, then continue with the appropriate number of <code>#<\/code> for each heading level.<\/p>\n<pre><code># Welcome to my GitHub profile\n\n## About me\nI'm Mona, an Octocat and GitHub mascot! \n\n### Likes\n* Tuna melts\n* Beautiful code\n* Swimming in the ocean\n\n## Contact me\nFind me over on the [GitHub Blog](https:\/\/round-lake.dustinice.workers.dev:443\/https\/github.blog\/) or on the [GitHub Community Discussions](https:\/\/round-lake.dustinice.workers.dev:443\/https\/github.com\/orgs\/community\/discussions)\n<\/code><\/pre>\n<p>It&#8217;s important not to skip heading levels (for example, <code>##<\/code> followed by <code>####<\/code>) as this can make reading order and navigation confusing. When headings are skipped, someone using assistive technology may wonder if they missed a heading somewhere else.<\/p>\n<h3 id=\"use-plain-language-to-make-your-content-readable\"><a class=\"heading-link\" href=\"#use-plain-language-to-make-your-content-readable\">Use plain language to make your content readable<span class=\"heading-hash pl-2 text-italic text-bold\" aria-hidden=\"true\"><\/span><\/a><\/h3>\n<p>Apps like <a href=\"https:\/\/round-lake.dustinice.workers.dev:443\/https\/hemingwayapp.com\/\">Hemingway<\/a>, <a href=\"https:\/\/round-lake.dustinice.workers.dev:443\/https\/www.grammarly.com\/\">Grammarly<\/a> and <a href=\"https:\/\/round-lake.dustinice.workers.dev:443\/https\/alexjs.com\/\">Alex<\/a> can help you make your writing clearer, simpler, and more inclusive. Some of these apps have web versions so you don\u2019t need to install anything.<\/p>\n<p>Copy and paste sections of your README into one of these tools to check for its readability and adjust accordingly.<\/p>\n<h2 id=\"structure-lists-with-proper-markup\"><a class=\"heading-link\" href=\"#structure-lists-with-proper-markup\">Structure lists with proper markup<span class=\"heading-hash pl-2 text-italic text-bold\" aria-hidden=\"true\"><\/span><\/a><\/h2>\n<p>When writing lists, use the correct markup so that people who use assistive technology can read and understand the list as you intend it.<\/p>\n<p>Only use correct list markup (<code>*<\/code>, <code>-<\/code>, or <code>-<\/code> in Markdown) for each list item so that the content is clearly structured for everyone. You might be tempted to use special characters or emoji as bullet points for decorative effect, but doing this means screenreaders will not be able to recognize the list as a list and will read it as normal paragraph text, which might change the meaning.<\/p>\n<p>Structuring lists correctly also gives people who use a screenreader important context about the depth of the list. For example, the first bullet point in a list of fruit might be announced by a screenreader as &#8220;Apples, one of three.&#8221;<\/p>\n<p><a href=\"https:\/\/round-lake.dustinice.workers.dev:443\/https\/docs.github.com\/en\/get-started\/writing-on-github\/getting-started-with-writing-and-formatting-on-github\/basic-writing-and-formatting-syntax#lists\">Read more about Markdown syntax for lists<\/a>.<\/p>\n<h3 id=\"consider-your-use-and-placement-of-emoji\"><a class=\"heading-link\" href=\"#consider-your-use-and-placement-of-emoji\">Consider your use and placement of emoji<span class=\"heading-hash pl-2 text-italic text-bold\" aria-hidden=\"true\"><\/span><\/a><\/h3>\n<p>Emoji are a fun way to express yourself, but use them thoughtfully to make sure your README is enjoyable for others to read, too.<\/p>\n<p>Screenreaders describe emoji by reading out their full name. Some emojis have long names, like &#8220;face with stuck-out tongue and squinting eyes,\u201dso you should avoid using several in a row as this can be quite jarring when read out by a screenreader. Using too many emojis can also be distracting for some neurodivergent people such as autistic people.<\/p>\n<p>Keep in mind that some browsers and devices might not support all emoji, especially variations like skintone or gender. For example, \ud83d\udc69\ud83c\udffd\u200d\ud83d\udcbb <span aria-hidden=true>(woman with medium skintone with a laptop)<\/span> might appear to someone as a sequence of emoji like \ud83d\udc68\u200d\ud83d\udcbb\ud83d\udfeb\u2640\ufe0f <span aria-hidden=true>(default yellow skintone man with a laptop followed by a brown square and the female symbol)<\/span>.<\/p>\n<h2 id=\"using-tools-and-automation-to-check-your-readme-for-accessibility\"><a class=\"heading-link\" href=\"#using-tools-and-automation-to-check-your-readme-for-accessibility\">Using tools and automation to check your README for accessibility<span class=\"heading-hash pl-2 text-italic text-bold\" aria-hidden=\"true\"><\/span><\/a><\/h2>\n<p>Along with keeping the above tips in mind, there are lots of useful tools that make it easy to identify accessibility issues in your README and other .md files.<\/p>\n<h3 id=\"browser-and-code-editor-extensions\"><a class=\"heading-link\" href=\"#browser-and-code-editor-extensions\">Browser and code editor extensions<span class=\"heading-hash pl-2 text-italic text-bold\" aria-hidden=\"true\"><\/span><\/a><\/h3>\n<ul>\n<li><a href=\"https:\/\/round-lake.dustinice.workers.dev:443\/https\/chrome.google.com\/webstore\/detail\/axe-devtools-web-accessib\/lhdoppojpmngadmnindnejefpokejbdd?utm_source=deque.com&#038;utm_medium=referral&#038;utm_campaign=axe-browser-extensions_hero\">Axe dev tools browser extension<\/a> on the Chrome store (also works in Edge) <\/li>\n<li><a href=\"https:\/\/round-lake.dustinice.workers.dev:443\/https\/github.com\/iansan5653\/github-markdown-a11y-extension\">github-markdown-a11y-extension by @iansan5653<\/a><\/li>\n<li><a href=\"https:\/\/round-lake.dustinice.workers.dev:443\/https\/marketplace.visualstudio.com\/items?itemName=DavidAnson.vscode-markdownlint\">markdownlint extension for VSCode<\/a><\/li>\n<\/ul>\n<h3 id=\"github-actions-workflows\"><a class=\"heading-link\" href=\"#github-actions-workflows\">GitHub Actions workflows<span class=\"heading-hash pl-2 text-italic text-bold\" aria-hidden=\"true\"><\/span><\/a><\/h3>\n<p>You can use GitHub Actions to run tests on your content every time you take an action on a Markdown file.<\/p>\n<ol>\n<li>Create a directory in your repository with the name <code>.github\/workflows<\/code>.<\/li>\n<li>Create a YAML file with the name <code>readme-checker.yml<\/code>.<\/li>\n<li>Paste the code from the markdownlint example YAML file:\n<pre><code>on: [push, pull_request]\n\njobs:\n  lint:\n    runs-on: ubuntu-latest\n    steps:\n    - uses: actions\/checkout@v3\n    - uses: DavidAnson\/markdownlint-cli2-action@v11\n      with:\n        globs: |\n          *.md\n          !test\/*.md\n<\/code><\/pre>\n<\/li>\n<li>Commit and merge to your main branch.<\/li>\n<li>Go to the Actions tab of your repository and see the results!<\/li>\n<\/ol>\n<h3 id=\"built-in-browser-tools\"><a class=\"heading-link\" href=\"#built-in-browser-tools\">Built-in browser tools<span class=\"heading-hash pl-2 text-italic text-bold\" aria-hidden=\"true\"><\/span><\/a><\/h3>\n<ul>\n<li>Use your browser&#8217;s developer tools to check your alt text is correctly implemented.<\/li>\n<li>In Chrome, right-click on selected text and use &#8220;Speech&#8221; > &#8220;Start speaking&#8221; to simulate how a screenreader might announce content.<\/li>\n<\/ul>\n<h2 id=\"share-your-work-to-promote-accessibility-on-github\"><a class=\"heading-link\" href=\"#share-your-work-to-promote-accessibility-on-github\">Share your work to promote accessibility on GitHub<span class=\"heading-hash pl-2 text-italic text-bold\" aria-hidden=\"true\"><\/span><\/a><\/h2>\n<p>Once you&#8217;ve used these tips to make your README more accessible, why not spread the word? Add the Markdown below to your README to share this post and encourage other GitHub users to follow your great example.<\/p>\n<pre><code>This README has been optimized for accessibility based on GitHub's blogpost \"[Tips for Making your GitHub Profile Page Accessible](https:\/\/round-lake.dustinice.workers.dev:443\/https\/github.blog\/2023-10-26-5-tips-for-making-your-github-profile-page-accessible)\".\n<\/code><\/pre>\n<p>Have questions, want to learn from others, or have something to share? Join the <a href=\"https:\/\/round-lake.dustinice.workers.dev:443\/https\/github.com\/orgs\/community\/discussions\/64778\">GitHub Community discussion about making your profile accessible<\/a>. We&#8217;d love to hear from you!<\/p>\n<div class=\"post-content-cta\"><p>To learn more about accessibility at GitHub, go to <a href=\"https:\/\/round-lake.dustinice.workers.dev:443\/https\/accessibility.github.com\/\">accessibility.github.com<\/a>.<\/p>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>Your profile\u2019s README invites the world to know you and your work, so it\u2019s important that everyone can read and understand it. In this post, we share some tips for making your README more accessible. <\/p>\n","protected":false},"author":2190,"featured_media":74922,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_gh_post_show_toc":"no","_gh_post_is_no_robots":"no","_gh_post_is_featured":"no","_gh_post_is_excluded":"no","_gh_post_is_unlisted":"no","_gh_post_related_link_1":"","_gh_post_related_link_2":"","_gh_post_related_link_3":"","_gh_post_sq_img":"","_gh_post_sq_img_id":"","_gh_post_cta_title":"","_gh_post_cta_text":"","_gh_post_cta_link":"","_gh_post_cta_button":"Click Here to Learn More","_gh_post_recirc_hide":"no","_gh_post_recirc_col_1":"gh-auto-select","_gh_post_recirc_col_2":"73570","_gh_post_recirc_col_3":"65303","_gh_post_recirc_col_4":"65316","_featured_video":"","_gh_post_additional_query_params":"","_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_jetpack_feature_clip_id":0,"_jetpack_memberships_contains_paid_content":false,"footnotes":"","jetpack_publicize_message":"{title}\n\n{excerpt}\n\n{url}","jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":true,"jetpack_social_options":{"image_generator_settings":{"template":"highway","default_image_id":0,"font":"","enabled":false},"version":2},"_wpas_customize_per_network":false,"jetpack_post_was_ever_published":false,"_links_to":"","_links_to_target":""},"categories":[3298,3302],"tags":[2732,2739,1728],"coauthors":[3178],"class_list":["post-74920","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-developer-skills","category-github","tag-accessibility","tag-open-source","tag-readme"],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v28.2 (Yoast SEO v28.2) - https:\/\/round-lake.dustinice.workers.dev:443\/https\/yoast.com\/product\/yoast-seo-premium-wordpress\/ -->\n<title>5 tips for making your GitHub profile page accessible - The GitHub Blog<\/title>\n<meta name=\"description\" content=\"Your profile\u2019s README invites the world to know you and your work, so it\u2019s important that everyone can read and understand it. In this post, we share some tips for making your README more accessible.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/round-lake.dustinice.workers.dev:443\/https\/github.blog\/developer-skills\/github\/5-tips-for-making-your-github-profile-page-accessible\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"5 tips for making your GitHub profile page accessible\" \/>\n<meta property=\"og:description\" content=\"Your profile\u2019s README invites the world to know you and your work, so it\u2019s important that everyone can read and understand it. In this post, we share some tips for making your README more accessible.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/round-lake.dustinice.workers.dev:443\/https\/github.blog\/developer-skills\/github\/5-tips-for-making-your-github-profile-page-accessible\/\" \/>\n<meta property=\"og:site_name\" content=\"The GitHub Blog\" \/>\n<meta property=\"article:published_time\" content=\"2023-10-26T16:00:24+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2023-10-26T16:17:00+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/round-lake.dustinice.workers.dev:443\/https\/github.blog\/wp-content\/uploads\/2023\/10\/Collaboration-DarkMode-3.png?fit=1200%2C630\" \/>\n\t<meta property=\"og:image:width\" content=\"1200\" \/>\n\t<meta property=\"og:image:height\" content=\"630\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Annie Streater\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Annie Streater\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"7 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/github.blog\\\/developer-skills\\\/github\\\/5-tips-for-making-your-github-profile-page-accessible\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/github.blog\\\/developer-skills\\\/github\\\/5-tips-for-making-your-github-profile-page-accessible\\\/\"},\"author\":{\"name\":\"Annie Streater\",\"@id\":\"https:\\\/\\\/github.blog\\\/#\\\/schema\\\/person\\\/de9be9110c227665a7e74e9dd1187d54\"},\"headline\":\"5 tips for making your GitHub profile page accessible\",\"datePublished\":\"2023-10-26T16:00:24+00:00\",\"dateModified\":\"2023-10-26T16:17:00+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/github.blog\\\/developer-skills\\\/github\\\/5-tips-for-making-your-github-profile-page-accessible\\\/\"},\"wordCount\":1286,\"image\":{\"@id\":\"https:\\\/\\\/github.blog\\\/developer-skills\\\/github\\\/5-tips-for-making-your-github-profile-page-accessible\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/github.blog\\\/wp-content\\\/uploads\\\/2023\\\/10\\\/Collaboration-DarkMode-3.png?fit=1200%2C630\",\"keywords\":[\"accessibility\",\"open source\",\"readme\"],\"articleSection\":[\"Developer skills\",\"GitHub\"],\"inLanguage\":\"en-US\"},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/github.blog\\\/developer-skills\\\/github\\\/5-tips-for-making-your-github-profile-page-accessible\\\/\",\"url\":\"https:\\\/\\\/github.blog\\\/developer-skills\\\/github\\\/5-tips-for-making-your-github-profile-page-accessible\\\/\",\"name\":\"5 tips for making your GitHub profile page accessible - The GitHub Blog\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/github.blog\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/github.blog\\\/developer-skills\\\/github\\\/5-tips-for-making-your-github-profile-page-accessible\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/github.blog\\\/developer-skills\\\/github\\\/5-tips-for-making-your-github-profile-page-accessible\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/github.blog\\\/wp-content\\\/uploads\\\/2023\\\/10\\\/Collaboration-DarkMode-3.png?fit=1200%2C630\",\"datePublished\":\"2023-10-26T16:00:24+00:00\",\"dateModified\":\"2023-10-26T16:17:00+00:00\",\"author\":{\"@id\":\"https:\\\/\\\/github.blog\\\/#\\\/schema\\\/person\\\/de9be9110c227665a7e74e9dd1187d54\"},\"description\":\"Your profile\u2019s README invites the world to know you and your work, so it\u2019s important that everyone can read and understand it. In this post, we share some tips for making your README more accessible.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/github.blog\\\/developer-skills\\\/github\\\/5-tips-for-making-your-github-profile-page-accessible\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/github.blog\\\/developer-skills\\\/github\\\/5-tips-for-making-your-github-profile-page-accessible\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/github.blog\\\/developer-skills\\\/github\\\/5-tips-for-making-your-github-profile-page-accessible\\\/#primaryimage\",\"url\":\"https:\\\/\\\/github.blog\\\/wp-content\\\/uploads\\\/2023\\\/10\\\/Collaboration-DarkMode-3.png?fit=1200%2C630\",\"contentUrl\":\"https:\\\/\\\/github.blog\\\/wp-content\\\/uploads\\\/2023\\\/10\\\/Collaboration-DarkMode-3.png?fit=1200%2C630\",\"width\":1200,\"height\":630},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/github.blog\\\/developer-skills\\\/github\\\/5-tips-for-making-your-github-profile-page-accessible\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/github.blog\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Developer skills\",\"item\":\"https:\\\/\\\/github.blog\\\/developer-skills\\\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"GitHub\",\"item\":\"https:\\\/\\\/github.blog\\\/developer-skills\\\/github\\\/\"},{\"@type\":\"ListItem\",\"position\":4,\"name\":\"5 tips for making your GitHub profile page accessible\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/github.blog\\\/#website\",\"url\":\"https:\\\/\\\/github.blog\\\/\",\"name\":\"The GitHub Blog\",\"description\":\"Updates, ideas, and inspiration from GitHub to help developers build and design software.\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/github.blog\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/github.blog\\\/#\\\/schema\\\/person\\\/de9be9110c227665a7e74e9dd1187d54\",\"name\":\"Annie Streater\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/6904b56c338249ce9fb4efaa78ec6d7c6aa2695ea94c5315b606eda19da65643?s=96&d=mm&r=g535f9f3e94b24b0d170c15894a42552b\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/6904b56c338249ce9fb4efaa78ec6d7c6aa2695ea94c5315b606eda19da65643?s=96&d=mm&r=g\",\"contentUrl\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/6904b56c338249ce9fb4efaa78ec6d7c6aa2695ea94c5315b606eda19da65643?s=96&d=mm&r=g\",\"caption\":\"Annie Streater\"},\"url\":\"https:\\\/\\\/github.blog\\\/author\\\/streats\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"5 tips for making your GitHub profile page accessible - The GitHub Blog","description":"Your profile\u2019s README invites the world to know you and your work, so it\u2019s important that everyone can read and understand it. In this post, we share some tips for making your README more accessible.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/round-lake.dustinice.workers.dev:443\/https\/github.blog\/developer-skills\/github\/5-tips-for-making-your-github-profile-page-accessible\/","og_locale":"en_US","og_type":"article","og_title":"5 tips for making your GitHub profile page accessible","og_description":"Your profile\u2019s README invites the world to know you and your work, so it\u2019s important that everyone can read and understand it. In this post, we share some tips for making your README more accessible.","og_url":"https:\/\/round-lake.dustinice.workers.dev:443\/https\/github.blog\/developer-skills\/github\/5-tips-for-making-your-github-profile-page-accessible\/","og_site_name":"The GitHub Blog","article_published_time":"2023-10-26T16:00:24+00:00","article_modified_time":"2023-10-26T16:17:00+00:00","og_image":[{"width":1200,"height":630,"url":"https:\/\/round-lake.dustinice.workers.dev:443\/https\/github.blog\/wp-content\/uploads\/2023\/10\/Collaboration-DarkMode-3.png?fit=1200%2C630","type":"image\/png"}],"author":"Annie Streater","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Annie Streater","Est. reading time":"7 minutes"},"schema":{"@context":"https:\/\/round-lake.dustinice.workers.dev:443\/https\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/round-lake.dustinice.workers.dev:443\/https\/github.blog\/developer-skills\/github\/5-tips-for-making-your-github-profile-page-accessible\/#article","isPartOf":{"@id":"https:\/\/round-lake.dustinice.workers.dev:443\/https\/github.blog\/developer-skills\/github\/5-tips-for-making-your-github-profile-page-accessible\/"},"author":{"name":"Annie Streater","@id":"https:\/\/round-lake.dustinice.workers.dev:443\/https\/github.blog\/#\/schema\/person\/de9be9110c227665a7e74e9dd1187d54"},"headline":"5 tips for making your GitHub profile page accessible","datePublished":"2023-10-26T16:00:24+00:00","dateModified":"2023-10-26T16:17:00+00:00","mainEntityOfPage":{"@id":"https:\/\/round-lake.dustinice.workers.dev:443\/https\/github.blog\/developer-skills\/github\/5-tips-for-making-your-github-profile-page-accessible\/"},"wordCount":1286,"image":{"@id":"https:\/\/round-lake.dustinice.workers.dev:443\/https\/github.blog\/developer-skills\/github\/5-tips-for-making-your-github-profile-page-accessible\/#primaryimage"},"thumbnailUrl":"https:\/\/round-lake.dustinice.workers.dev:443\/https\/github.blog\/wp-content\/uploads\/2023\/10\/Collaboration-DarkMode-3.png?fit=1200%2C630","keywords":["accessibility","open source","readme"],"articleSection":["Developer skills","GitHub"],"inLanguage":"en-US"},{"@type":"WebPage","@id":"https:\/\/round-lake.dustinice.workers.dev:443\/https\/github.blog\/developer-skills\/github\/5-tips-for-making-your-github-profile-page-accessible\/","url":"https:\/\/round-lake.dustinice.workers.dev:443\/https\/github.blog\/developer-skills\/github\/5-tips-for-making-your-github-profile-page-accessible\/","name":"5 tips for making your GitHub profile page accessible - The GitHub Blog","isPartOf":{"@id":"https:\/\/round-lake.dustinice.workers.dev:443\/https\/github.blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/round-lake.dustinice.workers.dev:443\/https\/github.blog\/developer-skills\/github\/5-tips-for-making-your-github-profile-page-accessible\/#primaryimage"},"image":{"@id":"https:\/\/round-lake.dustinice.workers.dev:443\/https\/github.blog\/developer-skills\/github\/5-tips-for-making-your-github-profile-page-accessible\/#primaryimage"},"thumbnailUrl":"https:\/\/round-lake.dustinice.workers.dev:443\/https\/github.blog\/wp-content\/uploads\/2023\/10\/Collaboration-DarkMode-3.png?fit=1200%2C630","datePublished":"2023-10-26T16:00:24+00:00","dateModified":"2023-10-26T16:17:00+00:00","author":{"@id":"https:\/\/round-lake.dustinice.workers.dev:443\/https\/github.blog\/#\/schema\/person\/de9be9110c227665a7e74e9dd1187d54"},"description":"Your profile\u2019s README invites the world to know you and your work, so it\u2019s important that everyone can read and understand it. In this post, we share some tips for making your README more accessible.","breadcrumb":{"@id":"https:\/\/round-lake.dustinice.workers.dev:443\/https\/github.blog\/developer-skills\/github\/5-tips-for-making-your-github-profile-page-accessible\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/round-lake.dustinice.workers.dev:443\/https\/github.blog\/developer-skills\/github\/5-tips-for-making-your-github-profile-page-accessible\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/round-lake.dustinice.workers.dev:443\/https\/github.blog\/developer-skills\/github\/5-tips-for-making-your-github-profile-page-accessible\/#primaryimage","url":"https:\/\/round-lake.dustinice.workers.dev:443\/https\/github.blog\/wp-content\/uploads\/2023\/10\/Collaboration-DarkMode-3.png?fit=1200%2C630","contentUrl":"https:\/\/round-lake.dustinice.workers.dev:443\/https\/github.blog\/wp-content\/uploads\/2023\/10\/Collaboration-DarkMode-3.png?fit=1200%2C630","width":1200,"height":630},{"@type":"BreadcrumbList","@id":"https:\/\/round-lake.dustinice.workers.dev:443\/https\/github.blog\/developer-skills\/github\/5-tips-for-making-your-github-profile-page-accessible\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/round-lake.dustinice.workers.dev:443\/https\/github.blog\/"},{"@type":"ListItem","position":2,"name":"Developer skills","item":"https:\/\/round-lake.dustinice.workers.dev:443\/https\/github.blog\/developer-skills\/"},{"@type":"ListItem","position":3,"name":"GitHub","item":"https:\/\/round-lake.dustinice.workers.dev:443\/https\/github.blog\/developer-skills\/github\/"},{"@type":"ListItem","position":4,"name":"5 tips for making your GitHub profile page accessible"}]},{"@type":"WebSite","@id":"https:\/\/round-lake.dustinice.workers.dev:443\/https\/github.blog\/#website","url":"https:\/\/round-lake.dustinice.workers.dev:443\/https\/github.blog\/","name":"The GitHub Blog","description":"Updates, ideas, and inspiration from GitHub to help developers build and design software.","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/round-lake.dustinice.workers.dev:443\/https\/github.blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Person","@id":"https:\/\/round-lake.dustinice.workers.dev:443\/https\/github.blog\/#\/schema\/person\/de9be9110c227665a7e74e9dd1187d54","name":"Annie Streater","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/round-lake.dustinice.workers.dev:443\/https\/secure.gravatar.com\/avatar\/6904b56c338249ce9fb4efaa78ec6d7c6aa2695ea94c5315b606eda19da65643?s=96&d=mm&r=g535f9f3e94b24b0d170c15894a42552b","url":"https:\/\/round-lake.dustinice.workers.dev:443\/https\/secure.gravatar.com\/avatar\/6904b56c338249ce9fb4efaa78ec6d7c6aa2695ea94c5315b606eda19da65643?s=96&d=mm&r=g","contentUrl":"https:\/\/round-lake.dustinice.workers.dev:443\/https\/secure.gravatar.com\/avatar\/6904b56c338249ce9fb4efaa78ec6d7c6aa2695ea94c5315b606eda19da65643?s=96&d=mm&r=g","caption":"Annie Streater"},"url":"https:\/\/round-lake.dustinice.workers.dev:443\/https\/github.blog\/author\/streats\/"}]}},"jetpack_publicize_connections":[],"jetpack_shortlink":"https:\/\/round-lake.dustinice.workers.dev:443\/https\/wp.me\/pamS32-juo","jetpack_sharing_enabled":true,"jetpack_featured_media_url":"https:\/\/round-lake.dustinice.workers.dev:443\/https\/github.blog\/wp-content\/uploads\/2023\/10\/Collaboration-DarkMode-3.png?fit=1200%2C630","_links":{"self":[{"href":"https:\/\/round-lake.dustinice.workers.dev:443\/https\/github.blog\/wp-json\/wp\/v2\/posts\/74920","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/round-lake.dustinice.workers.dev:443\/https\/github.blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/round-lake.dustinice.workers.dev:443\/https\/github.blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/round-lake.dustinice.workers.dev:443\/https\/github.blog\/wp-json\/wp\/v2\/users\/2190"}],"replies":[{"embeddable":true,"href":"https:\/\/round-lake.dustinice.workers.dev:443\/https\/github.blog\/wp-json\/wp\/v2\/comments?post=74920"}],"version-history":[{"count":6,"href":"https:\/\/round-lake.dustinice.workers.dev:443\/https\/github.blog\/wp-json\/wp\/v2\/posts\/74920\/revisions"}],"predecessor-version":[{"id":74924,"href":"https:\/\/round-lake.dustinice.workers.dev:443\/https\/github.blog\/wp-json\/wp\/v2\/posts\/74920\/revisions\/74924"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/round-lake.dustinice.workers.dev:443\/https\/github.blog\/wp-json\/wp\/v2\/media\/74922"}],"wp:attachment":[{"href":"https:\/\/round-lake.dustinice.workers.dev:443\/https\/github.blog\/wp-json\/wp\/v2\/media?parent=74920"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/round-lake.dustinice.workers.dev:443\/https\/github.blog\/wp-json\/wp\/v2\/categories?post=74920"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/round-lake.dustinice.workers.dev:443\/https\/github.blog\/wp-json\/wp\/v2\/tags?post=74920"},{"taxonomy":"author","embeddable":true,"href":"https:\/\/round-lake.dustinice.workers.dev:443\/https\/github.blog\/wp-json\/wp\/v2\/coauthors?post=74920"}],"curies":[{"name":"wp","href":"https:\/\/round-lake.dustinice.workers.dev:443\/https\/api.w.org\/{rel}","templated":true}]}}