自 2023 年 4 月起，Windows 11 已经重新支持显示“秒”，无需第三方工具来实现，点击查看详情。
ElevenClock 下载地址：GitHub，开源软件放心使用
效果：
* 该软件不会影响右下角的显示桌面和系统通知功能。
v3.3 设置方法：
√ 在主屏幕上时钟区显示本程序的时钟样式
ElevenClock 不直接修改任务栏上的时钟区域，而是将时钟覆盖在系统时钟区域的上方。
√ 不要在辅助监视器上显示时钟
此项按实际需求勾选
√ 时间与日期设置 - Set a custom date and time format (for advanced users only)
填写以下内容并 Apply
%H:%M:%S
%Y/%#m/%#d %a
如果不想显示星期，把 %a 去掉即可。
√ 使用自定义字体大小
因分辨率缩放设置不同可能导致显示的字体大小与系统时钟不同，会导致覆盖面过大或过小，从而使系统托盘中的其它图标显示不完整。所以应选择一个与系统时间差不多的字体大小。当显示“周序号”时 ElevenClock 时钟区域可能会远宽于系统时钟区域，可以设置系统时钟显示“星期”（方法见文末）。
v3.2 设置方法：
√ 在主屏幕上时钟区显示本程序的时钟样式
ElevenClock 不直接修改任务栏上的时钟区域，而是将时钟覆盖在系统时钟区域的上方。
√ 不要在辅助监视器上显示时钟
此项按实际需求勾选
√ 显示秒数
这是我们的最终目的。
√ 使用自定义字体大小
因分辨率缩放设置不同可能导致显示的字体大小与系统时钟不同，会导致覆盖面过大或过小，从而使系统托盘中的其它图标显示不完整。所以应选择一个与系统时间差不多的字体大小。当显示“周序号”时 ElevenClock 时钟区域可能会远宽于系统时钟区域，可以设置系统时钟显示“星期”（方法见文末）。
如何显示系统时间“星期”：
打开“更改日期和时间”，在“日期”选项卡的“短日期”中添加“ddd”。
m① R②
x① R②
① 表示屏幕尺寸，一般有 15、17 等
② 表示第几代，对应 CPU 和显卡的不同，数字越大越新
相同 ① 与 ② 的情况下仍有细分款式，对应内存、硬盘、屏幕分辨率刷新率等不同
x 系列是全新的系列，是 m 系列的更新款（m 系列不再更新），相比 m 系列提升了散热性能
| 屏幕尺寸 | 型号 | 处理器 | 显卡 | 发布时间 |
| 14.0 英寸 | x14 R1 | 12 代 i7 | 30 系 | 2022年1月 |
| 15.6 英寸 | m15 R4 | 10 代 i7/i9 | 30 系 | |
| m15 R5 | 锐龙 R7-5800H | 30 系 | ||
| m15 R6 | 11 代 i7 | 30 系 | ||
| m15 R7 | 12 代 i7 | 30 系 | 2022年2月 | |
| x15 R1 | 11 代 i7/i9 | 30 系 | ||
| x15 R2 | 12 代 i9 | 30 系 | 2022年2月 | |
| 16.0 英寸 | m16 | 13 代 i7/i9 | 40 系 | 2023年2月 |
| x16 | 13 代 HK | 40 系 | 2023年2月 | |
| 17.3 英寸 | m17 R3 | 10 代 i7 | 20 系 | |
| m17 R4 | 10 代 i7 | 30 系 | ||
| m17 R5 | 锐龙 R7/R9 | 30 系 | 2022年3月 | |
| x17 R1 | 11 代 i7/i9 | 30 系 | ||
| x17 R2 | 12 代 i9K | 30 系 | 2022年2月 | |
| 18英寸 | m18 | 13 代 i9 | 40 系 | 2023年2月 |
x15 是板载内存，x17 是卡槽内存
x 系列屏幕有 1K165Hz / 1K360Hz / 2K240Hz（15寸独有）/ 4K120Hz（17寸独有）
x 系列有 2 个 M.2 硬盘位，没有 2.5 寸硬盘位
Area-51m R(数字)：可拆 CPU
Area-51m R2：10 代 i7，20 系显卡
以上规则整理于 2021 年 7 月，随着时间的推移，以上信息将逐渐失效。
| 小米电视 5 | 小米电视 5 Pro | |
| 亮点 | 全面屏、超薄金属机身、小爱同学、远场语音、PatchWall、4K、四单元喇叭、3GB+32GB | 量子点、MEMC运动补偿、4K+HDR10+、全面屏、小爱同学、远场语音、PatchWall、4GB+64GB |
| 分辨率 | 3840x2160（4K） | |
| 背光 | 侧入式 | |
| 可视角度 | 178° | |
| 刷新率 | 60Hz | |
| 广色域 | NTSC 85% | NTSC 108% |
| CPU | Cortex A55 | |
| GPU | Mali-G31 MP2 | |
| 内存 | 3GB | 4GB |
| 闪存 | 32GB | 64GB |
| 解码能力 | 8K 视频解码 | |
| 无线 | 2.4GHz/5GHz、蓝牙、红外 | |
| 尺寸 | 55 英寸 长 1227mm 高 717.8mm 含脚架高 773.2mm 65 英寸 长 1445.9mm 高 831.4mm 含脚架高 898mm 75 英寸 长 1676.5mm 宽 973.3mm 含脚架高 1037.7mm | |
| 首发价格 | 55" ¥2999 65" ¥3999 75" ¥7999 | 55" ¥3699 65" ¥4999 75" ¥9999 |
| 首发价格（舍入） | 55" ¥3000 65" ¥4000 75" ¥8000 | 55" ¥3700 65" ¥5000 75" ¥10000 |
本文讲述使用网页开发适用于宴会、活动、年会现场 LED 大屏幕显示抽奖、抢楼、游戏、视频等互动界面，通过在浏览器中打开后 F11 全屏投影到大银幕上。
设计思路：
为了保证最佳的显示效果，设计稿的尺寸按大屏幕的“宽高比”来做（本文以4米*3米的大银幕为例，设计稿以800*600像素为例）。
由于电脑的视频输出分辨率很有可能与大银幕的宽高比不同，那么我们全屏投影后会界面会有变形，但是投影设备接收到电脑视频信号后再全屏显示到大银幕时，界面又会变回正常。
按设计稿的尺寸开发网页，并使用 CSS3 的 scale 实现整体伸缩，目的是自适应窗口尺寸来全屏显示内容，无留白、无裁切。整体拉伸的要求是文字、图片、背景、间距、iframe 等所有元素以统一的比例拉伸，无错位。
网页上通过 JS 设置一些快捷键来实现页面展示内容的切换。
若投影设备功能有限或操作员水平有限等原因导致无法顺利设置输入输出分辨率时，网页可设置 x 轴和 y 轴两个方向的伸缩系数、定位偏移量等，更灵活地实现完美投影需求。
开发要点：
网页尺寸按设计稿来定（以 800x600 为例）。
使用 CSS3 的 transform 的 scale 来实现缩放，以电脑显示器分辨率 1920x1080，宽放大 1920/800 倍，高放大 1080/600 倍，即可将设计稿全屏展示到电脑显示器上。为了更灵活，我们使用窗口大小来代替显示器分辨率，这样不管怎么改变窗口大小或者全屏，设计稿都能完整地显示在窗口上。
在页面初始化和窗口尺寸变化时重新调整设置上述比例。
代码参考：
spacedesk 是一款非常强大的虚拟投影软件，可以将其它电脑、苹果设备（iPhone、iPad）、安卓手机甚至 HTML5 浏览器作为第二屏幕。本文以一台笔记本的屏幕作为另一台笔记本的扩展记录安装配置过程。
主笔记本安装 spacedesk DRIVER
扩展笔记本安装 spacedesk VIEWER
为了保证屏幕最佳的显示效果，我们希望两台笔记本最终的显示分辨率与物理分辨率一致。
我的主笔记本分辨率 1920x1080，扩展笔记本分辨率 1366x768
主笔记本
首先在扩展笔记本中打开 spacedesk VIEWER，连接主笔记本。
在主笔记本，桌面右键“显示设置”，分别针对 1 和 2 显示器设置分辨率：
当然还可以在上上图中的“重新排列显示器”中拖动来实现屏幕内容的显示位置。
扩展笔记本
打开 spacedesk VIEWER，在菜单的 Settings 中选择 Resolutions 可设置显示分辨率：
选择 Compression Quality 可设置显示质量：
压缩（Compression）如果选择 Off，那得看你的电脑能否吃得消，否则显示效果会更卡。我的配置是压缩选择 On，颜色深度选择低，快速，质量 100，帧率选择 60 FPS：
这样比默认设置的显示效果要好很多。
如果有条件用有线连接的话，尽量不要用无线连接，能减少不少延时。
原文标题：新手还在学习排版配色，高手已经在做内容设计了…
任何事物的呈现和传达都需要通过一定的媒介，在媒介承载的过程中，均会产生损耗。我们设计的目的之一就是将所传达的内容在媒介承载的过程中让损耗降到最低，呈现出我们想要给受众的东西，且能够被快速察觉、理解和获取（主动及被动的）。
文本作为语言沟通的书面化，一直以来承载着大量的信息，也是生活中最常见及熟知的方式。
当前人们快节奏的生活状态、快消的阅读习惯以及注意力分散，所以需要我们通过设计手段来减少视觉、心理及认知压力，让用户能够快速定位、理解和消化。同样，我们也需要根据目标、任务甚至品牌的诉求，从而更好的服务于主题。
以下是工作中一些心得和总结，旨在从更多角度去思考和完善，让文本信息能够得到更好的呈现和传达。
一、前提
前提是做事的先要条件。
达成目标
了解受众
具体情景
二、目的
目的是做这件事的动力。
满足用户所需，帮助完成工作；
简单直接，有效传达；
达成一致，统一规范可实施。
三、角度
角度是考虑要做的内容。
准确性
一致性
易读性
内容调性
1. 准确性
秉持文本信息准确明了、简达明意，无歧义
首先要明确所传达的群体对象，尽量避免使用行话，使用「用户」能直接理解的文本信息，当然相应的专业词汇也应给予良好的解释和说明。
案列：我们将 「循环次数」 更改成 「轮播次数」 ，「循环次数」会让人产生思考（循环一次是播放一次还是两次的），而 「轮播次数」 就显得更加直观明了且更符合上下文的语境。
用词完整、阐述直接
用词完整，例如保存修改，而不是简化为保存；阐述直接，避免模棱两可，模糊不清。
内容传达上应做的良好的「自解释」
例如：涉及操作事件的文本命名应根据上下文准确的进行表达，而不是含糊其辞的，使文本能够准确的解释和表达将要发生的事件及行为。
寻找更加合适的表达方式
例如：未输入提示，「XXX不能为空」 和 「请输入XXX」，第一个在表达上其实有一些责怪，而第二个表达同样说明了意思，但在口吻上却更加温和，并告诉用户应该怎样操作和行动。
避免错别字
错别字只会拉低产品的品质和用户内心的形象，请务必严格检查。避免把 「登录」 写成 「登陆」。
准确应用标点符号
标点符号能够赋予文字节奏，表达语气以及对内容的组织。准确应用，能够帮助文字更加有效传达和被人理解。
2. 一致性
同一事物用词一致，消除重复
例如，涉及新建的操作，一会用「新建」，一会又用「新增」、「创建」或者「添加」；涉及称谓，一会用「你」，一会又用「您」、「我」或者「我的」；涉及帮助，一会用「支持」，一会用「帮助」或者「服务」等等，我们应该消除这些重复，统一用词。
相似场景、意思和语境下句式表述一致
例如，未输入提示，应避免「请输入XXX」和「XXX不能为空」等不同的表达方式。
标点符号规范
根据符号使用规范并结合自身产品情况具体定义。例如：全角和半角，如常见「：」和「:」，截断省略「…」等等。又如：标题，提示文本不加结束符号等。
时间表达规范
时间是一个记录戳，需要根据与当前进行定义，显示不同的格式。
例如：今天发生的（自0时起），显示时分（24h）；今天之前发生的，显示月-日（例如02-12）；跨年，显示年-月-日（例如2017-12-30）。
数字使用规范
例如：统计数据统一使用阿拉伯数字。
大小写使用规范
专有名词大小写，单位符号等。例如：iOS
中西文混排规范
中英文之间需要加空格等。
代称一致
第一人称「我」，第二人称「你」和「您」，具体根据场景进行使用，同场景统一一致。你和您请不要随意混用或均使用，应当统一。
操作名称与目的页面标题一致
常见于移动端，在 PC 常见于链接及导航。
3. 易读性
简化内容，避免啰嗦
简单而直接，避免长段使用短语，保持措辞简洁，让读者感受到阅读乐趣，引诱他们深入阅读。
打破复杂冗长
通过段落、有序列表（项目编号）、无序列表等方式使内容结构化，便于视觉扫描。
段落：根据句意，进行分段呈现。
有序：当项目顺序或优先级重要（程序等）时，使用编号列表。
无序：项目相关时使用项目符号列表，但顺序或优先级无关紧要。
结构化：节奏和韵律。例如，电话号码或者银行卡号，使用连字符或空格使其容易被读取和识别。
重要内容突出显示
让用户首先看到最重要的内容，而不是去寻找它们。
经过良好的排版
合理使用文字大小：使用合理的字体大小，太小太大对于屏幕阅读来说都是低效率的。网页端字体大小一般使用不低于12px，更加直观易辨（对于多数人而言）的字体14px和16px；移动端字体大小不小于10pt（sp），12-18pt（sp）都是常用的字体选择范围。
颜色与对比度：颜色我们需要考虑色彩本身（色相、明度和饱和度）给人直观感受和文化寓意的，以及文本与背景之间是否有足够的对比度，从而方便人们可以更加直观舒服的进行阅读。W3C 建议的视觉呈现文本和文本的图像具有对比度至少为4.5:1，大型文字和图像的对比度至少为3:1，具体详情可了解 Contrast (Minimum):Understanding SC 1.4.3
字间距：汉字属于方块字，原则上文字外框彼此紧贴配置，称作密排；在各字之间加入固定量的空白来排列文字，称作疏排；减少字距，使得文字外框一部分重叠，称作紧排。文字排版时，会根据具体情况对字间距进行调整。大多时候我们对采用疏排方式，增加字间距，以提高易读性。
行高：具有良好的行距的文本，更易阅读和引导用户视线。与行之间的空白称为行距，文字尺寸+行距=行高，行距一般介于文字尺寸的50%–100%之间，自然行高的设置一般为文字尺寸的1.5-2倍。文字尺寸较小时，行高设定也会相对较小。行距一般不会超过文字尺寸，因为这样并不会因此而增加易读性。
段间距：段落与段落之间的距离，段间距大于行间距，行间距一般设置为文字大小的2-3倍之间，合适的段间距能够缓解用户的视线压力，起到很好的节奏及阅读定位。
行字数：一行的文字数量。一行文本过长，用户需要去移动脖子或视角，易造成的眼睛疲惫感，造成阅读困难；此外，在大段文本中找到正确的行也将变得困难。过短视线需要不断换行，从而打断了读者阅读节奏，造成尴尬的断裂效果；行太短也会造成用户在一行没读完的情况下去关注和阅读下一行。
虽然至今汉字依然没有正统的方法和具体行字数来衡量文本的完美长度，个人经验在12px下30-60汉字左右（包含标点），具体也要根据内容、人群等约束和变量，当然最重要的是要相信你自己（专业的设计师）的眼睛和判断。
词语尽量避免同行断开：例如，行末为「跳」，下行开头为「转」，读起来就有断句的存在感。
对齐方式：中文（简体）排版一般遵循左对齐的原则，符合我们从左到右的阅读习惯。文字居中，本身不适合可读性，但可用于许多小段文本块。右对齐在表格设置中，可用于数字的对比等应用。
符号避头尾：中文中行首遇到不能置于行首的标点符号，必须要将移动到前一行行尾。
合理突出：对于关键字、要点通过位置、加粗、比例大小和色彩处理等，以便让用户直接关注到。当然也要控制突出数量，毕竟都是「重点就没有重点」，过多也会扰乱和分散用户的注意力。
链接：链接文本需要很好的说明用户将要去何处，可以使用蓝色或者下划线标示出链接的样式，这是用户熟悉方式。神奇的「下划线」为体验赋能
尽量少用斜体：PC 和无线端的各个官方的中文字体包并没有斜体预设，生拉硬扯的倾斜在一定程度上是影响美观度，并造成一定的阅读困难。如果是为了突出或区别可以考虑使用字重、大小和颜色等方式。
层级处理：有对比就有层级关系，可通过大小、字重、色彩、距离、方向、纹理、形状、背景等等方式，可以让整体排版布局更加富有层次结构，让内容的可读性得到明显的提升。 例如：标题、副标题、引用和内容也是一种层级处理（结合了大小、色彩或者距离等等）。
留白：合适的留白可以更好的烘托内容主题，缓解视觉压力。
数量信息前后有汉字时需加空格：不加空格会出现前后拥挤的视感，另一方面可凸显数字信息。
4. 内容调性
依据产品定位，通过文本表述传递其相应的价值观和情感诉求
任何产品都有所针对的人群及自身的品牌形象。C端产品和 B端产品，儿童产品和成年人产品，所使用的语言表达方式自然也都是不一样的。
依据不同状态和用户群体
根据状态（正面、中性和负面）和用户（新手、中级用户和专家），使用合理的语调及用词规范，以适应不同的情境和状况。
始终坚持积极主动的，而不是消极令人沮丧
「请输入内容」与「错误，内容不能为空」，同样的意思却有不同的感受，从积极的一面表达就是传播正能量。
四、通用产出物
字体
日期和数字
标点符号
大小写
中英文混排
代称
1. 字体
字族 Font-Family
Font-Family 属性设置的字体系列。Font-Family 属性设置多个字体作为一种「后背」机制，浏览器不支持第一种字体，它会尝试下一个字体。
如果字体系列的名称超过一个字，它必须用引号，如Font-Family：「宋体」。
对于依附在 PC 端产品而言，统一的字体规范，以保证在不同平台、不同浏览器下保持良好的美观性和易读性。
以下呈现的是 Ant Design 的字体家族。个人在使用了多款后，觉得最好的一份：
font-family：「Chinese Quote」, -apple-system, BlinkMacSystemFont, 「Segoe UI」, 「PingFang SC」, 「Hiragino Sans GB」, 「Microsoft YaHei」, 「Helvetica Neue」, Helvetica, Arial, sans-serif,「Apple Color Emoji」, 「Segoe UI Emoji」, 「Segoe UI Symbol」;
如果大家想了解字体排列前后顺序的玄机可以认真看《推荐！Web中文字体应用指南》这篇文章。
以下备注区域，是我在使用字族的路上磕磕碰碰所收集到的有限知识，也算知其所以然了，若有不妥、错误和缺漏欢迎指正。
备注区域：
-apple-system：macOS 和 iOS平台的 Safari 调用 SanFrancisco 字体
BlinkMacSystemFont：macOS Chrome 调用 SanFrancisco 字体
Roboto字体，由 Google 开发，是 Android 4.0「Ice Cream Sandwich」及后面Android版本的默认字体。
Segoe UI 取代Tahoma，Windows 从 Vista 开始的界面默认西文字体。利用 ClearType 技术的新字体 Segoe UI 看起来比现在略显僵硬的 Tahoma 更加人性化。
Tahoma 被采用为 Windows 2000、Windows XP、Windows Server 2003及 Sega 游戏主机 Dreamcast 等系统的默认字型。
Arial 是一套随同多套微软应用软件所分发的无衬线体 TrueType字型。
Microsoft YaHei 微软雅黑，该字体将作为 Windows Vista 的默认字体取代2001年推出的 XP系统下默认的宋体汉字，以支持高清显示的 ClearType 功能。
Simsun 宋体，一直是简体中文版 Windows XP系统及之前版本的默认字体。但由于字体的特性，在Windows Vista 中已经改用支持 OpenType 的微软雅黑，
HanHei SC 威锋瀚黑，现苹果简体中文，OS X 10.11 El Capitan 开始，
STHeiti 华文黑体，分为「黑体-简（Heiti SC）」和「黑体-繁（Heiti TC）」，OS X 10.6 Snow Leopard 直至 OS X 10.10 Yosemite。
Hiragino Sans GB 冬青黑体
STXihei 华文细黑，是苹果公司 Mac OS X9 以及之前版本的操作系统的中文默认字体，截至 OS X 10.5 Leopard。
PingFang SC 为 iOS9.0 以后系统自带中文字体。
SanFrancisco iOS9 正式发布之后，替换了之前的 Helvetica Neue 成为了 iPhone/iPad 系列设备的默认字体。
Myriad Set Pro 苹果向 adobe 公司定制了一款西文字体，是以 myriad 为原型的，完成后在市面上叫做「myriad set」，后期升级为「myriad set pro」。
Helvetica Neue 意为「新 Helvetica」
Helvetica 是苹果电脑的默认西文字体
sans-serif 并非一个具体字体，而是css的通用字体族，具体是什么字体是由浏览器设置决定的。
字号 font-size
标题，内容，注释说明等不同字号的大小。
字间距 letter-spacing
根据不同字号，及文本数量进行字间距定义。
行高 line-height
设置行高能很好的解决，缓和上下文本之间拥挤在一起的情况。
颜色 text-color
这里主要讲下注意对比度的问题，很多产品在这一点上都忽视了这一点，搞出了所谓的「小清新」。
你可以查看完整的《网页内容可访问性指南WCAG 2.1》
《掌握具有共享样式的文本系统》（搭梯子访问）
2. 日期和数字
日期
使用完整数字日期，如：2018-01-02。
时间
使用24小时制，如 13:01:29
具体到时分秒，如当前对话显示 09:01:02
使用半角 「:」
日期和时间之间包含一个空格，如 2018-09-01 13:01:20。
数字
使用阿拉伯数字。
对四位或更多位数的数字使用逗号。
对手机号码使用前后无空格的连字符「-」。不要使用点，空格等其他符号。
数字范围使用前后无空格的连字符「-」。
正负数后不加空格。
数字和字符之间不需要空格
货币
人民币符号（¥）在数字前面，精确到小数点后两位。
测量单位
储存单位（B、kB、MB、GB、TB），在数量和度量单位之间包含一个空格。
对于长度「毫米（mm）、厘米（cm）、分米（dm）、千米（km）、米（m）、微米（μm）、纳米（nm）等」和重量「千克（kg）、克（g）、毫克（mg）、微克（ug）等」等测量单位应为小写（电流单位除外）。在数量和度量单位之间包含一个空格。
屏幕单位「像素（px）、逻辑分辨率（pt、dp、sp）、英寸（in）等 」应为小写。在数量和度量单位之间包含一个空格。
在连续列出尺寸时，将度量单位放在末尾，而不是在每个数字之后，并包括一个空格。
在所有情况下，数字和单位之间包含一个空格。HTML代码的最小空间是 & hairsp; 或 & #8202;
测量单位分为基本单位和导出单位。国际单位制共有7个基本单位长度：
长度：米 m；
质量：千克（公斤） kg；
时间：秒 s；
电流：安[培] A；
热力学温度：开[尔文] k；
物质的量：摩[尔] mol；
发光强度：坎[德拉]cd；
并由物理关系导出的单位称「导出单位」 。
3. 标点符号
省略不必要的标点
标题、副标题、输入框下的提示文本、输入框占位符、悬停提示中的文本、Toast中、弹窗等短句，在遣词造句时尽量避免标点符号，始终末尾不要使用句点。
有序列表和无序列表
使用冒号引入项目列表，列表后不使用标点。
使用列表来表示步骤、组或信息集。简要介绍列表的上下文。在顺序重要时列出数字列表，比如当您描述流程的步骤时。当列表的顺序不重要时，不要使用数字。
常用标点符号规范
空格：链接与前后文本之间增加空格；数字和单位之间包含一个空格；电话号码与前后文本包含一个空格；
省略号「…」：半角省略号，超出截断代替省略文本；
星号「*」：半角星号。表单必填、说明备注；
连接号「-」：半角连接号，前后无空格，如2018-01-04，2008-2018；
冒号「:」：半角冒号，用于时间的表示，如16:45 ；
冒号「：」：全角冒号，用于表单；
破折号「——」：中文破折号占两个汉字空间；
书名号「《》」：产品中常用于法律条文。
相关推荐：
4. 大小写
专门名词大小写
文件格式
当一般引用文件扩展名类型时，全部大写而不包含句点。
GIF
PDF
HTML
JPG 格式
引用特定文件时，文件名应该是小写的：
内容策略-设计完全手册.pdf
皮皮虾.gif
西湖.jpg
hot.html
5. 中西文混排
中英文之间需要加空格
中文与数字之间需要加空格
中文为主，使用全角符号且与英文或数字之间不加空格
6. 代称
为了表达双方的平等，避免使用「您」。使用「你」代称客户/用户，借以表达客户的口吻。在客户/用户为主的情况下使用「我」。避免同一句子中混用「你」和「我」。
对于「您」还是「你」的使用并非绝对，主要看行业以及服务的对象
在《胜于言传-Web内容创作与设计的艺术》中作者建议：
当用户提问的时候：
在问题中使用「我」和「我的」（用户的声音）
在答案中使用「你」和「你的」（应用对用户说话）
用「我们」和「我们的」代表回答公司
当应用提问的时候：
在问题中使用「你」和「你的」（应用向用户提问）
在答案中使用「我」和「我的」（用户的声音）
用「我们」和「我们的」代表回答公司
五、指导建议
操作行动
文本说明
句式结构
语音和语调
写作建议
1. 操作行动
按钮
清晰可预测。应该能够预测当点击按钮时会发生什么。
行动号召。按钮应始终带有强烈的动词，鼓励行动。为了给用户提供足够的上下文，在按钮上使用 {动词} + {名词} 格式，除了保存，关闭，取消或确定等常用操作。
以下是常用词的含义，以避免不恰当或混淆使用：
所有具体的用词需结合场景和生活习惯。
链接
使用描述性的链接文本。切勿使用「点击这里」或「这里」作为链接文本。
如果一个链接出现在句子的末尾或逗号之前，不要链接标点符号。
链接使用蓝色，这是用户习以为常的认知，并明确区分点击和未点击的区别。
2. 文本说明
对操作说明，功能说明，名词（术语）解释，提示信息等进行用户测试，是否明白其意，记住这是一个不断优化的过程。
以下是产品内的主要文本：
操作文本：按钮；
导航文本：全局和局部导航、目录、链接；
说明文本：功能说明、术语解释；
提示文本：弹框、toasts、操作反馈、系统反馈、通知等；
操作说明：功能引导说明，操作文档；
标题和副标题：弹框标题、操作说明标题、法律条款标题等；
条款：法律条款、申明；
ALT：为图片添加文字说明。
3. 句式结构
通用场景下的语句可进行归纳在一起，形成统一的句式结构。
例如：
操作反馈：成功直接提示结果，失败显示结果+说明原因+如何解决。
二次确认：先说明利害，再询问是否操作。
标题：「动词」+ 「名词」格式等。
4. 语音和语气
这听起来是谁，什么样的语音和语气能代表我们，我们想传达什么的形象。
因此，你可以建立一套准则，一般而言准则应该：
基于产品当前的业务；
准则可被执行，避免过于空洞；
易于记忆，3-5个尚可；
并随着产品发展和愿景的变化而不断适应改进。
例如：
积极主动
始终坚持积极主动的，而不是消极令人沮丧。
自信专业
避免听起来傲慢、亲密、孩子气或其他不适当的或非正式的。
友好尊重
依据不同状态（正面、中性和负面）和用户群体（新手、中级用户和专家），使用合理的语气及用词规范。
5. 写作建议
个人写作过程中的一些小感悟：
好的结果是不断修改来的，修改的基础是要先写下来，所有先记录而不是停留在脑子里，这才是一切开始的基础。
记住用户很忙且没有耐性，甚至不聪明，这会不断的促使你修改调整。
找人阅读并呈现结果，并询问其含义和建议。这是检验的最佳实践。
过段时间再来看看，或许有更好的方式。
结尾
这并非是一个完整的（内容层面可能保存图片风格，插画图标等），还有很多地方可以补充。重要的是找到适合你的产品，并有这样的意识去不断优化你的产品内容，从而更好的服务你的用户。
| 项目 | 尺寸（宽*高） |
| 手机网页/应用 | 参 iPhone 屏幕分辨率 |
| X展架、易拉宝 | 60cm x 160cm、80cm x 180cm 等 |
| 名片 | 90mm x 55mm、85mm x 54mm |
| A4纸 | 210mm x 297mm 参 |
| 三折页 | (A4)210mm x 285mm |
| LED显示屏单元板分辨率 | 32 x 16（点距1cm的话就是32cm x 16cm）、64 x 32 等 |
| 分辨率 | 宽高比值 | 最简宽高比 |
|---|---|---|
| 7680×4320（8K） | 1.777777777777778 | 16:9 |
| 3840×2160（QFHD 4K） | 1.777777777777778 | 16:9 |
| 2048×1536（QXGA 2K） | 1.333333333333333 | 4:3 |
| 2560×1600（WQXGA 2K） | 1.6 | 8:5 |
| 2560×1440（1440p Quad HD 2K） | 1.777777777777778 | 16:9 |
| 1920×1080（1080p Full HD） | 1.777777777777778 | 16:9 |
| 1680×1050 | 1.6 | 8:5 |
| 1366×768 | 1.778645833333333 | 约16:9 |
| 1360×768 | 1.770833333333333 | 约16:9 |
| 1280×1024 | 1.25 | 5:4 |
| 1280×800 | 1.6 | 8:5 |
| 1280×768 | 1.666666666666667 | 5:3 |
| 1280×720（720p HD） | 1.777777777777778 | 16:9 |
| 1024×768 | 1.333333333333333 | 4:3 |
| 800×600 | 1.333333333333333 | 4:3 |
| 2436×1125 | 2.165333333333333 | 约13:6 |
原文：http://mathewsanders.com/designing-adaptive-layouts-for-iphone-6-plus/
翻译：叮当当咚当当小胖妞呀
从IOS6开始，苹果公司就一直建议我们使用自适应布局，但是迄今为止，我发现大家都在回避这个问题，考虑的最多的仍然是固定布局。
iPhone 6的上市让人们很难再去逃避自适应布局这个问题，四种屏幕尺寸（如果要支持iPad就要上升到5种）、三种分辨率和转向似乎让着手于自适应布局变得更加简单。
在文章的最后，你应该能流畅使用 storyboards、 约束(constraints)和 size class特性，这三个是Apple为开发和制作自适应布局提供的Xcode工具。
所以下载Xcode6，给自己来杯饮料，留上一个小时的时间，让我们开始吧！
- Storyboards
- 模拟尺寸
- 约束
- 头部和尾部空间
- 横向空间约束
- 同等宽度约束
- 纵横比约束
- 约束管理
- 添加约束
- 检查和编辑现有约束
- 删除约束
- 布局问题和冲突
- 错位视图警告
- 约束缺失错误
- Size Classes
- 宽度和高度特性
- 我们的目标…
- 为通用的size class添加约束
- 为iPhone纵向布局添加约束
- 为iPhone横向布局添加约束
- 编辑助手：设备预览
- 为iPad布局添加约束
- 使用布局和间隔视图
- 布局视图样例
- 间隔视图样例
- 下一步
Storyboards
Xcode中，storyboards可以让你在屏幕上拖动和放置原生对象（例如按钮、图片、文本框和标签）并且定义每个屏幕之间如何连接。
在Xcode专业术语中，可以看到、摸到、互动的用户界面元素，我们称之为 视图（按钮、图片、文本框、标签等等）。
包含并管理所有那些视图的屏幕被称为 视图控制器，我倾向于交替使用这些术语。
当我们在一个storyboard上添加视图控制器的时候，它的纵横比其实跟任何设备都不匹配，事实上，它是一个完美的600pt*600pt的正方形：
这提醒了我们，storyboard屏幕并不代表特定硬件上的屏幕，而是 任何IOS设备的抽象表现。
模拟尺寸
也许你不介意在600pt*600pt的画布上操作，但是在实际大小上操作可能会更有帮助。
我们可以非常方便的在Xcode里改变视图控制器模拟的尺寸和转向：
约束
向你们展示约束的最好方法是实例。
我们先创建一个简单的包含一个屏幕的storyboard（模拟4英寸iPhone的尺寸），再添加两个相邻的正方形。
当我们在竖屏中运行app的时候，这两个正方形完全按照我们的布局排列，当我们变成横屏时，它们仍然忠于自己的坐标：
当我们使用iPhone 6模拟器运行项目的时候，我们可以再一次看到，我们的布局并没有自适应不同的屏幕尺寸，屏幕右边多出了可见的空白区域。
这是由于没有约束，这些对象仍然会按照我们在storyboard上创建的x,y坐标和面积来定位。
所以让我们开始添加约束，看看会对它们有些什么影响。
头部和尾部空间
我们在蓝色方块前添加10pt的头部空间约束，在红色方块后添加10pt的尾部空间约束。
当我们运行项目的时候，约束把蓝色方块固定在屏幕左侧，把红色方块固定在右侧。
横向空间约束
我们在两个方块之间再添加一个10pt的横向空间约束，就像上一个约束一样，这样会让两个方块之间有一个固定的空间。
当我们运行项目的时候，会发现一个意料之外的结果：我们所有的约束都满足了，但是为了满足所有约束，其中一个方块被拉伸了。
这似乎告诉我们这样一件事：除非被告知，否则IOS会尽量让大多数对象都保持“自然”大小。
同等宽度约束
我们添加一个同等宽度约束。
当运行项目的时候，我们可以看到两个方块宽度的增量相同。
纵横比约束
最后，对两个方块添加纵横比约束。
这个约束保证了宽度和高度的比永远是相同的。
当我们运行app的时候，我们可以看到每个方块的宽度在增加，高度也同时在增加。
用iPhone 6模拟器运行项目，覆盖我们之前添加过的约束，你可以看到这两个正方形是如何利用可用空间来拉伸的。
约束管理
现在你已经看到了我们是如何使用约束的，下面我们来介绍一下具体操作。
提示：尽量少使用约束
添加约束的一个要点是试着挑战自己，越少使用约束越好。
虽然我并不认为添加的约束数量能够很大程度上影响IOS的性能，但是越少的使用约束，你的布局就会越好维护。
添加约束
在storyboard中添加约束有三个方法：
- 约束弹窗也许最好的方法就是选择一个或多个对象，从其中一个弹窗中添加约束。我认为这是个很好的方法，因为可以看到现有约束的范围。如果有一条约束不可用，可能就意味着你需要两个或更多对象来实施这条约束。
- ctrl + 拖动你可以按住ctrl键，同时拖动到一个对象上（可以是相邻对象、父级对象或者是自身），会出现一个浮层告诉你可以被添加的约束有哪些。这是我最喜欢的添加约束的方法，因为你不需要把你的鼠标移动到大老远的底部再回到对象。
- 菜单/绑定你也可以选择一个或多个对象，在菜单中点击 editor -> pin来选择约束，这其实是最没有效率的方法，但是如果你发现自己不停的重复添加一种约束，也许为一个或多个选项添加绑定更合理一点。
检查和编辑现有约束
检查视图中应用的约束最简单的办法就是选择视图，切换到Size检查面板。
或者在文档大纲层次面板中切换constant数值。
无论是哪种方法，选择约束可以让你直接更新它。
删除约束
同样的，约束也可以通过高亮+点击删除按钮来删除。
要删除一个视图的所有约束，或者屏幕中的所有约束，在布局问题弹窗中有一条捷径：
布局问题和冲突
当我们在storyboard中添加约束的时候，Xcode总会给出一些关于这些约束的警告或者错误。
有时候这些问题可以忽略不计，但是更多的时候，它们必须被解决。
查看约束警告和错误最好在文档大纲面板中，每个视图控制器会有一个红色或者黄色的icon来表示是不是有布局问题：
错位视图警告
一个比较常见的警告是错位视图警告，如果约束规定这个视图应该在的地方，和这个视图实际在的地方不匹配，那么这种警告随时会出现。
当你转换模拟尺寸或者不小心用鼠标移动了一个视图，这些警告也会出现。
点击一个错位的视图，屏幕上会出现一个虚线框，告诉你约束规定了这个视图应该在的位置。
如果点击警告，会出现一个带有几个选项的浮层，你可以选择让Xcode更新约束来匹配storyboard上的位置，也可以让Xcode更新框架来移动或者拉伸视图，使它们回到约束规定的位置。
缺失约束错误
让我们回到一开始蓝方块和红方块的例子，我们没有添加过一个关于纵向位置的约束，但当我们运行app的时候看起来完全没问题，因为IOS会认为纵向位置就是我们在storyboard上放置的位置，不过为了避免一些意料之外的行为，我们最好还是规定一下。
在 顶部布局向导添加顶部空间约束可以消除一些说不定道不明的约束和错误。
Size Classes
为了在大多数基础布局或者更高级的布局上使用约束，你需要同时使用size classes。
Size classes是一种能够告诉你物理设备宽度和高度的特性。
当我们在storyboard的屏幕上添加对象或者约束时，只有设备符合当前的宽高特性，对象才会显现，约束才会被应用。
这是一个非常有用的方法，它让我们确定了不同设备和转向下布局的变化。
高度和宽度特性
使用 紧凑(compact)、 任意(any)和 正常(regular)这三种的组合，可以让我们确定一些范围内的设备布局。
虽然不能涉及每一个变化（比如不能确定iPhone 6 Plus的竖向模式，也不能让iPad的转向消失），但是大多数的变化都可以确定。
我们说过，介绍size classes最简单的方法是实例，所以让我们看一个例子。
我们的目标…
作为例子，我们做一个Instagram详情页的简单版本，可以适应大屏和转向。
我们的目标是创建一个布局，它可以机智的适应更大的iPhone 6设备（我说的机智，是指只有照片会放大，其他的元素如头像照片仍然不变），并且当设备横屏的时候，图片和元数据会并肩排列，而不是像竖屏时的上下排列。
为通用的size class添加约束
跟之前的例子不同，这次我们不使用模拟尺寸度量，我们使用通用size class的抽象方形布局，这样会使我们记住，为这个size class添加的任何视图和约束，只能是那些添加在任意屏幕尺寸和转向上的视图和约束。
我们需要用到这些约束：
除了必要的空间、间隙和纵横比约束，我们还需要让某些对象排列在顶部或者底部。
现在，在你的storyboard上添加视图和约束吧。做这步的时候，我的storyboard长这样：
注意，现在我们有了所有转向上所需要的元素，但是我没有费心完成每个转向上的布局，下一步我们才会做！
为iPhone纵向布局添加约束
现在，我们把size class切换到 紧凑宽度和 正常高度，这个尺寸特性的组合适用于任何竖屏下的iPhone设备。
如果要切换size classes，点击storyboard中下方的size class标签，选择你想要看到的宽高组合。
注意，当你切换size class时，视图控制器的尺寸会更新来显示新的抽象布局。
最后，你可以重新定位、拉伸视图和添加竖屏上的约束了。这里有一些我添加到竖向布局上的约束：
这是我做到这步时，我的storyboard的样子：
在这个阶段，你可以用任何的iPhone模拟器（3.5、4、4.7或者5.5英寸屏幕）来运行你的项目，看看竖屏情况下的布局是否合理，虽然如果转向成横屏时，布局看上去会一团糟。
注意，我们没有固定图片的宽度，我们只是简单地把图片的左右边缘固定在屏幕两侧。当变为更大的iPhone 6屏幕尺寸时，图片会被拉伸，又因为我们添加了一个固定图片纵横比的约束，所以高度也会同时增加。
为iPhone横向布局添加约束
现在切换size class到 任意宽度和 紧凑高度，这种尺寸特性的组合适用于任何横屏下的iPhone设备，并且会为了满足横屏视图下的目标更新布局。
这次，图片的顶部、左边和底部边缘都被固定在父级视图的边缘。
这个局部另一个有意思的地方是，在评论标签上添加的尾部空间约束。
当图片的约束使得图片变大的时候，这个标签上的约束会使得自身变窄。为了适应这种视图下的文本，文本高度需要增加到两行——的确如此！
下图是我做到这步时storyboard的样子。注意，在文档大纲中，一些约束会稍稍渐隐，这些约束是在竖向视图中我们添加的，它们仍然存在，但是当我们选中当前的宽高特性时，它们不会被应用。
也要注意，当你转换宽高特性时，storyboard会更新以便显示你为那些特性增加的约束。太棒了！
现在运行项目，我们会发现当转向改变时，我们有了一个既适用于横屏又适用于竖屏的布局，更棒的是在转向时，会有一个完美的过渡动画。
我把整个过渡动画放慢，这样你们能看的更加清楚。注意动画中也有层级关系，正由于此，即使在正常布局下视图并没有重叠，我们也需要考虑如何安排视图的层级关系……
编辑助手：设备预览
Xcode另外一个很有用的东西：设备预览助手。你不再需要无数次运行项目来检查你的布局是否正确，你只需要使用编辑助手storyboard预览，选择你想要的所有设备和转向就可以了。
这并不是完美的（比如导航条的颜色在这个例子中缺失了），但是它却是一个很好地选择，它可以让你把你自己的语言切换到双倍长度伪语言，可以在你的storyboard中重复任何文本。
这是我storyboard上的预览助手，它展示了一个3.5英寸横屏和4英寸竖屏的iPhone，你可以看到我还需要再加工加工来适应更长的标签……-_-
为iPad布局添加约束
现在，切换size classes到 正常宽度和 正常高度，这是iPad横屏和竖屏的特性。
就像之前一样，我们重新定位、拉伸我们的视图。对于iPad布局，我决定使用固定尺寸的图片（所以它不会像在iPhone上那样切换横竖屏时会改变大小），元数据都显示在图片底部。
下图是我在重新排列视图并添加了约束之后的storyboard：
到现在为止，我们为某些特别的size class特性添加了约束，但是现在我们要尝试些不同的东西。
由于iPad上会有多余的空间，我们不要仅仅只是重排视图，让我们来加一点额外的内容。对于这个例子来说，我们再加两张图片（也许是在这张主照片之前和之后拍摄的照片）。
这是我的storyboard更新之后的样子：
我原本可以手动输入这些次级图片的宽高，但我没有，取而代之的是我让它们的尺寸变成主图片的某个比例。
这样做的好处是如果我们决定改变主图片的尺寸，布局的其他部分会自动的计算并且更新次级图片的宽高，而不用我们手动输入。
这是一张我截的图，我改变了主图片的宽度约束，可以看到其他的部分也随之更新了。
我没有在iPad模拟器上运行项目并截屏，不过这里有一些横屏和竖屏的效果图：
使用布局和间隔视图
Xcode中有些约束我们可以随时运用，但是对于一些些常见的布局，我们需要一点帮助。
布局视图样例
要把一个视图的边缘固定在父级视图的边缘，或者把它固定在父级视图的正中心是件很简单的事情，~~但是我没有发现简便的方法，让视图固定在离正中心有一段固定距离的地方。~~感谢Jeff Nouwen指出，在把视图固定在中间后，你可以改变constant值来达到你的期望。
理论上来说，我们需要的是一个‘ 中心排列导向’，即任何视图都能水平和垂直居中与父级视图中：
为了实现这个目标，通过现在我们可以使用的约束，我们把我们的视图嵌入一个外层视图（这个外层视图没有背景色，只是为了帮助我们布局而存在），可以把它定位在父级视图的中间。
通过这个方法，你的约束看起来可能像这样：
现在我比较喜欢让我的布局层级尽量平。另外一个不使用外层视图的方法，我叫它 布局视图。
使用这种方法，我倾向于在storyboard中添加一个颜色明亮的视图，然后把它的hidden属性设置为true，你仍然可以在storyboard布局中看到它（虽然稍稍渐隐），但是运行模拟器的时候它不会出现。
现在你在你的视图和布局视图中可以添加 居中排列（align center to center）。
间隔视图样例
之前我们看到了我们是如何固定视图边缘到父级视图边缘的间隙，使得当父级视图变大时，间隙约束也会让视图变大。
但是如果我们想要视图仍然保持原来的大小，在父级视图变大时，视图之间的间隙也变大呢？
理论上来说，我们想要某种类似 同等宽度约束的约束，只不过同等宽度约束是作用在视图上，我们想让它作用在约束上。
此时我们需要添加 间隔视图来帮助我们布局，但由于我们不想在运行app时看到它们，我们会把它们的hidden属性设置为true。
使用这项技术的方法，是为每一个你想要等比增长的间隙添加一个间隔视图，把其他视图的边缘固定在间隔视图的边缘上，然后为所有的间隔视图添加 同等宽度约束。
下一步
现在希望你们已经完全有信心开始探索应用约束的布局了。
不要指望能即刻成功，Xcode是一个非常复杂的工具，除了storyboard和约束之外它还有很多其他功能，有些功能刚开始使用会觉得很神秘和困惑。就像其他复杂的工具一样，在你熟悉它的怪癖之前你还需要一段适应时间，但是我建议你尽早的去熟悉它，因为我预计（至少我希望）下一代设计师会更多地使用Xcode这样的工具而非Photoshop。
如果你是一位创建设计规范的设计师，并想让IOS开发者遵循你的规范，你应该开始考虑和你的设计团队沟通的最好方法。也许你会创建一个视觉语言来描述你想要应用的约束。
我个人认为，设计师应该更多地承担一些他们创建工作上的责任，而不是让一个前端开发人员重新创建设计意图，而设计师只是管理storyboard文件。
如果你发现这个教程上有任何难以理解的地方，或者有错误的敌方，请让我知道，我会尽快更新这篇文章。