官网首页   >   帮助中心   >   网站建设   >   网页设计者如何提高网页制作效率(一)

网页设计者如何提高网页制作效率(一)

2021-02-20 14:23

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

一:首页。
这里的设计含量是最高的。工作也是最繁复的。暂且不谈设计。从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还要小.
    其实要说的是,代码状态操作,很多时候效率是最高的!
  如果客户提供给你的内容,不全,或不完整,这种情况则不在我的考虑范围内.这是前期工作.如果不知道怎样处理合适,请翻阅我的


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

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

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

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

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

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

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

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


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


 
网页设计技巧:网页中英文混排行高问题2008-08-27 01:02:40  来源:口碑网UED Team 布林基本上快被这个问题搞疯了,症状如下

 

症状描述:在ie下(6或7,8没有试过)当出现中英文混排,都采用默认字体时,并使用 li 列表做float时,会出现如上图的症状,文字排列上下不对齐的情况。影响了布局的美观性,造成上图情况的原因是中英文的文字基线不同,arial字体的下边缘要比宋体(同为12号)低一个象素,上边缘比宋体矮两个象素,而且英文还有i,y这种上下基线不同的情况。所以当中英文混排对齐时,就会出现明显的高度差异,使排版不均。可见放大图。

 

采用中英文字均使用宋体的方案

 

可以解决文字排列不对齐的情况,但宋体英文字是衬线字体(Times New Roman即是英文中的衬线字),字型紧凑,细节较多,连云港代账公司排列在一起很醒目,但在连续成文时,容易造成辨识困绕,看错行的情况。关于衬线字体的优缺点,请见这篇文章。相比之下,表示英文还是使用无衬线字体更美观大方。

解决方法一 “饺子”童鞋的 发现。

英文采用tahoma字体–宋体,arial及 tahoma字体比较–arial与tahoma的无衬线体比较精致

 

当中英文混排时,使用tahoma字体的情形

 

中英混排,纯中文组合的行高都一致了,但a在hover状态下下划线与中文粘联在一起。

缺陷:使用tahoma字体时,在ie6及ie6以下版本,会导致所有中文字体链接的下划线会出现与字体粘连现象。淘宝使用的也是这一解决方案。相信大型项目,不同的人来共同完成一个页面的模块时,在统一的规范下,使字体更规范,减少错位,而采用带有下划线会出现与字体粘连的tahoma字体,是值得的

以下是携同大米童鞋 发现的:

英文采用arial字体,中文使用宋体。可在标签内注明 line-height:1.231,可解决行高不等以及字体与下划线粘连问题。(不知道大范围中英文混排适不适用,有待后续校验。)


北通云建站致力于网站建设、网站推广、小程序制作、微信营销等项目的专业互联网服务提供商。 


网站建设及相关业务电话:0518-85119858 ,值班经理:18352802022


合作伙伴