网站改版|WAP网站制作|域名注册|虚拟主机|服务器|海微商|海微信|海微通| 无障碍| 24小时服务电话:13807590485
海南网站建设海南网站制作海口网站建设三亚网站建设儋州网站建设五指山网站建设文昌网站建设琼海网站建设万宁网站建设东方网站建设定安网站建设 网站首页网站首页 网站建设网站建设 微信开发微信开发 网站推广网站推广 海南网站建设公司,海南网站开发制作公司,海南网页设计公司,海南小程序开发公司,海南微信公众号开发公司,海南网络公司,海南世纪华联海南世纪华联 网站超市网站超市 客户案例客户案例 网站模板网站模板 关于我们关于我们
  • 微信开发
  • 持之以恒
  • 网站设计制作
  • 中立五年回报客户
无障碍
网站建设
建站基础系统 成品网站 网站建设资讯 独立设计样板 网站套餐 解决方案 经典案例
联系我们
QQ服务群:28519571 工作时间:86-0898-31568080 传真号码:86-0898-31568085 24小时服务:0138-07590485
 您现在的位置: 首页 >> 网站建设 >> 网站建设资讯 网站制作教程
网页制作技巧
世纪华联 | 2011-12-02 00:03:19 | 阅读:6719

在网页设计的认识上,许多人似乎仍停留在网页制作的高度上。认为只要用好了网页制作软件,就能搞好网页设计了。其实网页设计是一个感性思考与理性分析相结合的复杂过程,它的方向取决于设计的任务,它的实现依赖于网页的制作。

由于网站正以惊人的速度在飞速增加,互连网通道是越来越拥挤了,网页的下载速度也越来越慢,给网页减重是网页设计工作者首先考虑的问题之一。减少图片数量、降低图片质量、采用jpg、gif等压缩图片文件,如此等等,其目的都有是为了给网页减重,提高传输速度。我这里再告诉你几种方法来给网页减重(本文介绍的方法均在Dreamweaver3中实现,若在其它网页制作工具中具体作法稍有改变): 
1、不使用图片获得各种颜色的线条

