Question

我们正在与外部顾问签约，为我们目前正在开展的新项目的大多数主要页面生成XHTML（Transitional）和CSS。

我被要求为他们整理一份指南清单，以便我们确信可以预期一定程度的质量。作为一些技术背景，我们将把它们提供的原始HTML加入到ASP.NET Web表单应用程序中（利用通常的母版页/外部样式表/ jquery）。 Javascript不应该是一个考虑因素，但CSS的格式和组织应该是。

我已经开始了，但很快意识到这可能不是一个独特的情况，并且一个经过试验和测试的列表可能会出现在我可以至少用作模板的地方！有没有人有这方面的经验？

Answer 1

从技术角度来看，页面必须pass validation可能是我的第一次测试。

我希望该网站能够被禁用JavaScript的人使用，并且有人使用屏幕阅读器（这是一个非常好的网站，因为它应该突出显示使用不当的表和其他事情，如丢失图像alt标签，标头标签的不一致使用等。）。

Answer 2

我总是为自己做的一个很好的测试是打开页面并按Ctrl +滚动。缩放使您可以立即了解设计的灵活性和流动性。

在IE中，无论如何都会失败，但在那里你也可以尝试让字体更大，看看会发生什么（例如注意垂直拉伸的按钮）

Answer 3

向他们提供您希望他们支持的浏览器列表（浏览器版本和操作系统）。

是否应遵守可访问性指南？您可以同意支持Checklist for Web Content Accessibility Guidelines中的一些要点。该列表实际上非常有用，因为它不仅可以确保您的网站适用于残疾人，也适用于没有JavaScript，CSS，图像的浏览器。该清单还包含一些建立合理网站的一般良好做法。

由于您使用的是ASP.NET，因此请确保每个网页只包含一个<form>。或者至少，准备好做一些变通方法，如果你允许他们使用更多。

如果您计划使用AJAX，请向他们展示ASP.NET AJAX Control Toolkit，以便他们不会花时间处理已经构建的内容。

我坚持要求他们使用一些经过验证的框架，例如YUI css reset和jQuery。

Answer 4

在多个前端开发人员之间传递HTML / CSS模板的一件事是正确的结构化和缩进标记。书籍被分解为卷，章节，段落，句子，单词，空格和句点的方式相同，有一种层次结构使HTML和CSS易于阅读（另一方面，一种编码方式使得事物变得简单完全混乱）

根据经验：

     <body>
          <div id="first">
               <p>
                    Some text goes in here...
               <p>

               <ul>
                    <li>A list item</li>
                    <li>A list item</li>
                    <li>A list item</li>
                    <li>
                         <ul>
                             <li>
                                  <a href="#">A link</a>
                             </li>
                         </ul>
                    </li>
               </ul>
          </div> <!-- #first ends -->
     </body>

这种对结构的坚持可以通过使扫描代码对于正在处理它的人来说非常容易 - 无论是否写入，都能真正减少时间。

Answer 5

除了验证之外，还应记住以下几点 - 无障碍（谁是观众） - 基于CSS的设计（语义设计精良） - 符合您的命名约定（css和id命名。从长远来看，当需要进行任何更改，必须应用新的css等时，这将是有益的。）

从yahoo开发者库中查看以下最佳实践... http://developer.yahoo.com/performance/rules.html

此外，由于您在使用ASP.net时要小心命名usercontrols，因为生成的客户端ID可能非常长且意外（asp.net在运行时生成id）;

可以找到一些好消息 http://woork.blogspot.com/2008/11/useful-guidelines-to-improve-css-coding.html

Answer 6

确实，请确保页面通过验证。

另外注意语义，当禁用CSS时页面应该是逻辑顺序（某些浏览器和屏幕阅读器就是这种情况）。确保标题实际上是＆lt; h＃＆gt;标签和所有图像都有适当的alt标签。还要确保表仅用于显示信息，不用于格式化。菜单应该构造为列表而不是div（语义）。

HTML＆amp; CSS编码指南

6 个答案: