版权说明：本文档由用户提供并上传，收益归属内容提供方，若内容存在侵权，请进行举报或认领
文档简介
第9章个人网站——我的博客1网站设计基础与实例教程第9章个人网站——我的博客1网站设计基础与实例教程9.1网页效果图主页效果图2网站设计基础与实例教程9.1网页效果图主页效果图2网站设计基础与实例教程9.1网页效果图子页效果图3网站设计基础与实例教程9.1网页效果图子页效果图3网站设计基础与实例教程9.2客户需求“博客”一词是从英文单词Blog音译而来，一种表达个人思想和网络链接，内容按照时间顺序排列，并且不断更新的出版方式。
个人博客（个人网站）的作用有以下几点：作为网络个人日记；个人展示自己某个方面的空间；网络交友的地方；学习交流的地方；通过博客赚外快；通过博客展示自己的企业形象或企业商务活动信息。4网站设计基础与实例教程9.2客户需求“博客”一词是从英文单词Blog9.2客户需求
对于个人博客，客户往往都希望能够制作出既美观又能彰显自己风格的页面，这就要求做到以下几点：1．简洁为美：博客的装饰尽量简单，放弃那些不实的设计，即使要有也不要因为装饰影响到文章的阅读。2．要有自己的见解：对于某个事物你必须有自己的态度；对于你提供的信息和内容，必须做到真实、广博、生动、高品位；转载别人的文章要写名出处，无法查究出处的要写明转载。3．结构清晰：可分为个人区域（如个人介绍、日志等）、交际区域（如好友、留言等）和服务区域（如音乐、视频、新闻等）。４．持续更新：做到至少一个星期更新一次，隔几天最好。5网站设计基础与实例教程9.2客户需求对于个人博客，客户往往都希望能够9.3页面风格定位
个人博客的风格定位相对容易，主要取决于作者的性格、喜好，总体上来讲体现为以下四个方面：
1.颜色风格：选择一种体现个人形象、延伸个人内涵的色彩。
2.字体风格：一般网页默认的字体是宋体。为了体现站点的“与众不同”和特有风格，可以根据需要选择一些特别字体。
3.内容风格：布局简单明了，内容清新，栏目齐全便于交流。
4.语言风格：通俗易懂，便于沟通与交流。6网站设计基础与实例教程9.3页面风格定位个人博客的风格定位相对容易，主9.4网站建设方案网站建设方案包括以下几个部分：客户情况分析；网站需要实现的目的和目标；网站形象说明；网站的栏目板块和结构；网站内容的安排，相互链接关系；使用软件、硬件和技术分析说明；开发时间进度表；宣传推广方案；维护方案；制作费用；本公司简介：成功作品，技术，人才说明等。7网站设计基础与实例教程9.4网站建设方案网站建设方案包括以下几个部分：7网站9.5网站主页设计效果图设计个人网站比较简单，内容信息较少，往往是利用空闲时间来发展网站，这就造成了投入网站的人力和时间都非常有限，网页布局结构比较单一。由于网站面向的浏览者也相对较少，所以要在主页面上优先提供最重要的信息，提供可以吸引浏览者注意的信息。本网站把个人日志放在内容区的主要位置。个人网站要想做大很难，所以就要在已有的基础上做出自己的特点。首先，网站定位要准确。个人网站最好走个性化路线，避开与大网站的正面竞争。网站要小而精，不要一来就搞个大而全的东西。其次，内容、观点要独特。内容是最好的推广载体，它的重要性不言而喻。最后，适当加些动画和交互功能。这样可以使浏览者记住你的网站，并用帮助推广你的网站。8网站设计基础与实例教程9.5网站主页设计效果图设计8网站设计基础与实例教程9.5网站主页设计效果图设计9网站设计基础与实例教程9.5网站主页设计效果图设计9网站设计基础与实例教程9.5网站主页设计主页制作用Fireworks完成效果图切片
本案例中的页面分割要进行的工作很少，主要是将一幅大的图片分割成三部分，分别用于页面顶部、导航、页面底部的背景图，起到上下辉映的效果。10网站设计基础与实例教程9.5网站主页设计主页制作10网站设计基础与实例教程9.5网站主页设计主页制作用Flash完成动画设计
网页中的动画已成为网站创立独特风格的重要手段，本案例中使用Flash的遮罩特效实现百叶窗效果。画面转换的时间要恰到好处，太快会使浏览者看不清楚要传达的信息，创意没有意义。太慢则感觉空洞、单调，使浏览者厌倦、注意力分散。11网站设计基础与实例教程9.5网站主页设计主页制作11网站设计基础与实例教程9.5网站主页设计主页制作用Flash完成动画设计
⑴打开FlashCS3并新建一文档。⑵修改文档属性，宽为210像素，高为130像素。⑶在图层1导入第一幅图片，并调整图片大小与场景1同大。⑷新建一图层，再导入第二幅图片，同样，调整到与场景1同大。⑸新建一元件，选择“影片剪辑”，命名为“矩形”。⑹在影片剪辑“矩形”中画一无线框的长矩形，长210高13，并让其中心对齐。⑺在第20帧处插入关键帧，将矩形尺寸改为210*1。⑻设置1－20帧为Shape（形状）动画。
12网站设计基础与实例教程9.5网站主页设计主页制作12网站设计基础与实例教程9.5网站主页设计主页制作用Flash完成动画设计
⑼新建一元件，选择“影片剪辑”，命名为“百叶窗”。⑽打开库面板，并拖出十个“矩形”影片剪辑，并整齐地排列，使其完全覆盖主场景。⑾回到场景1中，并新建一图层，命名为“百叶窗”。把“百叶窗”影片剪辑拖入进来，并中心对齐。⑿设置“百叶窗”层为遮罩层。⒀预览，导出。13网站设计基础与实例教程9.5网站主页设计主页制作13网站设计基础与实例教程9.5网站主页设计主页制作Javascript脚本设计
JavaScript使网页增加互动性。JavaScript使有规律地重复的HTML文段简化，减少下载时间。JavaScript能及时响应用户的操作，对提交表单做即时的检查，无需浪费时间交由CGI验证。JavaScript的特点是无穷无尽的，只要你有创意。
14网站设计基础与实例教程9.5网站主页设计主页制作14网站设计基础与实例教程9.5网站主页设计Javascript脚本设计
1.制作JavaScript时间特效之退出显示访问时间。编写代码fangWen=newDate();functionbye(){tuiChu=newDate();minutes=(tuiChu.getMinutes()-fangWen.getMinutes());seconds=(tuiChu.getSeconds()-fangWen.getSeconds());time=(seconds+(minutes*60));if(time==1){time=(time+"second");}else{time=(time+"seconds");}alert('您在这儿呆了'+time+'.欢迎再来!');}15网站设计基础与实例教程9.5网站主页设计Javascript脚本设计15网站设9.5网站主页设计Javascript脚本设计
1.制作JavaScript时间特效之退出显示访问时间。引用脚本<scriptsrc="others/tuichu.js"></script>把<body>区域改为<bodyonUnload="bye()">16网站设计基础与实例教程9.5网站主页设计Javascript脚本设计16网站设9.5网站主页设计Javascript脚本设计
2.制作JavaScript状态栏特效之动态显示状态栏。编写代码varmess="欢迎光临我的博客";varshiJian=300;//设置时间间隔seq=0;functionscroll(){len=mess.length;window.status=mess.substring(0,seq+1);//在状态栏上显示msg的第一到seq+1个字符，seq每次递加seq++;if(seq>=len){seq=0};//当seq的长度大于等于msg的字符长度时，seq=0window.setTimeout("scroll();",shiJian);//每个时间间隔调用一次scroll函数}
17网站设计基础与实例教程9.5网站主页设计Javascript脚本设计17网站设9.5网站主页设计Javascript脚本设计
2.制作JavaScript状态栏特效之动态显示状态栏。引用脚本<scriptsrc="others/scroll..js"></script>把<body>区域改为<bodyonload="scroll()"">18网站设计基础与实例教程9.5网站主页设计Javascript脚本设计18网站设9.5网站主页设计主页制作用Dreamweaver完成页面整合
19网站设计基础与实例教程9.5网站主页设计主页制作19网站设计基础与实例教程9.5网站主页设计主页制作用Dreamweaver完成页面整合
网页顶部设计1导航设计2“日志”设计3“相片”设计4“关于我”设计5“留言”设计6网页底部设计720网站设计基础与实例教程9.5网站主页设计主页制作网页顶部设计1导航设计2“日志”9.6网站子页设计
制作个人博客，要求页面设计美观大方、醒目明快，所以在子页设计中基本沿袭了主页的风格，只是在内容上做了些许改变。21网站设计基础与实例教程9.6网站子页设计制作个人博客，要求页面设计美观大9.6网站子页设计网页顶部设计1导航设计2网页主体设计3网页底部设计422网站设计基础与实例教程9.6网站子页设计网页顶部设计1导航设计2网页主体设计3网页谢谢23网站设计基础与实例教程谢谢23网站设计基础与实例教程第9章个人网站——我的博客24网站设计基础与实例教程第9章个人网站——我的博客1网站设计基础与实例教程9.1网页效果图主页效果图25网站设计基础与实例教程9.1网页效果图主页效果图2网站设计基础与实例教程9.1网页效果图子页效果图26网站设计基础与实例教程9.1网页效果图子页效果图3网站设计基础与实例教程9.2客户需求“博客”一词是从英文单词Blog音译而来，一种表达个人思想和网络链接，内容按照时间顺序排列，并且不断更新的出版方式。
个人博客（个人网站）的作用有以下几点：作为网络个人日记；个人展示自己某个方面的空间；网络交友的地方；学习交流的地方；通过博客赚外快；通过博客展示自己的企业形象或企业商务活动信息。27网站设计基础与实例教程9.2客户需求“博客”一词是从英文单词Blog9.2客户需求
对于个人博客，客户往往都希望能够制作出既美观又能彰显自己风格的页面，这就要求做到以下几点：1．简洁为美：博客的装饰尽量简单，放弃那些不实的设计，即使要有也不要因为装饰影响到文章的阅读。2．要有自己的见解：对于某个事物你必须有自己的态度；对于你提供的信息和内容，必须做到真实、广博、生动、高品位；转载别人的文章要写名出处，无法查究出处的要写明转载。3．结构清晰：可分为个人区域（如个人介绍、日志等）、交际区域（如好友、留言等）和服务区域（如音乐、视频、新闻等）。４．持续更新：做到至少一个星期更新一次，隔几天最好。28网站设计基础与实例教程9.2客户需求对于个人博客，客户往往都希望能够9.3页面风格定位
个人博客的风格定位相对容易，主要取决于作者的性格、喜好，总体上来讲体现为以下四个方面：
1.颜色风格：选择一种体现个人形象、延伸个人内涵的色彩。
2.字体风格：一般网页默认的字体是宋体。为了体现站点的“与众不同”和特有风格，可以根据需要选择一些特别字体。
3.内容风格：布局简单明了，内容清新，栏目齐全便于交流。
4.语言风格：通俗易懂，便于沟通与交流。29网站设计基础与实例教程9.3页面风格定位个人博客的风格定位相对容易，主9.4网站建设方案网站建设方案包括以下几个部分：客户情况分析；网站需要实现的目的和目标；网站形象说明；网站的栏目板块和结构；网站内容的安排，相互链接关系；使用软件、硬件和技术分析说明；开发时间进度表；宣传推广方案；维护方案；制作费用；本公司简介：成功作品，技术，人才说明等。30网站设计基础与实例教程9.4网站建设方案网站建设方案包括以下几个部分：7网站9.5网站主页设计效果图设计个人网站比较简单，内容信息较少，往往是利用空闲时间来发展网站，这就造成了投入网站的人力和时间都非常有限，网页布局结构比较单一。由于网站面向的浏览者也相对较少，所以要在主页面上优先提供最重要的信息，提供可以吸引浏览者注意的信息。本网站把个人日志放在内容区的主要位置。个人网站要想做大很难，所以就要在已有的基础上做出自己的特点。首先，网站定位要准确。个人网站最好走个性化路线，避开与大网站的正面竞争。网站要小而精，不要一来就搞个大而全的东西。其次，内容、观点要独特。内容是最好的推广载体，它的重要性不言而喻。最后，适当加些动画和交互功能。这样可以使浏览者记住你的网站，并用帮助推广你的网站。31网站设计基础与实例教程9.5网站主页设计效果图设计8网站设计基础与实例教程9.5网站主页设计效果图设计32网站设计基础与实例教程9.5网站主页设计效果图设计9网站设计基础与实例教程9.5网站主页设计主页制作用Fireworks完成效果图切片
本案例中的页面分割要进行的工作很少，主要是将一幅大的图片分割成三部分，分别用于页面顶部、导航、页面底部的背景图，起到上下辉映的效果。33网站设计基础与实例教程9.5网站主页设计主页制作10网站设计基础与实例教程9.5网站主页设计主页制作用Flash完成动画设计
网页中的动画已成为网站创立独特风格的重要手段，本案例中使用Flash的遮罩特效实现百叶窗效果。画面转换的时间要恰到好处，太快会使浏览者看不清楚要传达的信息，创意没有意义。太慢则感觉空洞、单调，使浏览者厌倦、注意力分散。34网站设计基础与实例教程9.5网站主页设计主页制作11网站设计基础与实例教程9.5网站主页设计主页制作用Flash完成动画设计
⑴打开FlashCS3并新建一文档。⑵修改文档属性，宽为210像素，高为130像素。⑶在图层1导入第一幅图片，并调整图片大小与场景1同大。⑷新建一图层，再导入第二幅图片，同样，调整到与场景1同大。⑸新建一元件，选择“影片剪辑”，命名为“矩形”。⑹在影片剪辑“矩形”中画一无线框的长矩形，长210高13，并让其中心对齐。⑺在第20帧处插入关键帧，将矩形尺寸改为210*1。⑻设置1－20帧为Shape（形状）动画。
35网站设计基础与实例教程9.5网站主页设计主页制作12网站设计基础与实例教程9.5网站主页设计主页制作用Flash完成动画设计
⑼新建一元件，选择“影片剪辑”，命名为“百叶窗”。⑽打开库面板，并拖出十个“矩形”影片剪辑，并整齐地排列，使其完全覆盖主场景。⑾回到场景1中，并新建一图层，命名为“百叶窗”。把“百叶窗”影片剪辑拖入进来，并中心对齐。⑿设置“百叶窗”层为遮罩层。⒀预览，导出。36网站设计基础与实例教程9.5网站主页设计主页制作13网站设计基础与实例教程9.5网站主页设计主页制作Javascript脚本设计
JavaScript使网页增加互动性。JavaScript使有规律地重复的HTML文段简化，减少下载时间。JavaScript能及时响应用户的操作，对提交表单做即时的检查，无需浪费时间交由CGI验证。JavaScript的特点是无穷无尽的，只要你有创意。
37网站设计基础与实例教程9.5网站主页设计主页制作14网站设计基础与实例教程9.5网站主页设计Javascript脚本设计
1.制作JavaScript时间特效之退出显示访问时间。编写代码fangWen=newDate();functionbye(){tuiChu=newDate();minutes=(tuiChu.getMinutes()-fangWen.getMinutes());seconds=(tuiChu.getSeconds()-fangWen.getSeconds());time=(seconds+(minutes*60));if(time==1){time=(time+"second");}else{time=(time+"seconds");}alert('您在这儿呆了'+time+'.欢迎再来!');}38网站设计基础与实例教程9.5网站主页设计Javascript脚本设计15网站设9.5网站主页设计Javascript脚本设计
1.制作JavaScript时间特效之退出显示访问时间。引用脚本<scriptsrc="others/tuichu.js"></script>把<body>区域改为<bodyonUnload="bye()">39网站设计基础与实例教程9.5网站主页设计Javascript脚本设计16网站设9.5网站主页设计Javascript脚本设计
2.制作JavaScript状态栏特效之动态显示状态栏。编写代码varmess="欢迎光临我的博客";varshiJian=300;//设置时间间隔seq=0;functionscroll(){len=mess.length;window.status=mess.substring(0,seq+1);//在状态栏上
温馨提示
- 1. 本站所有资源如无特殊说明，都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
- 2. 本站的文档不包含任何第三方提供的附件图纸等，如果需要附件，请联系上传者。文件的所有权益归上传用户所有。
- 3. 本站RAR压缩包中若带图纸，网页内容里面会有图纸预览，若没有图纸预览就没有图纸。
- 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
- 5. 人人文库网仅提供信息存储空间，仅对用户上传内容的表现方式做保护处理，对用户上传分享的文档内容本身不做任何修改或编辑，并不能对任何下载内容负责。
- 6. 下载文件中如有侵权或不适当内容，请与我们联系，我们立即纠正。
- 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。
最新文档
- 编导创业团队介绍
- 水电工程环境治理- 合同责任与义务
- 纺织品购销合同样本
- 股权质押合作借款协议合同
- 耳鼻咽喉科课件
- 智能家居采购合同范本
- 大型工厂蒸汽供应设备采购合同2025
- 汽车行业劳动合同模板大全
- 洗刷刷创意画课件
- 技术顾问合作合同文本
- 广东省中山市2024-2025学年九年级上学期期末语文试题
- 装饰装修木工施工合同
- “轻松前行压力不再”-高中生压力管理与情绪调节 课件-2024-2025学年高二下学期压力管理与情绪调节班会
- 2025年全球及中国双金属氰化物(DMC)催化剂行业头部企业市场占有率及排名调研报告
- 开源社区治理模型-深度研究
- Unit5Amazing nature 说课稿（6课时） -2024-2025学年外研版（2024）英语七年级下册
- GB/T 44927-2024知识管理体系要求
- 2025年国家林业和草原局直属事业单位招聘应届毕业生231人历年高频重点提升（共500题）附带答案详解
- 跨栏跑技术教学课件
- 2025年江苏无锡市第九人民医院招考聘用高频重点提升（共500题）附带答案详解
- 湖北省武汉市2024-2025学年度高三元月调考英语试题（含答案无听力音频有听力原文）
评论
0/150
提交评论