1.表现与数据分开管理:

某些数据具备特殊的表现格式,比如颜色,大小等等。为了对这些格式表现分开管理进行

  a.使用css定义该类型数据的表现形式: 定义数据的类别,通过该类别对数据格式进行统一定义

.类别名 {
}

  b.对于某些数据,比如说金钱需要在前面加上一个$符号的,使用js统一对所有该类别的数据进行特别设置。这样在显示该数据时候,只需要设置为类别,就可以显示特别形式。

$(".类别名").each( ....) 

  c.如果在别人定义的基础上进行修改,需要注意加上别人定义类别的前缀,这样的话不会对无关者改变。不能让所有人对基本类别都可以肆意修改,修改权限越低,则前面限定的类别应该越多,否则造成混乱。

.类别名  .类别名1{
}

  d.数据表现元数据的定义应该统一在数据库单一源查询得到,如果随意在代码中定义表现的规则,那么后期维护也会非常麻烦。所谓元数据:即数据库中存放数据 <-> 网页上表现数据;他们并不一定一致,这种转换的规则必须统一源来定义。比如采取语言国际化标准,可以使用django的国际化,或者js的国际化。再例如一些数据的元数据,比如说类型,国家等等。在使用这些元数据的时候需要统一接口进行使用,而非各自在各自模块中定义一套。

2.所谓的元数据

  a.数据的展现格式类别: 例如 css 样式

  b.在数据库中具体表格数据,对应的数据意义。

    我们获取的REST的数据可能并非界面有好的,如果这个从非界面有好到界面友好之间需要转换,那么应该有个统一的转换层。为什么要统一,防止每个子模块对数据自定义解释,这样后期就难以维护。转换层可以在服务端,也可以    在客户端使用js

  c.

关于web界面设计的整体可维护性的感悟的更多相关文章

  1. Web界面设计(Designing Web Interfaces中文版) (美)斯科特 pdf扫描版​

    Web界面设计是由Bill Scott编著.电子工业出版社出版的一部图书,在Web已经进入崭新的时代的今天,界面的设计显得非常重要,本书就是基于独一无二的Web环境下.在创建丰富体验的过程中设计Web ...

  2. web界面设计

    本书描述了6个设计原理,即直截了当.简化交互.足不出户.提供邀请.使用变换.即时反应. 一.直截了当(alan cooper:"在哪里输出,就要允许在哪里输入") 1.1 行内编辑 ...

  3. web 界面设计---js设置txt值

    <head><meta http-equiv="Content-Type" content="text/html; charset=gb2312&quo ...

  4. web 界面设计---js提交表单

    <script type="text/javascript"> function checkImage(){ var imageValue = document.get ...

  5. web 界面设计---大道至简

    http://www.cnblogs.com/coder2012/p/4023442.html 一个非常精简的webpy页面博客 qing.weibo.com 新浪的轻微博也不错精简

  6. 对WEB前端的几段思考(一)——界面设计和性能优化(整理中)

    尽管我并非艺术出生,既没有任何设计基础,又没有较高艺术涵养,也深谙在短时间内创造一定艺术造诣并非易事,但是既然当初选择从事网站前端开发,我的目光不能仅停留在前端代码上.作为一名志向在前端领域发展的人员 ...

  7. 免费素材:25套免费的 Web UI 设计的界面元素(转)

    Web 元素是任何网站相关项目都需要的,质量和良好设计的元素对于设计师来说就像宝贝一样.如果您正在为您的网站,博客,Web 应用程序或移动应用程序寻找完美设计的网页元素,那么下面这个列表会是你需要的. ...

  8. 表格布局扩展/DW设计界面中快速整体布局页面的操作

    DW设计界面中快速整体布局页面的操作流程: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" &q ...

  9. 必胜宅急送Web app设计背后的思考

    O2O模式是餐饮业在移动消费趋势下主动拥抱互联网的方向,迎合餐饮消费者从以往经验判断为主转变为依靠移动设备.lbs.社交网络进行立体决策的过程.继App客户端之后,手机web app也逐渐成为O2O中 ...

随机推荐

  1. 第二话:javascript中闭包的理解

    闭包是什么? 通过闭包,子函数得以访问父函数的上下文环境,即使父函数已经结束执行. OK,我来简单叙述下,先上图. 都知道函数是javascript整个世界,对象是函数,方法是函数,并且js中实质性的 ...

  2. cacti监控mssql 2005运行资源情况

    概述:SQL Server2000\2005\2008本身不支持snmp,使用cacti监控mssql,必须通过php连接mssql来获取SQL 2005性能计算器的值. 操作步骤: 1.php连接m ...

  3. 1.在VC编译器下面为什么每个头文件以及源文件都要包含“stdAfx.h”,那么stdAfx.h中到底存放了什么,用来做什么?

    我们知道在windows平台下面很多的文件后缀名中都含有Afx,其实Afx是微软公司的一个技术研发团队名称,vc下的“stdAfx.h”和“stdAfx.cpp”文件就是有他们所研发出来的,为什么要这 ...

  4. code1540 银河英雄传说

    pa[i]代表i的father pre[i]代表i之前有多少个 sum[i]代表i所在的整列有多少个 cc为命令类型,x y为命令参数, fx fy分别为x y的father 当cc==‘M’时,合并 ...

  5. Siverlight MarkerSize 控制数据点半径大小 LineThickness 控制点与点之间直线的厚度

    using System;using System.Collections.Generic;using System.Linq;using System.Web;using System.Web.UI ...

  6. CentOS7.4配置SSH登录密码与密钥身份验证踩坑

    简单记录,自用CentOS7.4虚拟机与ALiYunVPS,在配置ssh登录身份验证时碰到的问题. 阿里云VPS:因为在重置磁盘时选择了密钥对的身份验证方式,因此VPS中的CentOS7.4中的 /e ...

  7. 白盒测试实践-任务进度-Day05

    所使用静态代码检查工具 阿里巴巴Java开发代码检测IDE插件 小组成员 华同学.郭同学.覃同学.刘同学.穆同学.沈同学 任务进度 任务已经进入收官阶段,为了对大家各自任务完成情况进行确认,保证任务能 ...

  8. Android动态加载--JVM 类加载机制

    动态加载,本质上是通过JVM类加载机制将插件模块加载到宿主apk中,并通过android的相关运行机制,实现插件apk的运行.因此熟悉JVM类加载的机制非常重要. 类加载机制:虚拟机把描述类的数据从C ...

  9. C#通过Redis实现分布式锁

    Redis有三个最基本属性来保证分布式锁的有效实现: 安全性: 互斥,在任何时候,只有一个客户端能持有锁. 活跃性A:没有死锁,即使客户端在持有锁的时候崩溃,最后也会有其他客户端能获得锁,超时机制. ...

  10. 编写高质量代码改善C#程序的157个建议——建议90:不要为抽象类提供公开的构造方法

    建议90:不要为抽象类提供公开的构造方法 首先,抽象类可以有构造方法.即使没有为抽象类指定构造方法,编译器也会为我们生成一个默认的protected的构造方法.下面是一个标准的最简单的抽象类: abs ...