当前位置:首页 » 网站资讯 » 个人网站样式怎么写
扩展阅读
电脑一扯就黑屏怎么办 2025-07-05 12:42:54

个人网站样式怎么写

发布时间: 2022-08-27 18:55:39

如何制作个人网站

1 策划与草图
2 设计与制做
3 切割与导出
4 编辑与模板
5 动画与广告
6 链接与上传

按软件及长度划分制做步骤:
1 策划与草图
1.1所有网站和其它设计作品的过程都是从策划开始的。这是最能体现你的才华和创造力的地方。人最大的区别于其它动物的地方就是会思考,会创造,而且唯有这点是难能可贵的!我们必须要在动手打开PS或FW制做界面前就要完成一个网站最最关键的策划部分,它将直接影响
这个网站的成败与否。一个优秀的网站,不仅做得漂亮,而且要方便浏览,可读性强,简洁明快!
网站的风格,用色,版式,布局,栏目甚至每个细小的图标都要经过精雕细琢,深思熟虑。而风格的制定要取决于你所做网站的浏览人群和读者职业背景、文化程度和修养爱好等,只有投其所好才能最大化地产生共鸣;另一方面取决于公司的类型和企业法人的喜好,如果不是要强加入你自己的意志的话,那上述几点已经制定了网站大致的努力方向了!
1.2本站是商业化的网站面向企业为主,所以我采用简约风格,亮丽明快的颜色和风格,只要学学平面构成和色彩构成就知道如何按其风格去布置各个元素和内容,以及用何种颜色来营造你要表达的效果了,包括冷暖明暗都是很关键的。大面积的中性色不刺眼,而重要的引导视线可以让亮色来担当,冬天喜欢暖色夏天喜欢冷色是人之常情,蓝色那种给人以信任和科技的底韵是我选择它的原因,而像橙、黄等促进食欲的颜色更容易受到食品网站的青睐!

1.3本着简洁科学的分类原则来划分栏目:首页 客户中心 窄告介绍 合作媒体 常见问题 媒体报道 关于我们
栏目如果划分不好的话,影响框架的调整,后果就是:重头再来了,郁闷吧?
本网站主要面向潍坊企业,所以要做得本地化,让人看了感觉亲切,而且要做得漂亮,废话!!
1.4好了,完成上面这些后请拿起笔在纸上按你的创意和设想画一草图,尽是具体些,最好精细到每处阴影和描边!这步很关键的说!
1.5本节最后就是准备制做网站时所需要的素材了,包括图标,LOGO,广告语,内容介绍等这都是最基本的!

2 设计与制做
2.1如果草图都已经绘制完美后就可以打开PS或FW开工制做和设计我们的界面了,在这里我使用PS,虽然没有FW的高效和专业但更加灵活和自由,这是我最喜欢的,也因为用惯了嘛!^^养兵千日用兵一时,平时的练习和学习在这里派上用场了!呵呵!
2.2可以在新建的778*600页面中先打框架然后再采用逐步细化的方法,还可以采用你自己独特的手法,比如透明玻璃水晶按钮等效果来营造特别的风格,要力求简约和精致!不要放过每个细节的刻画,即使是1*1的5%透明度的阴影都会给你的页面增彩,别以为别人看不见!
2.3最好养成分层的习惯,这样可以方便分类和编辑,不至于把上百个图层放在一下层级里搞得一团乱麻,分不清楚。
作为一名优秀的设计师应该有条理,所以请养成分类并为每个图层命名的习惯,这决不是浪费你的时间!

3 切割与导出
无论是PS还是FW,哪怕是AI做的设计界面,在切割的原则都是一样的,请遵从以下几个方面:
3.1首先要按大致的框架切割,如国字型或T字型,注意其完整性
3.2对于要输入的文字区域、大面积色块或单独的图片以及Flash动画要单独切割成非图片格式的切片以备插入
3.3对于添加内容需要很长的区域要注意其伸缩性切割,若有图案要保证可以重复排列
3.4在切割时要特别认真和小心,不要空留一行或列的一个象素的间隙,要放大让切片都对齐,不留空隙
3.5其它如按钮和空白处等自动生成的切片,以及创建需要改变图片外观的切片等
切割完毕后,选择文件另存为WEB页命令,导出为HTML文件待DW编辑。

