我对于在缩写词中使用 <abbr>
标签非常懒。大多数阅读像这样的科技博客的人可能理解它们,但肯定有一些访问者不理解,而一个简单的工具提示解释会对他们有所帮助。也许有了这个简单易用的复制粘贴资源作为参考,我实际上会开始使用它。毕竟,这是一个教育博客。
<abbr title="Customer Relationship Management">CRM</abbr>
<abbr title="Content Management System">CMS</abbr>
<abbr title="Structured Query Language">SQL</abbr>
<abbr title="International Organization for Standards">ISO</abbr>
<abbr title="PHP: Hypertext Preprocessor">PHP</abbr>
<abbr title="HyperText Markup Language">HTML</abbr>
<abbr title="eXtensible HyperText Markup Language">XHTML</abbr>
<abbr title="Cascading Style Sheets">CSS</abbr>
<abbr title="JavaScript">JS</abbr>
<abbr title="European Computer Manufacturers Association Script">ECMAScript</abbr>
<abbr title="Internet Service Provider">ISP</abbr>
<abbr title="Internet Protocol">IP</abbr>
<abbr title="HyperText Transfer Protocol">HTTP</abbr>
<abbr title="Really Simple Syndication">RSS</abbr>
<abbr title="Internet Relay Chat">IRC</abbr>
<abbr title="File Transfer Protocol">FTP</abbr>
<abbr title="Asynchronous JavaScript and XML">AJAX</abbr>
<abbr title="Domain Name System">DNS</abbr>
<abbr title="Document Object Model">DOM</abbr>
<abbr title="Object Oriented Programming">OOP</abbr>
<abbr title="Don't Repeat Yourself (programming principal)">DRY</abbr>
<abbr title="Secure Sockets Layer">SSL</abbr>
<abbr title="Ruby on Rails">RoR</abbr>
<abbr title="Keep it Simple, Stupid">KISS</abbr>
<abbr title="Linux, Apache, MySQL, PHP (common server configuration)">LAMP</abbr>
<abbr title="Cross Site Scripting">XSS</abbr>
<abbr title="Search Engine Optimization">SEO</abbr>
<abbr title="Joint Photographic Experts Group (file format)">JPG</abbr>
<abbr title="Graphics Interchange Format (file format)">GIF</abbr>
<abbr title="Portable Networks Graphics (file format)">PNG</abbr>
<abbr title="Photoshop Document (file format)">PSD</abbr>
<abbr title="Adobe Illustrator (file format)">AI</abbr>
<abbr title="Software as a Service">SaaS</abbr>
<abbr title="Syntactically Awesome Stylesheets">SASS</abbr>
<abbr title="Red Green Blue">RGB</abbr>
<abbr title="Hue Saturation Lightness">HSL</abbr>
<abbr title="User Interface">UI</abbr>
<abbr title="User Experience">UX</abbr>
<abbr title="JavaServer Pages">JSP</abbr>
<abbr title="Active Server Pages">ASP</abbr>
<abbr title="What You See Is What You Get">WYSIWYG</abbr>
也许可以有一些 WordPress 插件可以对帖子内容进行正则表达式匹配并自动完成这项工作?
我应该在列表中添加一些吗?我可能会将上面的列表专门保留为网页开发缩写词,而不是一般的计算机/互联网缩写词。
UI (用户界面)
UX (用户体验)
.jsp? .aspx?
.shtml?
WYSIWYG (所见即所得)
WTF ?
WYSIWYG 不是缩写词,而是首字母缩略词,因为它是可以发音的,对吧?
不用在意。没看到(下面)在 html5 中缩写词标签已弃用——所有内容(缩写词、首字母缩略词)现在都属于 abbr 标签。
这里还有几个。我知道我以后会想到其他的。但是如果你要费心去做这件事,<pre><acronym></pre> 元素是否更适合,或者它是否已弃用。它们似乎表现相同
DRY - 不要重复自己(指的是函数、OOP 等)
JSP - Java Server Page(Java 的脚本语言……不要与 Javascript 混淆)
SSL - 安全套接字层
CF - Cold Fusion
RoR - Ruby on Rails
DBMS - 数据库管理系统
LAMP - 最常见的服务器配置(Linux、Apache、MySQL、PHP)
CGI - 通用网关接口
ASP - Active Server Page(微软)
XSS - 跨站点脚本攻击
DHTML - 动态 HTML
W3C - 万维网联盟
SEO - 搜索引擎优化
WYSIWYG - 所见即所得。(通常指的是嵌入页面中的富文本编辑器。)
缩写词标签已弃用,我相当确定。很棒的补充。我会尽快添加。
更多
URL / URI - 统一资源定位符 / 标识符。(网页地址,例如 http://www.google.com。有些人可能会争辩说两者之间存在差异。我从来没有真正弄明白两者之间的区别,我认为 WC3 现在将它们视为同义词。)
剩下的这些都属于网页设计的灰色地带,但是
JPEG - (图像类型和文件扩展名。通常缩写为 JPG)联合图像专家组
GIF - (图像类型和文件扩展名。)图形交换格式
PNG - (图像类型和文件扩展名。)可移植网络图形
以上是 Web 上使用的三种主要图像类型。
PSD - (预处理图像。可能是网站设计阶段最常用的图像格式。)Photoshop 文档
ICO - (图像类型和文件扩展名。)图标。通常不用于网页,而是用作 FAVICON.ICO,即在现代浏览器的 URL 栏中显示的图像。
DRY 和 AJAX 应该是缩写词,但其他大部分都是首字母缩略词。所有这些都是缩写。我想缩写词太少,无法在 html5 中被选中(尽管不知何故 i、b 和 u 被选中了)。http://www.w3.org/TR/html5/text-level-semantics.html#the-abbr-element
就所有意图和目的而言,缩写词=首字母缩略词。HTML4 规范在这方面非常混乱,将首字母缩略词称为“缩写”,将可发音的首字母缩略词称为“缩写词”。
谢天谢地,在 HTML5 中,它们都属于“abbr”标签,这比为细微不同的用途使用两个不同的标签更简单。此外,“abbr”更短,这总是好的。现在他们只需要用“st”替换“strong”;)
做到了。令我惊讶的是,它第一次尝试就成功了º_º
所有更改都是动态的,它不会更改数据库,它不会替换
catnIP
,它不区分大小写('ip' 和 'IP' 都将被替换),并且只需将其粘贴到functions.php
中即可工作实际上,这太愚蠢了,这里有很多重复,这是一个改进版本:http://d.pr/qWfh
非常酷。用缩写词两侧的空格搜索它们是否更有意义?或者它已经使用 \b 完成了?
记录在案,Matt Mullenweg 在将近 10 年前编写了一些 PHP 来执行此操作:http://ma.tt/scripts/acronymit/ 但是它不是 WordPress 函数,并且使用的是已弃用的标签。
那个函数太棒了!
这是一个非常通用的缩写,但我认为没有任何列表是完整的,没有 KISS => “保持简单,愚蠢”或“保持愚蠢简单”(如果你感觉良好)
“所以我的朋友 DOM 昨天给我打电话,但我错过了他的电话,因为我刚洗完澡,需要把身体擦干。他想知道我是否想要去看曼联对 AJAX 的比赛的门票。就在我回拨他的电话时,我看到我的宠物 ASP 逃跑了,在惊讶之下,不小心打翻了我的 LAMP。”
:D
Scott,我之前没有想到这一点,最好的解决方法是删除正则表达式末尾的
i
,这样它只匹配大写缩写。而且你不太可能在使用任何这些缩写词的博客上谈论曼联对 AJAX 的比赛!Chris,是的,
/b
用于词边界,因此它应该只匹配前缀和后缀为空格、换行符和标点的缩写词。更多内容请访问 regular-expressions.info/wordboundaries.html嘿 Federico,
我尝试了你发布的代码和你链接的改进版代码。很棒的想法。但是出于某种原因,你链接的改进版代码对我不起作用。我遇到了由允许的内存不足引起的致命错误。你知道为什么会这样吗?
谢谢。干得好!
nm 我明白了
我发现这是一个非常好的想法。有一个 WordPress 插件可以做到这一点。它被称为 缩写词。
该插件在 WordPress 仪表板中提供缩写词列表。
我刚刚在 3.3 beta 版安装中安装了它,它运行良好。
它确实使用缩写词标签而不是 abbr 标签,但我怀疑这可以很容易地更改。
插件文件夹中的 acronyms.php 中的第 377 行是您需要更改以使用 abbr 标签的行。
奇怪的是,我刚 fork 了缩写词插件,使其支持 HTML5,你可以在此处找到它:缩写词 2。
SEO 有个拼写错误
一种可能
http://bueltge.de/wp-abbreviation-replacer-plugin/100/
我相当确定 HSL 中的亮度应该是亮度而不是亮度。
不是可扩展的,而是可扩展的。
ISO = 国际标准化组织
一个相关的想法
我个人认为,“abbr”标记会影响可读性。文本必须进行修饰以区别于普通正文(以便读者注意到交互性),这意味着阅读流程被打断,而我认为,回报很成问题。
此外,它们的修饰方式必须确保它们绝对不像链接,由于链接修饰没有标准化,这很难做到。abbr 很少使用,所以你不会首先想到修饰后的文本可能是 abbr。
我个人出于这些原因避免使用它们,并且不喜欢它们(作为通用工具)。(辩论:始终可以使用右键点击并“在 Google 上搜索”,对吧?)
如果我真的需要使用它们,我会确保它们没有样式,并使用一些脚本在标签内容后附加一个上标数字,并将该上标链接到文章下面的脚注(该脚注将包含一个返回链接)——就像纸质文本中的惯例一样。
有谁同意吗?
是的!ABBR 元素对于不使用辅助技术的人来说通常是不可访问的,有时对使用辅助技术的人来说也是不可访问的。由于 ABBR 元素似乎没有标准的可视化表示,因此它们不直观。
在页面中首次出现缩写之后,将缩写定义放在纯文本中就可以了。这在打印中也表现出色。
一些缩写比它们的扩展更容易理解,例如 DVD,扩展它们可能会损害理解,因此不应该为了扩展而扩展它们。
我基本同意你的观点。ABBR 通常的样式不直观,也不实用。此外,使用上标数字和脚注类型的界面是一种更好的实现。
这给了我一个想法。据我所知,我认为所有标准 ABBR 元素都可以使用自动递增的上标数字进行样式化,这些数字在悬停或点击时还会显示一个看起来像脚注的工具提示。
因此,只需使用一些 CSS,ABBR 元素就可以看起来像这样
RGB¹
然后,当你悬停在它上面或尝试点击数字时,就会看起来像这样
RGB¹
[1. 红绿蓝]
这样它就使用了熟悉的上标数字和脚注隐喻、标准 HTML 标记,而且不会让用户为了查看脚注而上下滚动页面。
如果你真的想在文档末尾包含所有缩写脚注,jQuery 脚本可以轻松地通过读取页面中的所有 ABBR 元素并在文档末尾插入一个脚注列表来生成它。
我不同意。我认为它们提供了巨大的价值,我一直鼓励使用它们。它们体现了 XML 的优势以及整个标记语言的概念。按照“很少有人注意到它们”的论点,一个好的网站上充满了动画 GIF 和背景 MIDI 音乐。
如果你愿意,可以对它们进行样式化,但正如 **shoutyman** 所说,如果用户不理解,他们会将鼠标悬停在缩写上。
你希望他们离开你的网站去 Google 搜索定义,还是让他们留在你的网站上?
我不明白体现 XML 的优势对你的用户有什么好处。你让人觉得你使用 ABBR 来标记缩写的理由是为了 XML 的利益,而不是为了用户的利益。
当我仔细想想,我意识到,如果我认为我的用户不会理解,我就会完全避免使用缩写。例如,在一个可访问性论坛上,我选择了“辅助技术”而不是“AT”,因为“AT”可能已经被理解了。
HTML 中有一些东西并不总是好主意,比如 TABINDEX 或 ACCESSKEY。仅仅因为它们存在,并不意味着应该尽可能地使用它们。
ABBR 元素在打印文档时就变得无用了。这就是为什么在可访问性指南中,ABBR 元素是最后建议的扩展缩写的技术(http://www.w3.org/TR/UNDERSTANDING-WCAG20/meaning-located.html)。
我喜欢 Kayan 的建议,它将成为让熟悉脚注的读者(可能不是年轻的读者)更容易理解 ABBR 元素的良好答案。它也可以在打印中保留。当我阅读使用脚注的文本时,有时会发现它们很分散注意力(如果你跟踪它们,它们会打乱流程)。但你根本不需要使用 ABBR 元素。
我曾经在一个网站上,该网站自动将几乎所有文章中的关键字都变成了链接,这很烦人。对每个缩写都做同样的事情会带来同样的风险。
Lee,你肯定可以在打印样式表中做类似的事情
我还没有测试过这种具体的实现,但它适用于链接的 href 属性。
Chris,是的,你可以,只要你不必支持 IE6,希望我只需要支持几年(对于大型公司来说,将定制应用程序迁移到更新的浏览器非常昂贵)。IE6 支持有点偏离主题,但这是我尚未在合法项目中使用 `:after` 和 `content` 的原因。
这确实解决了“转换为打印”问题,所以这将是一个很好的折衷方案。我认为这在屏幕上也很值得做,以解决可访问性和可用性问题。尽管使用 CSS 使扩展可见不如在纯文本中扩展它们那么稳健。
我的观点是,如果无法避免缩写,那么如果扩展有用,它应该始终可见,否则就不应该使用(例如 DVD)。
大家好,这是我过早发布的 WordPress 插件版本,欢迎提出任何拉取请求!
https://github.com/Markcial/Wordpress-Nerd-Terms-Explainer-Plugin
如何添加一个管理界面来编辑列表?
关于管理界面的问题是,它不会是一个简单的功能。
管理界面应该需要访问数据库才能维护新的首字母缩略词。
但这肯定不难实现。
(请原谅我的英语不好。我有点生疏了=)
你在文章中包含了一个不在列表中的缩写——REGEX。
当然,它不是首字母缩略词,但它是一个缩写,可能不是每个人都理解!
考虑到我们如今经常使用 API,这将是一个很好的补充。
KISSA - Keep it Simple Stupid Asshole
在编写插件时,请记住避免替换 HTML 标签属性内的任何内容。例如,如果链接(href 属性)包含“seo”一词,那么 abbr 可能会进入 href 中,从而破坏 HTML 语法。除非 Federico 发布的示例中的 `\b` 以某种方式解决了这个问题。
更多辩论:为什么不提供一个更实用且免维护的 Abbrs 替代方案,而是链接到相关的维基百科文章?
如果人们真的不知道“HTML”是什么意思,坦白地说,仅仅将其扩展成组成词对他们毫无帮助。解释 HTML 的维基百科文章会很有帮助。(而且这避免了尝试以用户理解的方式为 Abbrs 设置样式的繁琐工作。)
你可以在无需创建或管理任何内容(即 Abbrs 列表)的情况下完成此操作,因此它是免维护的。想要在文章中解释一个词吗?将其包裹在一个带类名的 span 中,使用 JQuery 插入一个指向维基百科搜索的链接或直接链接。你可以添加一个选项,让用户点击“停止链接这些词,我知道它们是什么”链接,以将其还原为纯文本。
另外,关于“DRY”的传统说法:s/principal/principle :)
不要误会我的意思,但看起来你真的不太关心用户。我们国家有一句谚语。“Nadie nace sabiendo”。(没有人天生就无所不知)。
HTML5 中的一些更改是为了符合 ARIA 指南。
因此,尝试完成这些任务,多花一些精力添加额外信息,而不用让用户离开去其他地方查找信息,这一点也不为过。
似乎这里的目标是尝试通过为用户提供比他们最初想要的东西更多的东西来吸引他们。
至少,这是我每次努力的目标。
IIS = Internet Information Services
CGI = Common Gateway Interface
MIME = Multipurpose Internet Mail Extensions
ISAPI = Internet Server Application Programming Interface
SMTP = Simple Mail Transfer Protocol
DHTML = 动态 HTML
XML = 可扩展标记语言
XSL = 可扩展样式表语言
XSLT = 可扩展样式表语言转换
我想我已经完成了,现在该回去工作了:)
“DHTML = 动态 HTML”
天哪!现在你需要扩展“HTML”了:)
有一个名为 Acronyms 的插件。我用了一段时间了,从未出错。插件网站的 URL 看起来很奇怪,但我在这里粘贴了代码:http://pastie.org/2730994
希望对你有帮助,Chris。
RTFM - Read The Fucking Manual
JFGI - Just Fucking Google It
将“fucking”替换为“freaking”。
在RTFM中,可以使用“fine”。
我的文本过滤器套件有一个“TFS Acronymit”部分,可以自动进行这样的替换。但它已经很老了,需要重写。:)
如果我能有一份缩略词列表,这样我就能理解我“发短信”的朋友了。
顺便说一句,PHP 实际上是“PHP: Hypertext Preprocessor”。它被称为递归缩略词。
抱歉这么挑剔。只是还没见过其他人提过。:P
历史上的一个点——PHP 诞生初期,代表的是“Personal Home Pages”。它在 3.0 版本发布时改为了递归的“PHP Hypertext Processor”。
是的,所以从技术上来说,PHP 代表的是“Personal Home Page: Hypertext Processor” :D
REST – Representational State Transfer
我会添加
URL – Uniform Resource Locator
URI – Uniform Resource Indicator
当然,列表中必须有 RTFM :) 它是最好的缩略词,如果说有的话。
IA
UCD
IxD
并非所有缩略词都是首字母缩略词,因此我使用
class="initialism"
来挑选那些 100% 大写的词语。例如,FedEx 并不是首字母缩略词,但它是一个缩略词。我为首字母缩略词增加了字母间距并减小了字体大小,这种处理对于 FedEx 示例是不合适的。
吹毛求疵。
抱歉重复了,但可能有些人错过了中间的评论。
Joel Pan 的 Acronyms 插件不再维护,也不支持 HTML5。一个更新的分支,它可以自动检测您的主题的 DOCTYPE(并由我本人积极维护),可以在这里找到这里。
PHP 中的第一个 P 不应该是 PHP 吗?荒谬,我喜欢把它理解为 powerful
我得了 98 分,耶!我统治一切!
XHR = XMLHttpRequest: https://secure.wikimedia.org/wikipedia/en/wiki/XMLHttpRequest
IaaS = Infrastructure as a service
JSON = JavaScript Object Notation
XLST = Extensible Stylesheet Language Transformations
哎呀,我拼错了我的姓。是 Stok,不是 Stpl。
大家好-
对于任何 TextExpander 用户,我制作了一个 TE 组,它会自动输出这些。感谢 Chris 提供的精彩列表。
TE 组可以在我的网站上下载。
希望你们中有些人觉得它有用!
如何将它做成GIST?
去做吧。
HCI: Human Computer Interaction
当然,缩略词和首字母缩略词在网页可访问性方面发挥着重要作用。
我知道你可能会厌倦一直编码它们。
但缩略词的问题在于,它们在用户代理中不可键盘聚焦,因此工具提示不会显示给仅使用键盘导航的人。
因此,如果你计划构建一个插件来完成这项工作,请尝试构建一个插件,以这种方式在页面本身的文本中解释该术语的首次出现,例如
css-tricks 是关于层叠样式表 (css) 的一切。
请原谅我的英语
GNU = GNU’s Not Unix
RFTM 绝对是我的最爱
缺少针对 IE 的 WYSIWTF ;)
HLL (高级语言)
LLL (低级语言)
*******
PDF (便携式文档格式)
不太明白在 HTML 中使用这些代码有什么用处……使用完整形式编码比用简单的括号写好吗?
如果我们可以简单地写——“Intel (英特尔)”——,为什么还要用那么长的代码呢?
HTML 中有很多很烂的标签,比如 definition-list-tags 等等。
同一个 HTML 还提供了一些扩展功能,比如根据网站颜色更改浏览器按钮颜色(在 HTML5 中)。
它是一种双向语言……
我们应该把它归类为高级语言、面向对象语言,还是其他什么?