页面设计的方法(首页,先页面程序时可取)
2005-12-22 00:03
330 查看
今天看了一个叫“彬”什么的人的论坛,还有代码下载,可惜现在找不到地址了。说实话,美工很不错的,不过仔细分析内容,用到的技术就很有限了。因此我想到了很多朋友对写网站类程序的界面代码存在着很大的知识“鸿沟”,没有接触实战的技术。这里我说一个最基本的设计页面的方法。
通常人们是从那些快餐式的编程书籍上学习编写页面的,也就是在页面上写一两行文字、放上一个控件看看效果,最多不过是多放几个这种干巴巴的东西堆在一起。这与实际的网站界面相差太远了,就好像在一个只有几把锤子扳子的小作坊中学习造汽车,不能做出好产品。
实际上,好的页面应该用以下方法开发出来:
1. 各类相关人员深刻了解需求。
2. 美工作出精美的、有创意的(主要是静态)画面。可能结果仅是一张bmp图片。所谓“漂亮”的网页,要照顾到用户对颜色、风格的要求,并且往往搞“大块”的图像,同时又有大块的空余,这样的反差造成视觉冲击。
3. 关键的一步——切图。切得好(既少又准确)才能为编程创造条件。常用的网页图像编辑工具都有切片功能。切片之后就生成了html(中间包含了很多<table>)和一大堆图片,图片通常作为table中<td>的内容或者背景。
4. 改文件名后缀,然后在编程开发工具中打开这个html页面。可以看到原图。但是从代码或者大纲窗口可以看到已经很“破碎”了。保留<table>布局和大部分图片,选取需要根据数据库动态发布内容的<td>元素,把它里边的东西“删除”,然后放上spaceholder或者其他控件或者其他自定义控件(例如自定义的文章显示控件)。
5. 接下来就是写一点代码让页面接受外界参数,根据这个参数指挥内部的控件显示内容。
可见,页面是“先搭架子”然后再填入少量代码,时间花费基本上是1:1的(根据项目情况不同会不同)。绝不是从一个空白的aspx开头去手工拼凑html代码。前期的美工设计很重要。而且,也不应该刻意去找“会编代码”的美工。
csdn这个页面,如果不是asp的,如果是aspx的,那么可以说太没有创意了。asp的结构化不好,因此写出这么“土气”的页面情有可原。
明白了这个道理,大概就明白当时间实在太紧的时候很多“高手”怎么“设计”网站了吧!
对,就是到互联网上找到一些风格符合的网页,然后偷下来把其中的TD内容“抠掉”换上自己的内容。
网站设计,是从高处着眼,从内容管理、对业务的对象和流程的理解、各种业务的工作“引擎”的设计和开发入手的。把一本“ASP.NET高级编程”之类书反复看明白了,可能还很不够。
至于Web方式的管理应用程序,则反而不应该在页面上放上大块的图片和留白,甚至连小小的LOGO也没必要每个页面都放一个,以免干扰用户的操作。仅用大块的背景颜色分出操作区块来就很不错了。并且这类页面需要额外增加一些灵活的、仿窗口的风格,需要程序员自己开发一些与窗口控件功能相当或者更强的自定义控件。同时几乎所有界面应该都应该从数据库或者类型定义中自动生成,而不需要RAD工具。
通常人们是从那些快餐式的编程书籍上学习编写页面的,也就是在页面上写一两行文字、放上一个控件看看效果,最多不过是多放几个这种干巴巴的东西堆在一起。这与实际的网站界面相差太远了,就好像在一个只有几把锤子扳子的小作坊中学习造汽车,不能做出好产品。
实际上,好的页面应该用以下方法开发出来:
1. 各类相关人员深刻了解需求。
2. 美工作出精美的、有创意的(主要是静态)画面。可能结果仅是一张bmp图片。所谓“漂亮”的网页,要照顾到用户对颜色、风格的要求,并且往往搞“大块”的图像,同时又有大块的空余,这样的反差造成视觉冲击。
3. 关键的一步——切图。切得好(既少又准确)才能为编程创造条件。常用的网页图像编辑工具都有切片功能。切片之后就生成了html(中间包含了很多<table>)和一大堆图片,图片通常作为table中<td>的内容或者背景。
4. 改文件名后缀,然后在编程开发工具中打开这个html页面。可以看到原图。但是从代码或者大纲窗口可以看到已经很“破碎”了。保留<table>布局和大部分图片,选取需要根据数据库动态发布内容的<td>元素,把它里边的东西“删除”,然后放上spaceholder或者其他控件或者其他自定义控件(例如自定义的文章显示控件)。
5. 接下来就是写一点代码让页面接受外界参数,根据这个参数指挥内部的控件显示内容。
可见,页面是“先搭架子”然后再填入少量代码,时间花费基本上是1:1的(根据项目情况不同会不同)。绝不是从一个空白的aspx开头去手工拼凑html代码。前期的美工设计很重要。而且,也不应该刻意去找“会编代码”的美工。
csdn这个页面,如果不是asp的,如果是aspx的,那么可以说太没有创意了。asp的结构化不好,因此写出这么“土气”的页面情有可原。
明白了这个道理,大概就明白当时间实在太紧的时候很多“高手”怎么“设计”网站了吧!
对,就是到互联网上找到一些风格符合的网页,然后偷下来把其中的TD内容“抠掉”换上自己的内容。
网站设计,是从高处着眼,从内容管理、对业务的对象和流程的理解、各种业务的工作“引擎”的设计和开发入手的。把一本“ASP.NET高级编程”之类书反复看明白了,可能还很不够。
至于Web方式的管理应用程序,则反而不应该在页面上放上大块的图片和留白,甚至连小小的LOGO也没必要每个页面都放一个,以免干扰用户的操作。仅用大块的背景颜色分出操作区块来就很不错了。并且这类页面需要额外增加一些灵活的、仿窗口的风格,需要程序员自己开发一些与窗口控件功能相当或者更强的自定义控件。同时几乎所有界面应该都应该从数据库或者类型定义中自动生成,而不需要RAD工具。
相关文章推荐
- 微信小程序 跳转页面的两种方法详解
- 一种基于自定义代码的asp.net网站首页根据IP自动跳转指定页面的方法!
- Flex程序与包装页面(wrapper)通信方法小结
- ASP.Net Core 2.0 + Angular5 SPA程序刷新后找不到页面解决方法
- PHP小偷程序的设计与实现方法详解
- Flex程序与包装页面(wrapper)通信方法小结
- 设计高模块化C程序的方法
- 程序设计中的函数(方法)的生命周期
- ios或mac程序中添加链接到评价页面的方法
- 打开页面win7会自动下载某些程序软件的禁止方法
- Web设计中打开新页面或页面跳转的方法 js跳转页面
- 003---设计首页index页面
- Web实用页面设计方法
- 自适应页面设计方法
- 微信小程序页面跳转功能之从列表的item项跳转到下一个页面的方法
- Java+Selenium3框架设计篇2-Selenium方法的二次封装和页面基类
- 从web页面启动winform程序的实现方法
- 使用jquery的load方法设计动态加载,并解决被加载页面JavaScript失效问题
- 用PHP程序实现支持页面后退的两种方法
- js页面(页面上无服务端控件,且页面不刷新)实现请求一般处理程序下载文件方法