Question

设计一个适合所有人的网站是一门真正的艺术，而Progressive Enhancement对我来说几乎是一句口头禅......

所以我想知道，无论浏览器，操作系统，javascript，flash，屏幕分辨率，禁用用户可访问性如何，您使用哪些最佳技巧来使网站适用于所有人等？

（我知道很多关于javascript和浏览器的技巧，但会承认对flash等无能为力。）

编辑：我并没有真正谈论1％的RIA网站，如果没有javascript或flash，它们就无法正常运行。我不是问如何在没有js的情况下编写Google Docs。我想知道人们为可以做什么很酷的网站所做的事情，但实际上并不需要。

我会提供一些自己的答案......

Answer 1

我尽量避免使用咒语，除了世界是一个混乱的地方的口头禅。

我认为很多桌面功能将被网络功能所取代，而且这将是一个棘手的过渡，最终会在浏览器中找到真正的应用程序。真正的应用程序意味着JavaScript或Flash或Silverlight，或Java或C＃或Objective-J编译成JavaScript。

对我而言，唯一的诀窍是识别无法有效使用应用并为其提供替代内容的人和浏览器。

这包括检测移动设备并提供适当的内容。有许多网站在iPhone上崩溃，因为它们非常重，并且依赖于宽大的计算机显示器。

我不认为对网站这个网站要求JavaScript是可以的，但我认为对于一个应用程序的网站来说是可以的。我不认为只提供960px宽的页面是可以的。我不认为只提供Flash格式的视频是可以的。

Answer 2

检查您的统计信息（如果您没有统计信息，请安装Google Analytics）并确定用户的去向以及他们实际在做什么。

e.g。

1。）您的用户是否经常使用搜索，因为他们无法找到某些内容？如果是这样，也许你可以让搜索工作更好？

2。）您的404页面是否提供了一些快速选项来搜索相关术语或尝试“猜测”他们正在寻找的内容？

3.。）您的网站是否有站点地图，可以快速访问您网站的有意义部分？

4.如果所有其他方法都失败了，用户是否有简单的方法与您联系/技术支持以帮助他们找到所需内容？

5.。）不确定你是否在你的网站上“出售”了什么东西，但是当你到达任何一个主要的砖头零售商的结账时......他们会问你是否找到了你今天要找的东西。考虑提供一个用户可以提出建议的选项...也许你有一个未被挖掘的市场等待被征服。

6。）关于可用性，请务必在IE（6,7,8），Safari等网站上浏览您的网站，并确保它可以在您关心的任何地方使用。

7。）有一本名为“Don't make me think”的好书，它是真实可用性的重要资源。如果你还没有读过它......去抓一份。

此外，确保所有其他小事都得到妥善处理......例如你很好地利用了缓存（JS，CSS，Images）

Answer 3

我用来处理基于ajax的网站的一些巧妙的技巧：

1）使用普通的标签写出整个页面和所有链接，这些标签将在禁用javascript的情况下转到右侧页面，然后基于“rel = external”之类的内容“hijax”。

2）添加带有替代内容的noscript标签，否则javascript会插入动态内容。

3）使用javascript隐藏javascript将在DOM加载时控制的元素，而不是将它们隐藏在样式表中，稍后使用javascript显示它们，因为如果javascript已经转换，用户将永远不会看到它们关闭。

Answer 4

通常我所做的就是在没有任何javascript的情况下编写整个网站。一旦此功能正常，您就可以“标记”。

也就是说，有一些很好的起点：

The PRG pattern通常对良好的可访问性至关重要。

您希望确保HTML开头附近有启用跳转链接的菜单。如果您不确定，请尝试在链接或类似文本或基于语音的浏览器下运行您的网站。如果您感到恼火，那么您的可访问用户也会感到恼火。

确保仅在图像有意义时才对图像应用alt标记。当它仅用于设计目的时，给图像alt =“”是合法的。同样，设置title =“”将满足您的Firefox用户对悬停工具提示的需求，而不会让您的可访问用户烦恼。

希望这些简单的提示有所帮助！无障碍是每个人的责任！

Answer 5

尝试在使用难以访问的插件或其他内容时提供后备内容。例如，将视频放在页面上。如果你采用HTML5方式：

<video>
    <source src="video.ogv" type="video/ogg" /><!-- OGG for Mozilla/Opera -->
    <source src="video.mp4" type="video/mp4" /><!-- h.264 for Apple/Google -->
    <object><!-- Fall back to Flash/h.264 for older browsers -->
            <!-- And in the event the UA can't handle any of those, all you can do is provide a link to the media -->
            <p><a href="video.ogv">Download the video</a>.</p>
    </object>
</video>

[伪代码，但你明白了]

有关该特定问题的更全面的解决方案，请查看Kroc Camen的Video for everybody。

Answer 6

渐进式增强并不复杂。

考虑三个主要问题：

内容（HTML）
演示文稿（CSS）
行为（JS）

您从内容开始，逐步解决问题，确保每个新问题都不会妨碍前一个问题或尝试模仿另一个问题; JavaScript不应该生成内容; CSS不应该处理行为; HTML不应该处理演示文稿等等。

Answer 7

好的，当涉及到网站类型的应用程序时，最好的是，始终以RESTful方式支持多种格式... HTML，XML，JSON，RSS，Atom（其中）它是有道理的）为什么不是其他人......为此，你需要在服务器上使用一个干净的MVC架构......好吧，它不需要是MVC，但是，比方说，渲染层应该像面包一样愚蠢，并且在下面运行良好编写的业务逻辑...您的前端控制器应该选择正确的格式以响应请求返回并且您去...您的整个业务逻辑来检索/更新数据，进行分页等等一次，然后你只需将其渲染成HTML模板，或将其转换为JSON，或做任何事......

现在一个想法是，制作一个视图实现，将返回坚如磐石，语义和纯HTML ...并制作一个，它将大量使用javascript ...使它们可以在不同的路径下访问，并且使javascript不可抓取...在你的主HTML模板的开头放一行javascript，这将导致重定向到该网站的javascript版本......你也可以为flash做同样的事情......然后，在应用程序的“脏”版本中，你可以做任何事情，你喜欢......每个HTTP加载模板，然后是JSON中的数据，并在客户端上进行渲染，创建一个持久的有状态客户端javascript应用程序......为什么不呢？

我个人认为，它比用漂亮而清晰的HTML开始，而不是填充大量的javascript，甚至不适用于所有用户......

格尔茨

back2dos

渐进增强技巧

7 个答案: