使用无图像按钮有什么好处?

时间:2009-02-12 01:59:26

标签: html css image

this answer对问题“How can I use Google's new imageless button?”的讨论提出了这个问题。

谷歌似乎认为无形无味是出于某种原因,但从引用的评论来看,我没有看到优势。是否值得发送几十行HTML并知道有多少CSS来渲染这些无图像按钮,而不是简单地加载另一个图像,特别是当CSS sprites等技术可用时?

这种技术什么时候首选?另一个问题是如何做到这一点,但我想知道为什么应该完成。

4 个答案:

答案 0 :(得分:14)

  1. 本地化(翻译文本比图像更容易)
  2. 皮肤/主题化(使用单个CSS更改外观比重新创建多个图像更容易)
  3. 辅助功能(屏幕阅读器可以正常阅读,文本缩放功能正常)
  4. 性能(CSS是共享的,因此从服务器加载一次)
  5. 功能性(当您不必更改整个图片时,使用新的UX元素(如下拉箭头)扩展按钮更容易)
  6. 顺便说一句,“无图像”按钮也可能包含可视模板内的图像。这种方法与XAML模拟可视树的方法非常相似。

答案 1 :(得分:5)

我认为在这种特定情况下,我只能看到按钮可以以编程方式生成的优点。如果你不知道你的按钮会说什么,那么使用某种图像库生成器生成它可能很容易。

同时更改一个CSS可以让您一次更改所有按钮的外观。使用图像按钮,您需要更新每个人和每个图像。

答案 2 :(得分:3)

这不是因为按钮的高度可能会有所不同(例如文字大小)吗?

答案 3 :(得分:3)

  1. 页面加载更顺畅,因为不需要加载图像,并且会比其余图像晚出现

  2. 如果某人无法阅读/查看图片,那么按钮文字也是可读的,但您有图形外观。 (使用传统方式围绕真实文本构建带图像的图形按钮与此方法一样复杂的HTML)

  3. 正如他们在博客中提到的,这些按钮可以在不创建和存储自定义图像的情况下进行换肤。

  4. 基本上,您可以获得纯文本按钮相对于自定义成像的所有优势,同时仍具有漂亮的可换肤图形外观。