网页设计实训心得

    这个学期学习了网页设计实训基础这门课程，使我增加了计算机的基础知识，同时也增加了对学习计算机的浓厚兴趣。

    第一、从这次实训当中我深刻的体会到理论知识的重要性，只有在自己熟练理论知识后再能在实践中游刃有余，才不会出现“用时方恨少的境地。”

    第二、实训中我印象最深的是对各种网页制作工具的使用不熟练，甚至还有个别不会用的，只是自己想要做个图片或图标等都做不好，其心情想而知。所以对这些网页是做工具的使用都要练习。

    第三、集体协作是我又一个体会。这次网页制作由于某些原因我一个人一组，是我搞掘到压力很大而且很累，而且我自己的思维能力很有限，网站设计和制作上也略显粗糙和不足，正所谓：你有一个思想，我有一个思想，分享后我们就都有两个思想。所以与同学合作是很有必要的。

人生的快乐莫过于做自己喜欢的事情，我很庆幸能有这次实训机会，因为我喜欢静静地坐着去做做自己心里的故事，或许做的不是特别完美，从此也可以看出我以后还需要更多的努力，我会奋勇向前不断不努力的，希望能够得到老师的肯定！

第二篇：网页设计实训心得

通过这次实训对这门课程的学习，做好网页，并不是一件容易的事，它包括网页的选题、 内容采集整理、 图片的处理、 页面的排版设置、 背景及其整套网页的色调等很多东西。

所以我得出一下总结：

一、 准备资料和挑选符合目的主题的合适素材

做网页当然要收集、准备资料。在网上多转转，看到什么漂亮的网页，把它保存起来， 作为以后自己设计主页时的参考。另外，还包括搜集美化主页可能要用到的各种材料，如背景、小动画图标等等。可以在硬盘上建一个文件夹，下分“图片、声音、动画”等文件夹， 养成上网时看到有创意、新鲜的图像，就按鼠标右键存入你硬盘相应文件夹的习惯，时间一长就拥有了一个可观的图库，等做网页时随手拈来或加以修改就成你自己的东西了。

二、 规划好整个网站

主页的设计应以醒目优先，应该令人一目了然，切勿堆砌太多不必要的细节，或使画面 过于复杂。切记，页面给人的第一观感最为重要！在网上到处浏览网站的人很多，如果你的主页给人的第一印像没有吸引力， 很难令他们深入观赏， 而且他们恐怕再也不会访问你的网站了。

三、 善用图片，增强艺术效果

我记得老师说过网页的迷人之处之一， 要算它上面能点缀许多漂亮的图片。 精美的图片设计，可以使自己的网页增辉不少，令人过目不忘。图片的内容应有一定的实际作用，切忌 虚饰浮夸，同时还要注

意与文字的颜色搭配。最佳的图像集美观与资讯于一身。

四、善于借鉴他人主页制作中的设计技巧

由于在网上用浏览器浏览任何主页时， 都能查看到该主页制作时所编写的绝大部分网页编程源代码。因此，如果想知道并掌握一些优秀的主页采用的设计技巧，试着将其源代码 调出来仔细揣摩，并模仿着一步一步去实现。

最后感谢老师多日来的辛勤教导！

第三篇：网页设计实训报告

       湖南科技经贸职业学院计算机科学技术学院

实训报告

实训课程：     网页设计            

班    级：     计网二班            

学    号：     200903884            

姓    名：      彭论            

指导老师：      王湘文           

提交日期：     20##-6-21                

前言

至于我为什么选择酒店设计题材，因为本人就是想以后自己能办一个很品牌一点的酒店。

在选择好题目和网站的风格之后，我就进行了分工，希望能在最短的时间内做到最好的效果。接下来的步骤就是准备素材，搜集与主题相关的文字、图像、动画、音乐等资料。再是设计网站的内容结构、目录结构和链接结构，设计首页及其页面的版式结构。然后创建本地网站，建立网站的目录结构。制作首页、创建超级链接。最后就是测试与浏览网页。对于酒店网站的设计，我结合了国内外很多知名品牌酒店的网站页面的设计前沿。取其精华，去其糟粕，在网站内容上删减了很多的在外观上的美，整体讲究整体美和简洁美，对于本网站的设计凝聚了本人长达三个星期的时间，完成网站静态设计后，从总体上对网站动态上进行动态设计，希望本网站能在我们这个年纪的领域有一个很好的炫美。