图1 各种颜色的线条
在Dreamweaver3或Forntpage中虽有插入水平线的功能,但他插入的线条无法改变颜色,为了获得特定颜色的线条你不得不使用图片,这无疑增大了网页负担,有没有其它办法呢?有!你可以使用表格来实现,考虑到表格是以行为单位来定位的,为了能更方便的定位线条,我们把表格放到层上,这样你就可以任意把线条放到任何位置了。具体作法如下:
(1)单击功能面板上的插入层图标,在页面上画一个层,再在功能面板上点击插入表格图标,在弹出的表格面板上把表格的行和列均设置为1;
(2)选取表格,在表格的属性面板上把“cellpad”、“cellspace”、“border”均设置为“0”,把“W”设置为“100%”,“H”设置为2pixels(象素),设置好表格的背景色(也就是线条的颜色。
(3)在单元格中点一下,在单元格的属性面板上把“W”设置为“100%”,把“H”设置为2pixels(象素);
(4)在快速启动栏上点击源代码检示窗图标,在源代码编辑窗中把单元格中的“ ”(“空格”代码)删去。
到此,一条特定颜色的水平线已画好。若要改变线条颜色,只要改变表格的背景色就行了;若要改变线条高度(即线条的粗细),只要修改(2)、(3)中的“H”即可;改变层的宽度,就可改变线条的长度;若要把水平线变为垂直线,只要把(2)、(3)中的“W”和“H”的值换一下就行了,是不是方便极了。

2、巧作渐变色背景

图2 渐变色背景示例
象图2这样的渐变色背景能给人一种梦幻般想象的感觉或产生明显的立体感,当我们需要使用渐变色背景图像时,我们不必做与所填充的面积等大的图像,只要做一幅能包含所有渐变色的图像单元就行了,这样即使是填充整页的背景,其图像文件的大小也不到1K,而且横向渐变色,背景区纵向高度任意改变不必改动背景图像;纵向渐变色,背景区横向宽度任意改变不必改动背景图像;真是方便。
制作方法如下:
(1)横向渐变色图像单元制作
在Potoshop中,单击“File”主菜单,选择“New”,在新建图象属性对话图上,在图象宽度输入框中输入你的背景区域宽度,在图象高度输入框中输入1pixels,按“OK”键,再用渐变色填充,根据需要修饰一下,用Export输出 jpg、gif均可。
(2)纵向渐变色图像单元制作
在Potoshop中,单击“File”主菜单,选择“New”,在新建图象属性对话图上,在图象高度输入框中输入你的背景区域宽度,在图象宽度输入框中输入1pixels,按“OK”键,再用渐变色填充,根据需要修饰一下,用Export输出 jpg、gif均可。
有了图象单元,只要在需要渐变色背景的区域把相应的背景图象单元作为背景图象就行了。

3、拉线背景的制作技巧

图4 拉线背景示例
拉线背景已成为一种时尚,目前一些大型网站的网页都在大量使用拉线背景,制作拉线背景同样无需制作整幅的拉线图象,只需制作一幅拉线单元图象就行了。制作方法如下:
(1)在Potoshop中,单击“File”主菜单,选择“New”,在新建图象属性对话图上,在图象高度输入框中输入2pixels,在图象宽度输入框中输入1pixels,按“OK”键,再用填充工具把其中的一个象素填充上你所要的颜色,根据需要修饰一下,用Export输出 jpg、gif均可。
(2)在需要拉线背景的区域,选择上面做好的图象作为背景图象,就一切OK了。而且无论你是多大的背景区域均不必修改图象单元。

4、拉丝图象的制作技巧

图5 拉丝图象示例
拉丝图象给人一种朦胧的想象感觉,另外,他可以用质量比较低的图片,这大大减少了图片文件的份量,加快了下载速度,我想这可能是其流行起来的主要原因之一。拉丝图象的制作方法已有不少文章介绍。我在这里介绍的方法与一般方法不同,它能更进一步减少你的网页重量,提高制作拉丝图象的效率。制作方法如下:
(1)在Potoshop中,单击“File”主菜单,选择“New”,在新建图象属性对话图上,在图象高度输入框中输入2pixels,在图象宽度输入框中输入1pixels,图象背景选择(透明背景)“Transprent",按“OK”键,再用填充工具把其中的一个象素填充上你所要的拉丝颜色,根据需要修饰一下,用Export输出 gif即可;
(2)在Dreamweaver3中,单击功能面板上的插入层图标,在页面上画一个层,再在功能面板上点击插入图象的图标,在层上插入你所要的图象;
(3)再单击功能面板上的插入层图标,在页面上画一个层,在该层的属性面板上,在层背景图象输入框中输入你刚制作的拉丝单元图象文件名;
(4)把上面制作的有拉丝背景的层拖到图象上,并调整层的大小与图片大小一致,一幅漂亮的拉丝图象就做成了。
若要把网页中已有的图象变为拉丝图象,只要重复(3)、(4)两步操作就行了。用本方法还可以把动画变成拉丝动画呢?怎么做,不用我讲了吧?!把图片换成动画就大功告成了。是不是太方便了。这里提醒你注意:第(1)步操作中把图象背景设为透明是关键,否则你就看不见下面的图片了。

海南网站建设|海南网站制作|海口网站建设|三亚网站建设|儋州网站建设|五指山网站建设|文昌网站建设|琼海网站建设|万宁网站建设|东方网站建设|定安网站建设|屯昌网站建设|澄迈网站建设|临高网站建设|白沙网站建设|昌江网站建设|乐东网站建设|陵水网站建设|保亭网站建设|琼中网站建设|海口精英网|三亚精英网|文昌精英网|琼海精英网|陵水精英网|儋州精英网|万宁精英网|澄迈精英网|海微通
合作伙伴 企业发展 企业文化 联系我们 在线订购 网站地图 返回首页手机版
海口世纪华联科技有限公司2024版权所有 24小时服务热线:13807590485   欢迎来电咨询
地址:海南省.海口市.海甸二东路环惠大厦6楼(南宝路明都大厦107#) 公司电话:0898-31568080 31568060 QQ:85398489
全国合作联盟分布:海南海口 四川成都 湖北武汉 湖南长沙 安徽合肥 广东深圳 山西太原 西藏拉萨
技术服务: E_mail:server@hnzlweb.com 服务订购:E_mail:server@hnzlweb.com 在线客服邀请 琼ICP备10201086号-15
推广关键字:海南网站建设公司,海南网站制作公司,海南网站开发公司,海南微信开发公司,海南微信公众号开发公司,海南微信公众号代运营公司,海南模板网站制作公司,海南网页设计公司,海南网络公司