HTML / CSS设计用于平凡的文本内容

发布时间：2020-12-14 18:51:58 所属栏目：资源来源：网络整理

导读：我的任务是更新一系列促进科学会议的网站,以迎合利基科学领域.这些网站目前使用一些适用于共享公共页面模板结构的CSS布局编写,但每个页面的详细信息都是 p, br和 nbsp;的混搭.定位内容.这使得更新内容变得困难,因为间距总是在变化,并且页面在最轻微的模式下

我的任务是更新一系列促进科学会议的网站,以迎合利基科学领域.这些网站目前使用一些适用于共享公共页面模板结构的CSS布局编写,但每个页面的详细信息都是< p>,< br>和& nbsp;的混搭.定位内容.这使得更新内容变得困难,因为间距总是在变化,并且页面在最轻微的模式下最终变得难看.

所以,我想把这些东西改成一个更加快乐的CSS状态.有很多网站提供特定CSS设计目标的提示,但我是一个没有很多网站艺术能力的开发人员,并且没有考虑过结构.是否有任何好的网站在一些相对平凡但有效呈现的业务内容的背景下教CSS？像CSS zen花园这样的东西很酷,但是我正在寻找更多可以给我一些简单的文本繁重的商业数据定位想法并将这些想法作为CSS学习机会展示的东西.

有这样的网站吗？

解决方法

遗憾的是,如果您对 HTML没有太多控制权,那么很难从CSS中获得可靠,一致的演示.如果您无法向元素添加特殊类/ ID,则尤其如此.并且< br />标签,不断使用,将对任何标准化布局的尝试造成严重破坏.

如果您仅限于提供的HTML,那么您的首要目标应该是尽可能让它变得可读.确保字体足够大,以便人们可以舒适地阅读它靠在椅子上.或者站在别人的肩膀上.它不需要太大,但如果它像你声称的那么重,那么传统的12pt可能会觉得太小而无法阅读.

使用哪种字体是另一个考虑因素. Verdana比Arial宽,所以它占用更多的水平空间,但往往更容易在眼睛上.其他人倾向于喜欢像格鲁吉亚这样的衬线字体,它可以在较大尺寸下保持良好状态.

垂直间距很重要.确保在页面区域之间包含大量的视觉分隔符.您可以通过明显且一致的子标题样式实现此目的.还要确保每行之间的行高足够宽 – 人们不喜欢阅读文本的“砖块”.

不要忘记水平空间.一般的经验法则是,一列文本的每行可能不应超过60-70个字符,否则读取会变得更加困难.

请记住,人们会来到您的网站获取信息,他们可以更快地访问并获得更快乐的信息.视觉眼睛糖果很好,但您的首要任务应该始终是使网站尽可能易于使用和清晰.

至于灵感,我在Information Architects时非常喜欢文本设计.你可能也想看看Subtraction.com.博客可能是一个很好的灵感来源,因为它们通常非常重.

祝好运.

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!