网页设计心得:高效编写网页代码

本来这第七章应该是针对设计中的层次、空间的技法及深层次的探讨。但今天暖暖跟我哭诉她事情总是处理不完。加上今年3·4月份公司的一大堆生意的顺利完成。以及那时候总结出的一些经验。觉得效率这个问题还是很有必要跟大家分享分享的。时间仓促,分类不明确,还请见谅!

本文从三个方面着手,一个是企业网站的建设(教育政府类也归纳到企业站点里),二是小型门户站点的建设,三呢,我把平面广告设计也顺带提一点。主要还是网站。

其实企业站点的工作量并不大,相信很多有经验的同仁能够把普通企业站可能用到的栏目一口报出来。在这里我们换个角度来看待这些工作。从页面的内容构成上来针对他们进行分类:

一:首页。
这里的设计含量是最高的。工作也是最繁复的。暂且不谈设计。从ps版到html,到最后的整站。往往修改最多的就是首页了。在这里我要强调的是,从首页开始,注意使用包含文件

二:分页。
分页有几类呢?在我看来,无非是list和view,列表页和阅读页。list一般是新闻列表,或图片列表。而view,则完全只需要一个!

所以,在构建一个普通的企业站的时候,上述三个页面完成了,工作基本已经完成1/3了。还有程序,以及内容录入。

纯动态的站点。内容录入很简单。但如果是有着大量静态页的站点,比如教育类和政府类的站点。当然,也有相当一部分原因是从公司角度或程序员角度来考虑,将简介之类的很长时间才更新一次的页面做成静态的。另外一种情况则是内容内包含大量的图片、特殊符号、公式、表格等。哪怕是再强的编辑器编辑起来也很麻烦。使用dw效率可能会更高。到这里,我的经验才真正的表述出来。
    先说一下大量的文字录入,先定义好你的P,记得缩进2em,因为很多人很注意这一点。也必须注意到这一点。相信大家都开着qq,大量的文字,无论是从word还是记事本,直接copy,贴到qq对话框里再复制一次,去除多余的东西,然后到dw的代码状态。记住,是代码状态粘贴。这个时候,代码状态依然保留了原有的段落,而预览则是不分段的,这个时候,你的P,就开始大显神威了。开始的地方<p>,结尾的地方</p>,中间的段落则复制"<p></p>"直接粘贴.不需要你再去按回车,也不需要按着ALT+SHIFT+空格了!!!
  说表格,在编辑器里插表格,效率总没在DW里高吧.好,那就在DW里画表格,然后复制代码,到编辑器的代码状态去粘贴.效果那是一个好啊....
  说复杂的内容,有表格有特殊符号有公式有大量的文字有表格还有图片.而且相当的长.怎么办呢?我向你推荐一个小软件,叫FLASHPAPER,它可以直接在word内,将所有的内容转换成一个带滚动条的swf文件.相当多的情况下,体积比你在dw里一点一点编辑出来的html还要小.
    其实要说的是,代码状态操作,很多时候效率是最高的!
  如果客户提供给你的内容,不全,或不完整,这种情况则不在我的考虑范围内.这是前期工作.如果不知道怎样处理合适,请翻阅我的前六章内容.

**************************************讲述制作与设计的分割线**************************************

其实呢,有很多同仁花在设计上的时间是最多的。而企业站点一般也没多少内容。我想,你看一下我的网页设计进阶系列的前四章。会对你的设计有很大的帮助。其余的不再做赘述。只是再强调一下积累。只有不停的积累,才会不断的进步。第四章关于素材里,我这样说过:

当你看到某一张图片的某一个部分,脑袋就开始闪光,你发现你可以完全从这一部分出发设计出一套的东西。

当你接到一个任务,脑袋就像硬盘一样,把你机器里跟这个任务相似类似的甚至可以直接拿过来用的那些内容自动打包。

当你要做某样东西,你的硬盘里哪些可用的字体哪些可用的花纹哪些的可用的小图标自动浮现在你的脑海里。

当你要做某样东西,这个时候你在赶路,你在骑车,你立刻就能想到哪个哪个网站上什么什么素材可以拿过来用。

当你看到某个站,你可以立刻进行引申,张口就说出哪个哪个站跟这个结构类似,哪个哪个站跟这个风格接近。。。

这几条都能做到了,设计对你来说还是难事么?

设计,其实是一个不断积累的过程。

*********************************************特别强调的分割线************************************

再强调一句,包含文件,可以再包含一个甚至多个包含文件........理解这句话,会让你在做那些静不静动不动的网站的时候省很多力气!

****************************************网站设计的根本的分割线************************************

这个话题我以后会更深入的探讨。网页设计的那点事。无非是图文混排的那点事。

时间: 2024-11-05 18:36:48

网页设计心得:高效编写网页代码的相关文章

网页设计与开发-网页设计,有一段代码太冗长了,求帮忙优化下!!!感激不尽!!!