4 编辑与模板
4.1在DW中打开导出的HTML文件开始编辑,包括大表格居中,设置背景,修改空白可输入区单元格背景为原来切割的图片等
4.2将编辑完毕的文件添加CSS样式,包括最基本的TD和ALINK等标签,然后存为模板DWT文件,并^+alt+v新建可编辑区域
4.3通过模板新建各个页面并添加入相应的内容

5 动画与广告
5.1按原来切片所容留的大小制做FL动画广告条,使用相应的文字内容和广告语,在FL中新建文件
5.2复制粘贴广告词到场景中,排版并转换为元件578*104
5.3添加相应的背景和动画,调试节奏后发布为SWF文件
5.4插入到DW中的模板页并调整大小后存盘,其它的页面会自动更新

6 链接与上传
6.1重新设置模板页的导航链接,本步骤也可在第四节完成
6.2在本地打开首页检查链接与文字内容直到无错,确保链接可正常访问
6.3上传到申请的空间,在域名解析成功后在浏览器中浏览网上的效果并做相应后期维护!

Ⅱ 如何自己制作个人网站

1 策划与草图
2 设计与制做
3 切割与导出
4 编辑与模板
5 动画与广告
6 链接与上传

按软件及长度划分制做步骤:
1 策划与草图
1.1所有网站和其它设计作品的过程都是从策划开始的。这是最能体现你的才华和创造力的地方。人最大的区别于其它动物的地方就是会思考,会创造,而且唯有这点是难能可贵的!我们必须要在动手打开PS或FW制做界面前就要完成一个网站最最关键的策划部分,它将直接影响
这个网站的成败与否。一个优秀的网站,不仅做得漂亮,而且要方便浏览,可读性强,简洁明快!
网站的风格,用色,版式,布局,栏目甚至每个细小的图标都要经过精雕细琢,深思熟虑。而风格的制定要取决于你所做网站的浏览人群和读者职业背景、文化程度和修养爱好等,只有投其所好才能最大化地产生共鸣;另一方面取决于公司的类型和企业法人的喜好,如果不是要强加入你自己的意志的话,那上述几点已经制定了网站大致的努力方向了!
1.2本站是商业化的网站面向企业为主,所以我采用简约风格,亮丽明快的颜色和风格,只要学学平面构成和色彩构成就知道如何按其风格去布置各个元素和内容,以及用何种颜色来营造你要表达的效果了,包括冷暖明暗都是很关键的。大面积的中性色不刺眼,而重要的引导视线可以让亮色来担当,冬天喜欢暖色夏天喜欢冷色是人之常情,蓝色那种给人以信任和科技的底韵是我选择它的原因,而像橙、黄等促进食欲的颜色更容易受到食品网站的青睐!

1.3本着简洁科学的分类原则来划分栏目:首页 客户中心 窄告介绍 合作媒体 常见问题 媒体报道 关于我们
栏目如果划分不好的话,影响框架的调整,后果就是:重头再来了,郁闷吧?
本网站主要面向潍坊企业,所以要做得本地化,让人看了感觉亲切,而且要做得漂亮,废话!!
1.4好了,完成上面这些后请拿起笔在纸上按你的创意和设想画一草图,尽是具体些,最好精细到每处阴影和描边!这步很关键的说!
1.5本节最后就是准备制做网站时所需要的素材了,包括图标,LOGO,广告语,内容介绍等这都是最基本的!