目录

²  实训目的····················································································· 3

²  实训任务····················································································· 4

²  实训项目（网页设计思路及详细说明）················································ 5

²  实训中遇到的问题与解决问题的方法··················································· 6

²  实训心得与体会············································································ 7

一．实训目的

  进一步熟悉和掌握网站建设的基本流程和技术规范；

  巩固运用Dreamweaver网页制作软件制作网页、特别是制作动态网页的知识；

  巩固运用PhotoShop图像处理软件进行网页中图形制作和运用flash动画制作软件设计网页中动画的知识；

  巩固综合运用Dreamweaver、PhotoShop、flash三个软件完成网站建设任务的方法，能独立设计一个内容完整、图文并茂、技术运用得当的网站；

  具备独立撰写实训报告等科技文件的基本能力；

  在网页设计的实践中培养分析问题、解决问题的能力，培养协作、交流的能力，培养创新能力和团队意识；

  为今后从事网站开发、维护和管理奠定基础。

二、实训任务

Ø  站点规划，搜集资料。确定网站主题内容，规划站点结构，从网上搜索相关资料（图片、文字等）。

Ø  进行主页设计。构思主页布局，进行主页标题图片的设计（要求原创），进行主页其余图片的设计和页面内容的录入，最后进行主页的整体优化设计。

Ø  网页设计。除主页以外的网页设计，首先设计网页模版，一部分网页由模版生成，一部分为单独设计（依据实际需要确定哪些网页由模版生成，确定哪些网页单独设计）。包括版面设计和图形设计、内容录入等。

Ø  动画设计。主页动画设计和其余页面动画设计，充分运用所掌握技术，效果好。

Ø  综合优化。链接正确、得当，动态效果好（时间轴动画、行为、代码的嵌入等）

Ø  网站测试并递交。在浏览器中对完成的网站逐页打开测试，包括链接正确与否，页面打开时间，图片和动画是否丢失等。

三、实训项目（网页设计思路及详细说明）

项目：《中国室内设计网》网站设计

项目设计说明：

u  站点结构与命名。

ü  站点文件夹为班级学号姓名（如：09计网二班 XXX）

ü  站点文件夹中所包含文件夹：Images（存放图片文件）

ü  Templates（存放模板文件）

ü  Library（存放库文件）

ü  Other（存放其它文件）

ü  原文件（存放自己设计的图形、动画文件，但最终要用的图形、动画文件还是要放到Images文件夹下）其余视文件夹需要而添加，全部用英文命名

ü  站点文件夹中所包含文件： index(首页)

ü  *.css（样式表文件）其余视文件夹需要而添加，全部用英文命名

例如：

\

u  网站题材选择。

ü  制作个人网站

ü  制作班级网站

ü  制作学校网站

ü  制作教学资源网站

ü  制作旅游网站

ü  制作公司网站

u  网站技术要求。

ü  页面布局合理，色彩和谐，链接正确，图文并茂并茂。网站页面大小满足800*600分辨率的客户。

ü  主要图片和动画为原创（保存有源文件），主页标题图片（动画）必须为原创。

ü  必须且合理使用动态技术（包括行为、时间轴动画、嵌入代码等），必须且合理运用模版、库文件。

ü  站点中要有一个首页，二级网页总数不少于10页。三级页面数目不限，结构为：

u  网站设计详细说明

Ø  设计一个模板：（如图1所示）

图1

Ø  将所建模板保存，利用模板新建一个HTML页面，并在模板中的可编辑区域中插入表格，再往表格中插入图片：（如图2所示）

图2

图3

预览效果如图a所示：

图a

Ø  在下一行表格中插入视频文件：（如图4所示）

图4

预览效果如图b所示：

图b

Ø  在下一行表格中插入背景图片，并在里面输入文本：（如图书5所示）

图5

预览效果如图c所示：

预览效果如图e所示：

图e

Ø  在下一行表格中插入表格，并输入图片：（如图8所示）

图8

预览效果图果f所示：

Ø  运用以上方法完成其它表格的制作，最终页面效果预览如图g所示：

图g

四、实训中遇到的问题和解决方法

