为什么alt属性在Firefox中显示为瞬间？

Question

我正在使用课程管理系统Moodle，在管理员中，文件夹树（使用文件夹图标）显示大约一秒钟给出的alt属性（在本例中为“打开文件夹”）然后它隐藏并显示图像当图像准备好时。

系统有点慢，所以我认为Firefox最初认为图像不存在。

这是一个问题，因为在那一瞬间，布局会延伸到适合更广泛的单词，使我看起来看起来不专业。

有没有办法可以隐藏此标记而无需移除alt标记？ （这可能是劳动密集型的）可能使用JQUERY或CSS。

Answer 1

  

显示大约一秒钟给出的alt属性（在本例中为“打开文件夹”），然后它隐藏并在图像准备好时显示图像。

是的，这就是alt文本的用途：它为图像不可用时提供了一个文本替代方案 - 无论是因为出现错误，还是在浏览器设置中关闭了图像，或者在这种情况下，文件尚未到达。

替代文字真的是你想要的吗？除非有问题的图像实际上包含“打开文件夹”字样，否则以上是不合适的替代文字。如果我们谈论打开树的那些小加/减图标之一，则更好的替代文字将是“+”。 “打开文件夹”，作为图像的作用的描述（与包含的内容相对），将更好地应用于用于工具提示的“标题”属性。

请注意，如果您使用Quirks模式并且图像具有指定的固定大小，则Firefox将使用“已损坏的图像”图标，其中alt文本重叠并在内部裁剪，而不是单独的纯文本。这是为了匹配IE的旧行为。但是你真的不想使用Quirks模式，并且在固定大小较小的常见情况下，裁剪会使alt文本变得无法读取和无用。

  

这是一个问题，因为在那一瞬间，布局会延伸到适合更广泛的单词，使我看起来看起来不专业。

我建议：克服它。这就是网络滚动的方式，任何页面在逐渐渲染时都可以移动一下。对于图像，您应该只看到它发生一次，然后图像将被缓存并立即显示。如果没有，则缓存设置有问题。

根据您所讨论的布局类型，您可以修复此问题，以便不响应不断变化的图像尺寸。例如，如果使用表格，在表格上设置“table-layout：fixed”，在顶行的图像单元格中设置“width :( some number of）px”，即使内部文本较小，也会使其保持该宽度。可能会导致替代文字进入下一个单元格，但是请注意。

Answer 2

如果图像是布局的一部分，我建议将它们移动到CSS。您还应尽可能optimize您的图片，无论他们是CSS还是其他。您也可以将JavaScript文件尽可能地移动到页面底部block parallel downloads。一般来说，应用很多技术here可能会有所帮助。

Answer 3

如果图像必须是一定的宽度，请给它们一个明确的宽度。