2 设计与制做
2.1如果草图都已经绘制完美后就可以打开PS或FW开工制做和设计我们的界面了,在这里我使用PS,虽然没有FW的高效和专业但更加灵活和自由,这是我最喜欢的,也因为用惯了嘛!^^养兵千日用兵一时,平时的练习和学习在这里派上用场了!呵呵!
2.2可以在新建的778*600页面中先打框架然后再采用逐步细化的方法,还可以采用你自己独特的手法,比如透明玻璃水晶按钮等效果来营造特别的风格,要力求简约和精致!不要放过每个细节的刻画,即使是1*1的5%透明度的阴影都会给你的页面增彩,别以为别人看不见!
2.3最好养成分层的习惯,这样可以方便分类和编辑,不至于把上百个图层放在一下层级里搞得一团乱麻,分不清楚。
作为一名优秀的设计师应该有条理,所以请养成分类并为每个图层命名的习惯,这决不是浪费你的时间!

3 切割与导出
无论是PS还是FW,哪怕是AI做的设计界面,在切割的原则都是一样的,请遵从以下几个方面:
3.1首先要按大致的框架切割,如国字型或T字型,注意其完整性
3.2对于要输入的文字区域、大面积色块或单独的图片以及Flash动画要单独切割成非图片格式的切片以备插入
3.3对于添加内容需要很长的区域要注意其伸缩性切割,若有图案要保证可以重复排列
3.4在切割时要特别认真和小心,不要空留一行或列的一个象素的间隙,要放大让切片都对齐,不留空隙
3.5其它如按钮和空白处等自动生成的切片,以及创建需要改变图片外观的切片等
切割完毕后,选择文件另存为WEB页命令,导出为HTML文件待DW编辑。

4 编辑与模板
4.1在DW中打开导出的HTML文件开始编辑,包括大表格居中,设置背景,修改空白可输入区单元格背景为原来切割的图片等
4.2将编辑完毕的文件添加CSS样式,包括最基本的TD和ALINK等标签,然后存为模板DWT文件,并^+alt+v新建可编辑区域
4.3通过模板新建各个页面并添加入相应的内容

5 动画与广告
5.1按原来切片所容留的大小制做FL动画广告条,使用相应的文字内容和广告语,在FL中新建文件
5.2复制粘贴广告词到场景中,排版并转换为元件578*104
5.3添加相应的背景和动画,调试节奏后发布为SWF文件
5.4插入到DW中的模板页并调整大小后存盘,其它的页面会自动更新

6 链接与上传
6.1重新设置模板页的导航链接,本步骤也可在第四节完成
6.2在本地打开首页检查链接与文字内容直到无错,确保链接可正常访问
6.3上传到申请的空间,在域名解析成功后在浏览器中浏览网上的效果并做相应后期维护

Ⅲ 个人资料里面的网站怎么

如果你有个人网站的话,就写上你的个人网站,如果你有博客的话,就写上你的博客,或者写上你的QQ空间的网址,总之就是和你有关系的网站。

Ⅳ 怎么制作个人网站

一、自己做。会编程,自己写代码做网站。不过既然这么问,应该是不会写,但可以学,自学或者参加培训班。编码好了,还需要买空间、域名。
二、找设计。任何事情都可以用钞票解决。找专业的网络公司来制作。不过既然这么问,应该是没打算这方面的开支。
三、找朋友。一个好汉三个帮。自己身边朋友没有,可以托朋友找他的朋友。地球上所有人的关系都超不过六度,即是人托人6次可达。但关系有远近,人情有亲疏,找到乐意免费帮忙的可也不容易。
四、使用自助建站系统。会打字就能做一个简单的网站。费用也不高,这类系统很多,网上可以找。
五、下载源码搭建。有些源码网站,还有很多开源系统,提供很多成品案例。有很多提供下载。下载源码中一般也有安装指导文件。照葫芦画瓢也能搭建一个。缺点是不会代码,想修改个样子难。
六、使用个人博客,如新浪博客、腾讯博客等。系统是现成的,固定的,就是发文章就可以。还可以进行简单的空间装修。

Ⅳ 如何制作一个简单的个人网站(网页设计课程需要的作业)需要两个样本

建站系统可以帮到你,自己去下载一个,有免费的,如:PageAdmin网站管理系统、wordpress系统、帝国软件、动易系统,这些都是比较常用的。