²  路径问题

现象：预览时文件不能显示预览效果。

解决方法：在文件夹或文件存放过程中，应注意存放和命名的规范，要明白绝对路径和相对路径的区别。

²  表格的布局问题

现象：预览时表格被衬大或缩小、显示页面混乱。

解决方法：在运用表格布局的过程中，应注意合理的插入表格、设置表格的属性，关键是要懂得合理运用表格中的百分比与像素。

²  Style样式运用的问题

现象：背景运用CSS样式时，在预览中不能显示。

解决方法：在一个网站站点中，通常都使用相对的链接路径，在CSS样式表中，如果在其中一个CSS样式表中设置了“背景图像”，一定要注意检查背景图像所链接的相对路径的正确与否。

²  超链接运用的问题

现象：对文本或图片设置链接后，在预览效果中依然不能有效进行链接。

解决方法：超链接样式表只有应用于超链接标签<a>内才会对超链接的文本起作用。如果样式表应用在其它的位置，如<td>、<span>等，将不会对超链接文本起到任何作用。

²  模板运用的问题

现象：网页不能在IE浏览器中预览以及在模板文件下新建的页面不能进行更改。

解决方法：在运用模板时应注意不能直接在模板文件中进行编辑；打开模板文件，在模板中进行需要的修改，然后再更新到其它文件。

²  边框编辑的问题

现象：给边框在属性中设置最小值还是不能满足需要

解决方法：在样式面板中，添加自己定义的样式，在自己定义的过程中可将边框的值定义得更小，以达到自己的目的。

²  Div层的运用问题

现象：在预览效果中，有一部分文本不能显示出来

解决方法：在该层的属性面板的中，在“益出”下拉列表中选择“hidden”，问题即可解决。

五、心得体会

通过本次的实训，在老师的热心指导和精心培养下，我不仅在知识上有了很大的提升而且在心得上也是收获颇多。

本次实训的目的旨在检验我们在平常学习中所学知识、将上课所学的理论知识在实践中巩固掌握以及进一步熟悉和掌握网页设计与网页制作的基本流程。

回顾这次课程设计，至今我仍感慨颇多，的确，从选题到开始制作，从理论到实践，在5天实训的日子里，可以说得是苦多于甜，但是可以学到很多很多的的东西，同时不仅可以巩固了以前所学过的知识，而且学到了很多在书本上所没有学到过的知识。通过这次课程设计使我懂得了理论与实际相结合是很重要的，只有理论知识是远远不够的，只有把所学的理论知识与实践相结合起来，从理论中得出结论，才能真正为掌握技术，从而提高自己的实际动手能力和独立思考的能力。

在设计的过程中遇到问题，可以说得是困难重重，这毕竟是第一次独自设计网站、制作网站，难免会遇到过各种各样的问题，同时在设计的过程中发现了自己的不足之处，对以前所学过的知识理解得不够深刻，掌握得不够牢固，比如说拖动层的设置，时间轴与层的显示与隐藏的综合应用，在CSS的具体应用还不是和很熟练，没有能完全达到自己预期的效果，还好通过老师的细心指导才能达到最终效果……通过这次网页设计与制作实训，一定把以前所学过的知识重新温故。此次实训中我发现了在网页设计与制作的过程中存在许多的细节问题，也从中学到了很多课本上没有的知识。关键是从自己单独设计与制作网页的过程中，培养了自己主动学习、敢干动手与自己发现问题、解决问题的能力，这为以后进一步的学习网页制作与网站开发打下了一个良好的基础，也给以后的工作作了一个良好的铺垫。

本次实训自己设计的室内设计网网站实现了布局清晰、有条理，视觉效果较好，涉及的知识点较全面等目标，但是在连接数据库等方面还是存在一些问题，这是开发动态网站的重要基础，我认为自己以后应该在静态网页到动态网页的转变方面多钻研、多努力，使自己在静态、动态网站开发上的水平有一个质的提升。

希望通过对本网站的建设，可以提升自己以后在网站建设方面的一部分能力，我相信，现在在努力是为以后的成功的事业打下一个坚实的基础，为自己美好的人生铺好一条阳光而灿烂的道路。通过这次实训是自己的真实能力有了一次质的飞跃。

                                                              实训人：彭论

                                                           2101年6月21号