问题描述 网页设计,有一段代码太冗长了,求帮忙优化下!!!感激不尽!!! 在最底下的那一段script代码太冗长了,求帮忙优化下,感激不尽!!! 以下是己完成的代码: <!doctype html> <html> <head> <meta charset="utf-8"> <title>无标题文档</title> </head> <style> .explain_box{ float:lef

网页设计中怎么把网页上的内容和数据库连接起来?

问题描述 网页设计中怎么把网页上的内容和数据库连接起来? 想做个网站,可是数据库不会连,怎么办?sql数据库代码怎么写? 解决方案 取决于你网站后台用的什么,php等都可以链接访问数据库. 解决方案二: (1)执行"开始'"控制面板'"性能和维护""管理工具""数据源(ODBC ),弹出"ODBC数据源管理器,对话框.切换到"系统DSN"选项卡. (2)单击"添加,按钮,弹出"创建新数据

网页设计心得:网页设计中的包容原则

让我们来探索 包含原则 奥妙.它允许我们忘记在我们的社交行为中根深蒂固的那种"他们"和"我们"之间的对立.聚焦包含原则将无障碍/通用设计的争论从上述利益冲突中解放出来,让我们拥抱一种更宽阔.更接近自然的设计哲学.最重要的一点,聚焦包含原则也帮助我们了解到,我们不仅是为了别人才重视可访问性,也是为我们自己好. 设计师的工作一直与"可视性(affordance)"有着密切的利害关系.这个词自唐纳德·诺曼(Donald Norman)的名著<设计

网页设计心得:网页设计中的细节表达

     天下难事,必做于易;天下大事,必做于细.--老子    设计中的细节表达,能够体现一个人的创新意识和能力.注重细节,能够让你去挖掘出更深层次的内涵.从而在侧面大幅度提升作品的影响力.让设计更具说服力. 细致入微    在写作中,使用细节来渲染.突出人物的形象.性格,是一种很常见同时很有效的方法.细节贵在传神,传神而突出.可以用来烘托气氛.衬托环境.突出人物性格:在产品中可以提升用户舒适度,提升用户的安全感:在生活中,细节可以让人感动.    这里并不是把细节给神化了.无论你是大开大合,

高效编写CSS代码:WEBJX分享15个CSS开发工具

文章简介:对于Web开发人员来说,好用的CSS工具可以让那些枯燥的工作变得有趣,并且还可以帮你更高效的编写CSS代码,在这里向大家推荐15个必不可少的CSS开发工具和应用. 对于Web开发人员来说,好用的CSS工具可以让那些枯燥的工作变得有趣,并且还可以帮你更高效的编写CSS代码,在这里向大家推荐15个必不可少的CSS开发工具和应用. 1. CSS Desk : An online CSS Sandbox 这是一个支持即时预览的在线CSS编辑工具,无需安装任何形式的插件或是软件,就能在线编辑CS

网页设计技巧:正确处理网页图片

译者:nornor 俗话说,一图胜千言.无论这是真是假,图片都是网页中重要的组成部分.自从嵌入图片步骤变得简单,我们可以看到很多网站都内嵌了许多图片,其中一些 网站从不同角度展示了正确利用图片的好处,然而,大部分网站则不是如此.尽管这对于一款设计来说,并不是多大的影响,但是这些图片可能会减少你销售产品的 机会,除非你有一个很好的诱导用户的页面或者创造了很好的阅读流条件.图片是细节胜于原则的问题,处理图片应该是设计师们更加需要理解和掌握的能力. 网页可用性专家Jakob Niesen和他的公司NN

网页设计教程(7):提高网页制作效率

上一篇:网页设计教程(6):要保持设计激情. 本来这第七章应该是针对设计中的层次.空间的技法及深层次的探讨.但今天暖暖跟我哭诉她事情总是处理不完.加上今年3·4月份公司的一大堆生意的顺利完成.以及那时候总结出的一些经验.觉得效率这个问题还是很有必要跟大家分享分享的.时间仓促,分类不明确,还请见谅! 本文从三个方面着手,一个是企业网站的建设(教育政府类也归纳到企业站点里),二是小型门户站点的建设,三呢,我把平面广告设计也顺带提一点.主要还是网站. 其实企业站点的工作量并不大,相信很多有经验的同仁能

一个网页设计需求方眼中的网页设计

虽然已经不做设计师快三年了,可是依然会一直留意站酷.看着各位高手的作品,总让我庆幸我没有把这条路走下去--三年前,我就是由于觉得自己在设计上没有什么天分,于是转行去了一家游戏公司,去做官网建设和媒体渠道方面的工作.如今看来,这条路没有错,我的设计和站酷上的高手想比,差距不是用努力学习追的上的. 由于工作的关系,我经常扮演一个网页设计的需求方的角色.3年的时间,我看了无数的设计稿,也亲手枪毙了很多的设计稿.很多时候我觉得很无奈,那些设计都很好--有的精美的让我枪毙的时候心情极度难受--这些设计本身

网页设计中实用的网页制作技巧

1.灵活运用样式 熟悉网页设计的网友就知道,调用Style的方法很多,我们可以单击鼠标右键选择Custon Style来调用Style标准,也可以在状态栏中的元素列表上单击右键来调用Style.虽然不同的方法达到的效果看似一样,但实际上产生的HTML代码则完全不同.比如用Custon Style来调用Style标准,在网页代码中就生成一个〈span〉标签,这样的标签一多就会使文件十分臃肿而且影响浏览器的解析速度,所以我们应尽量使用状态栏中的元素列表来调用Style. 2.活用Format Tab