Ⅵ 个人网站的制作技巧

1、灵活运用样式

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

2、活用Format Table命令

在复杂的网页设计中,表格的应用是最多的,因为利用表格可以自由地控制文本和图象在网页上出现的具体位置,从而使整个网页看上去紧凑统一。Dreamweaver在这方面也不甘落后,我们可以使用其中的“Format Table”(格式化表格)命令来快速地对表格应用预先设计好的样式。要使用预先设计好的样式,先将光标置于表格的任意一个单元格内,再选择“Command”→“Format Table”命令, 在随后出现的对话框中,从左边的列表中选择一个设计方案。按“Apply” 键来查看效果,如果不满意的话,还可以重新设置或者修改部分参数的值,如边界粗细,背景颜色等等。

3、同时链接到两个网页

我们都知道超级链接一次只能连到一个页面。如果我们要想一次在不同的框架页中打开文档,可以使用“Go To URL”JavaScript 行为。打开一个有框架的网页,选择文字或图象,然后从行为面板中选择“Go To URL”。我们会注意到Dreamweaver会在“Go To URL”对话框中显示所有可用的框架。选择其中一个我们想链接的框架并输入相应的URL后再选择另一个框架并输入另一个URL。

4、不给文件起中文名称

大家在制作好了网页后,通常会给网页起一个具有代表性的中文名称,一来能使人一看文件名就能大概了解文件所包含的内容,二来能够方便各个超级链接之间的相互调用。但如果你在Dreamweaver中这样做,就会发现Dreamweaver对中文文件名支持得不是太好,经常会有页面调用不正确的现象发生,所以我们以后在Dreamweaver中保存网页的时候,尽量用英文或者数字作为文件名称,这样就可以避免上面的出错现象。

5、巧妙设置字体分辨率

我们在制作网页的时候,经常有这种体会,那就是制作好的网页在本地计算机上浏览时很正常,但在另外一台计算机上浏览时发现原本漂亮的网页变得歪歪扭扭了,这是为什么呢?原来各个计算机的分辨率要使你的主页在不同的分辨率下都能正常显示,在 Dreamweaver中得到了较好的解决。在文档窗口的右下角,Dreamweaver 显示当前文档被设计成的分辨率大小。单击哪个数字,在弹出式菜单中可以为当前的页面指定显示分辨率,通过修改可以使你的主页更具灵活性。使不同分辨率的显示器都能较好地显示。

6、巧妙隐藏标签

如果在网页中插入了不可见的元素时,Dreamweaver会自动在页面上添加一个与之相应的元素标签,以便于我们选择不可见元素。但这并不全是件好事,比如我们在一个有很多层的页面中的第一行便插入一个表格,就会发现由于首行排列了太多的层元素标签而使得表格自动退到了页面的第二行,虽然在浏览时并不影响效果,但这确确实实会阻碍我们的工作。所以当我们觉得某个元素标签碍手碍脚时,就索性将之屏蔽掉。方法是按Ctrl+U打开Preferences面板,在Category中选中Invisibel Elements,在面板的右边将会出现所有的元素标签。只要将不需要的元素标签前的勾去掉,以后它就保证不会再出现了。

7、善用拖放技巧

我们在使用Dreamweaver编辑网页的时候,经常需要插入一些图象什么的,假设要插入的图象很多,按照常规方法来操作就显得非常麻烦。我们可以利用拖放技巧来很好地解决这个问题。首先我们把Dreamweaver的操作窗口变成活动窗口,以腾出空间来显示Explorer窗口,找到要插入的图象文件后,把它们一一用鼠标拖动到网页的适当部位,Dreamweaver将自动把这些图象的url添加到文件的HTML代码中,当然这里要求被拖动的图象文件必须是gif、jpg等web图象格式的文件。对于已经在网页中的图象也是一样,直接拖过来就可以了。但如果被拖动的图象上有超级链接,就不可以再使用拖动技术了,因为那时拖过来的仅仅是超级链接地址。