responsive-web-design translation #24
Open
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
S1ngS1ng
added
the
ready for review
响应式网页设计 --> 无障碍设计，进度：4 / 22。
响应式网页设计 --> 无障碍设计，进度：6 / 22。
响应式网页设计 --> 无障碍设计，进度：7 / 22。
响应式网页设计 --> 无障碍设计，进度：8 / 22。
Update from remote base
S1ngS1ng
suggested changes
Aug 1, 2018
| "<code><img src="importantLogo.jpeg" alt="Company logo"></code>", | ||
| "People with visual impairments rely on screen readers to convert web content to an audio interface. They won't get information if it's only presented visually. For images, screen readers can access the <code>alt</code> attribute and read its contents to deliver key information.", | ||
| "Good <code>alt</code> text is short but descriptive, and meant to briefly convey the meaning of the image. You should always include an <code>alt</code> attribute on your image. Per HTML5 specification, this is now considered mandatory.", | ||
| "那些无法通过视觉获取信息的用户，只能通过屏幕阅读器将网页内容转换为音频的方式获取信息，而屏幕阅读器是通过识别并朗读图片 <code>alt</code> 属性中的内容，来传递图片包含的关键信息。", |
There was a problem hiding this comment.
来传递图片包含的关键信息。 =>
来告知用户图片包含的关键信息。
| "People with visual impairments rely on screen readers to convert web content to an audio interface. They won't get information if it's only presented visually. For images, screen readers can access the <code>alt</code> attribute and read its contents to deliver key information.", | ||
| "Good <code>alt</code> text is short but descriptive, and meant to briefly convey the meaning of the image. You should always include an <code>alt</code> attribute on your image. Per HTML5 specification, this is now considered mandatory.", | ||
| "那些无法通过视觉获取信息的用户，只能通过屏幕阅读器将网页内容转换为音频的方式获取信息，而屏幕阅读器是通过识别并朗读图片 <code>alt</code> 属性中的内容，来传递图片包含的关键信息。", | ||
| "良好的 <code>alt</code> 文本可以简明扼要地描述图片信息，所以你的图片最好总是包含一个<code>alt</code>属性。HTML5 文档正在考虑强制要求这点。", |
There was a problem hiding this comment.
强制要求这点。 =>
强制要求对图片添加<code>alt</code>属性。
| "<hr>", | ||
| "Camper Cat happens to be both a coding ninja and an actual ninja, and is building a website to share his knowledge. The profile picture he wants to use shows his skills, and should be appreciated by all site visitors. Add an <code>alt</code> attribute in the <code>img</code> tag, that explains Camper Cat is doing karate. (The image <code>src</code> doesn't link to an actual file, so you should see the <code>alt</code> text in the display.)" | ||
| "碰巧，无论是 Camper 新手还是 Camper 老鸟，正在建立一个可以分享其知识的网站。他要使用一张对所有网站访问者都能有效识别的个人资料图片来展示他的技巧。给 <code>img</code> 标签上添加一个 <code>alt</code> 属性，就是Camper Cat的绝招。（图片的 <code>src</code> 并不指向任何文件，你应该能在显示器上看到 <code>alt</code> 文本。）" |
There was a problem hiding this comment.
碰巧，无论是 Camper 新手还是 Camper 老鸟，正在建立一个可以分享其知识的网站。他要使用一张对所有网站访问者都能有效识别的个人资料图片来展示他的技巧。
这句话翻译的意思没错，但在上下文中很不通顺。
建议：我们的 Camper 小明是一个编程高手，他正在建立一个分享自己知识的网站。在这个网站上，他打算用一张可以展示自己技术栈的图片来作为用户头像。
skills 建议翻译成“技术栈”
| "In the last challenge, you learned that including an <code>alt</code> attribute on img tags is mandatory. However, sometimes images are grouped with a caption already describing them, or are used for decoration only. In these cases <code>alt</code> text may seem redundant or unnecessary.", | ||
| "In situations when an image is already explained with text content, or does not add meaning to a page, the <code>img</code> still needs an <code>alt</code> attribute, but it can be set to an empty string. Here's an example:", | ||
| "在上一个挑战中，我们了解到在 <code>img</code> 标签里必须要包含一个 <code>alt</code> 属性。但是有时候，图片已经有了文字说明，或者仅仅为了美化页面。在这些情况下，<code>alt</code> 属性似乎有些多余。", | ||
| "但是即使图片已经有文字说明或者对页面来说没有意义，我们仍然需要为 <code>img</code> 标签添加 <code>alt</code> 属性，这种情况下，可以把它设为空，例如：", |
There was a problem hiding this comment.
但是即使图片已经有文字说明或者对页面来说没有意义， =>
即便如此，
对于 caption，如果也翻译成“文字说明”可能会造成误会。建议翻译成“图片标题”
参考：https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element/figcaption
| "<hr>", | ||
| "Camper Cat has coded a skeleton page for the blog part of his website. He's planning to add a visual break between his two articles with a decorative image of a samurai sword. Add an <code>alt</code> attribute to the <code>img</code> tag and set it to an empty string. (Note that the image <code>src</code> doesn't link to an actual file - don't worry that there are no swords showing in the display.)" | ||
| "Camper Cat已经为他的网站中的博客页面编码好了框架。他打算使用武士刀图片作为两篇文章之间的分割线。为 <code>img</code> 标签添加一个空的 <code>alt</code> 属性。（<code>img</code>标签的 <code>src</code> 不需要连接到真实的图片 - 显示器不会显示任何刀剑。）" |
There was a problem hiding this comment.
这里 Camper Cat 之后要加空格。。
不过，如果你上面改了描述，那这里也得跟着改
破折号：——
请参考 style-guide
| "Remember that folks using assistive technologies rely on organized, semantically meaningful markup to better understand your work.", | ||
| "<strong>Note about <code>section</code> and <code>div</code></strong><br>The <code>section</code> element is also new with HTML5, and has a slightly different semantic meaning than <code>article</code>. An <code>article</code> is for standalone content, and a <code>section</code> is for grouping thematically related content. They can be used within each other, as needed. For example, if a book is the <code>article</code>, then each chapter is a <code>section</code>. When there's no relationship between groups of content, then use a <code>div</code>.", | ||
| "<blockquote><div> - groups content<br><section> - groups related content<br><article> - groups independent, self-contained content<br></blockquote>", | ||
| "<code>article</code>是另一个可以使你的标记语义化的新HTML5标签。<code>Article</code>是一个分段标签，用于修饰独立的、自包含的内容。这个标签适用于博客入口，论坛帖子或者新闻文章。", |
| "<strong>Note about <code>section</code> and <code>div</code></strong><br>The <code>section</code> element is also new with HTML5, and has a slightly different semantic meaning than <code>article</code>. An <code>article</code> is for standalone content, and a <code>section</code> is for grouping thematically related content. They can be used within each other, as needed. For example, if a book is the <code>article</code>, then each chapter is a <code>section</code>. When there's no relationship between groups of content, then use a <code>div</code>.", | ||
| "<blockquote><div> - groups content<br><section> - groups related content<br><article> - groups independent, self-contained content<br></blockquote>", | ||
| "<code>article</code>是另一个可以使你的标记语义化的新HTML5标签。<code>Article</code>是一个分段标签，用于修饰独立的、自包含的内容。这个标签适用于博客入口，论坛帖子或者新闻文章。", | ||
| "这里有些技巧可以用来判断内容是否独立。问自己如果删除了上下文，该内容是否仍然有意义？相似地，对于文本，如果它在RSS提要中，它的意义是否保留。", |
There was a problem hiding this comment.
问自己如果删除了上下文， => 你可以问问自己如果删除了上下文，
RSS 两边也要加空格
| "<hr>", | ||
| "Camper Cat used <code>article</code> tags to wrap the posts on his blog page, but he forgot to use them around the top one. Change the <code>div</code> tag to use an <code>article</code> tag instead." | ||
| "Camper Cat使用<code>article</code>标签来修饰他的博客页面里的帖子，但是他忘记在顶部的帖子上使用它。使用<code>article</code>标签来代替<code>div</code>标签。" |
| "The next HTML5 element that adds semantic meaning and improves accessibility is the <code>header</code> tag. It's used to wrap introductory information or navigation links for its parent tag, and works well around content that's repeated at the top on multiple pages.", | ||
| "<code>header</code> shares the embedded landmark feature you saw with <code>main</code>, allowing assistive technologies to quickly navigate to that content.", | ||
| "<strong>Note</strong><br><code>header</code> is meant for use in the <code>body</code> tag of your HTML document. This is different than the <code>head</code> element, which contains the page's title, meta information, etc.", | ||
| "下一个可以增加语义化与可访问性的HTML5标签是<code>header</code>。它用于为它的父级标签包装简介信息或者导航链接，也适用于在多个页面顶端重复出现的内容。", |
| ], | ||
| "tests": [ | ||
| { | ||
| "text": "Your code should have one <code>header</code> tag.", | ||
| "testString": "assert($('header').length == 1, 'Your code should have one <code>header</code> tag.');" | ||
| "text": "你的代码因该包含一个<code>header</code>标签。", |
S1ngS1ng
added
need update
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Translate applied-accessibility.json into Chinese. Process 3/22.