首页 静态网页设计与制作 教学课件 作者 胡汉辉 模块一

静态网页设计与制作 教学课件 作者 胡汉辉 模块一

举报
开通vip

静态网页设计与制作 教学课件 作者 胡汉辉 模块一正文主编1.1任务一创建“我的第一个页面”1.2任务二创建与管理站点1.3拓展训练创建“我的班级”站点2.1任务一文本的输入——创建“养生保健”页面2.2任务二图像的添加——创建“ASA餐厅”页面2.3拓展训练创建“我的个人网站”的首页3.1任务一Flash元素的添加——创建“江河双水湾”页面3.2任务...

静态网页设计与制作 教学课件 作者 胡汉辉 模块一
正文主编1.1任务一创建“我的第一个页面”1.2任务二创建与管理站点1.3拓展训练创建“我的班级”站点2.1任务一文本的输入——创建“养生保健”页面2.2任务二图像的添加——创建“ASA餐厅”页面2.3拓展训练创建“我的个人网站”的首页3.1任务一Flash元素的添加——创建“江河双水湾”页面3.2任务二音乐和视频的添加——创建“音乐中心”页面3.3拓展训练创建“我的个人活动展示”页面和“个人相册”页面4.1任务一创建“绿之韵”页面间链接4.2任务二导航栏的制作——创建“绿之韵”页面导航栏4.3拓展训练创建“瑶瑶之旅”的导航栏与网页间链接5.1任务一使用层布局网页——创建“拼图游戏”页面5.2任务二使用框架布局网页——创建“我的音乐小站”页面5.3任务三CSS的应用——重新布局“在线求诊”页面5.4拓展训练创建“雷锋精神宣传”网页6.1任务一制作搜索和用户登录 关于同志近三年现实表现材料材料类招标技术评分表图表与交易pdf视力表打印pdf用图表说话 pdf 单——创建“探索旅行网”首页6.2任务二创建列表/菜单表单——创建“机票查询”页面6.3任务三使用单选按钮和复选框——创建“网站活动”页面6.4任务四校验表单内容——创建“驴友留言”页面6.5拓展训练为“我的个人网站”增加会员登录、会员注册和会员留言页面7.1任务一网站的配色方案与版式设计——创建“羽翱科技”页面7.2任务二使用模板和库——创建“羽翱科技”页面的模板7.3任务三使用网页特效——为“羽翱科技”各网页增加特效7.4拓展训练为“我的个人网站”各网页增加特效并进行整体风格调整1.1任务一创建“我的第一个页面”任务 分析 定性数据统计分析pdf销售业绩分析模板建筑结构震害分析销售进度分析表京东商城竞争战略分析 相关知识任务实施1.1.1DreamweaverCS3的工作界面1.1.2设计LOGO任务分析相关知识1.Web相关知识(1)Web介绍(2)HTML(3)浏览器(4)URL1)http://HTTP服务器,用于提供超文本信息服务的Web服务器。2)telnet://Telnet服务器,供用户远程登录使用的计算机。3)ftp://FTP服务器,用于提供各种普通文件和二进制代码文件的服务器。4)gopher://Gopher服务器。5)wais://Wais服务器。6)news://网络新闻USENET服务器。相关知识2.网站的开发流程为了加快网站建设的速度和减少失误,应该采用一定的制作流程来策划、设计、制作和发布网站。通过使用制作流程确定制作步骤,以确保每一步顺利完成。好的制作流程能帮助设计者解决策划网站的烦琐性,减小项目失败的风险。网站设计主要分为三个阶段,如图1-1所示。图1-1网站开发流程(1)确定主 快递公司问题件快递公司问题件货款处理关于圆的周长面积重点题型关于解方程组的题及答案关于南海问题 相关知识(2)收集资料(3)规划网站1)确定网页结构。2)确定网页的信息组织和管理方式。3)确定信息的存储方法。4)文档版本的控制。5)确保结构的完整性和一致性。1)页面尺寸:影响页面尺寸的因素、页面尺寸设计的基本要求。2)整体造型:整体造型的意义、整体造型的基本方法。3)页眉:页眉的作用、页头的作用。4)文本:文本设计的意义。5)页脚:页脚的意义。相关知识6)图片:使用图片的意义。7)多媒体:使用多媒体的意义。(4)制作网站1)建立本地站点。2)在站点根文件夹下创建子文件夹。3)向站点添加所需要的空网页。4)设计网页尺寸。5)设置网页属性,包括网页标题、背景图像、背景颜色、链接颜色、文字颜色等。6)向网页中插入文本、图像、动画等。7)建立所有链接。8)预览和保存网页。相关知识(5)测试与上传(6)推销网站(7)维护网站任务实施1.1.1DreamweaverCS3的工作界面正文_Embed_2.emf图1-2DreamweaverCS3工作界面1.1.1DreamweaverCS3的工作界面1.菜单栏菜单栏提供了各种操作的标准菜单命令,它由【文件】、【编辑】、【查看】、【插入记录】、【修改】、【文本】、【命令】、【站点】、【窗口】和【帮助】10个菜单命令组成。2.“插入”面板在“插入”面板中包含了可以向网页文档添加的各种元素,如文字、图像、表格、按钮、导航以及程序等。图1-3【插入】面板1.1.1DreamweaverCS3的工作界面图1-4“常用”类别图1-5“布局”类别图1-6“表单”类别图1-7“数据”类别1.1.1DreamweaverCS3的工作界面图1-8“Spry”类别图1-9“文本”类别图1-10“收藏夹”类别1.1.1DreamweaverCS3的工作界面图1-11“自定义收藏夹对象”对话框3.文档工具栏1.1.1DreamweaverCS3的工作界面文档工具栏主要包含了一些对文档进行常用操作的功能按钮,通过单击这些按钮可以在文档的不同视图模式间进行快速切换,如图1-12所示。图1-12文档工具栏正文_Embed_13.png正文_Embed_14.png正文_Embed_15.png正文_Embed_16.png4.文档窗口1.1.1DreamweaverCS3的工作界面文档窗口也就是设计区,是DreamweaverCS3进行可视化编辑网页的主要区域,可以显示当前文档的所有操作效果,如插入文本、图像、动画等。5.“属性”面板在“属性”面板中可以查看并编辑页面上文本或对象的属性,如图1-13所示。该面板中显示的属性通常对应于标签的属性,更改属性通常与在代码视图中更改相应的属性具有相同的效果。图1-13“属性”面板1.1.1DreamweaverCS3的工作界面6.面板组图1-14面板组1.1.2设计LOGO1)88×31:这是互联网上最普遍的LOGO 规格 视频线规格配置磁共振要求常用水泵型号参数扭矩规格钢结构技术规格书 。2)120×60:这种规格用于一般大小的LOGO。3)120×90:这种规格用于大型LOGO。1)符合国际标准。2)精美、独特。3)与网站的整体风格相融。4)能够体现网站的类型、内容和风格。1.2任务二创建与管理站点任务分析相关知识任务实施1.2.1创建本地站点1.2.2管理站点1.2.3管理站点文件和文件夹任务分析相关知识任务实施1.2.1创建本地站点1.使用向导建立站点使用向导建立站点的步骤如下。1)打开建立站点向导,有以下3种方法。①在进入DreamweaveCS3的起始页面中选择【新建】→【Dreamweaver站点】命令,如图1-15所示。②选择【站点】菜单中的【新建】→【站点】命令。③选择【站点】菜单中的【管理站点】命令,打开如图1-16所示的“管理站点”对话框,单击【新建】按钮。2)打开“站点定义为”对话框,在“您打算为您的站点起什么名字”文本框中输入站点名字,如“musicweb”。1.2.1创建本地站点正文_Embed_19.png1.2.1创建本地站点正文_Embed_20.png图1-15起始页中新建站点图1-16“管理站点”对话框1.2.1创建本地站点3)单击【下一步】按钮,系统将询问“是否使用服务器技术”,若是静态站点则选择“否,我不想使用服务器技术”,若是动态站点可以进一步设置使用哪一种服务器技术。图1-17设置站点名和URL地址1.2.1创建本地站点图1-18选择是否使用服务器技术4)单击【下一步】按钮,1.2.1创建本地站点在“您将把文件存储在计算机上的什么位置?”文本框中直接输入站点根目录的路径,或者单击“浏览”按钮,选择文件夹目录,如图1-19所示。正文_Linked_23.jpg1.2.1创建本地站点5)单击【下一步】按钮,在“您如何连接到远程服务器”对话框中选择一种连接到远程服务器的方式,这里选择“无”,如图1-20所示。图1-19选择站点文件夹目录1.2.1创建本地站点图1-20选择连接到远程服务器的方式6)单击【下一步】按钮,将显示前几步设置的 总结 初级经济法重点总结下载党员个人总结TXt高中句型全总结.doc高中句型全总结.doc理论力学知识点总结pdf ,1.2.1创建本地站点若需修改可单击【上一步】按钮返回重新设置,若确定设置则单击【完成】按钮,如图1-21所示。正文_Embed_26.png1.2.1创建本地站点正文_Embed_27.png图1-21列出设置总结图1-22站点目录结构2.使用高级设置建立站点1.2.1创建本地站点使用高级设置建立站点的第一步同前,在如图1-23所示的“musicweb的站点定义为”对话框中切换到“高级”选项卡。在左边的“分类”中选择“本地信息”,然后分别设置“站点名称”、“本地根文件夹”、“默认图像文件夹”、“HTTP地址”等信息。若有需要还可以在左边的“分类”中选择其他项目进行设置,完成以后单击【确定】按钮,即可创建站点。图1-23站点的“高级”选项卡1.2.2管理站点1.编辑站点如果要重新设置站点的属性,可以执行以下步骤:1)选择【站点】→【管理站点】命令。2)从站点列表中选择要编辑的站点名称,单击【编辑】按钮。3)编辑完毕后,单击【确定】按钮,返回到“管理站点”对话框,单击【完成】按钮。2.复制站点如果要创建多个结构相同或相似的站点,可以利用站点的复制功能,具体步骤如下:1)选择【站点】→【管理站点】命令。1.2.2管理站点2)从列表中选择要复制的站点名称,单击【复制】按钮。3)若要对复制的站点进行编辑,可以从站点列表中选中新复制的站点,单击【编辑】按钮,编辑完成返回到“管理站点”对话框,单击【完成】按钮。3.删除站点如果某个站点在Dreamweaver中不再需要编辑了可以删除该站点,具体步骤如下:1)选择【站点】→【管理站点】命令。2)从列表中选择要删除的站点名称,单击【删除】按钮。3)在弹出的提示对话框中,单击【是】按钮,即可删除选定的站点。1.2.2管理站点4.导出站点如果要将站点移植到其他计算机或其他版本的软件中,或要与其他用户共享站点设置的话,可以使用导出站点功能,具体步骤如下:1)选择【站点】→【管理站点】命令。2)从列表中选择要导出的站点名称,单击【导出】按钮。3)在弹出的“导出站点”对话框中,设置导出文件名和保存位置,单击【保存】按钮。4)返回“管理站点”对话框,单击【完成】按钮。5.导入站点1.2.2管理站点对于已导出的站点,或者从其他用户处获得的共享站点设置文件,可以在Dreamweaver中导入该站点,对导入的站点可以像其他创建的站点一样进行编辑操作。导入站点步骤如下:1)选择【站点】→【管理站点】命令。2)在“管理站点”对话框中单击【导入】按钮。3)在弹出的“导入站点”对话框中,选择要导入的站点,单击【打开】按钮。4)返回“管理站点”对话框,单击【完成】按钮。1.2.3管理站点文件和文件夹1.建立站点文件夹在已建立好的站点中,一般还需要建立一些子文件夹,用于分类存放网站中的图像、网页、模板等文件。1)在“文件”面板中,单击鼠标右键,在弹出的快捷菜单中选择【新建文件夹】命令,如图1-24所示。2)“文件”面板上出现默认的文件夹,修改其名字用于存放网站资料,如图1-25所示。正文_Embed_29.png1.2.3管理站点文件和文件夹正文_Embed_30.png图1-24站点子文件夹的建立图1-25站点子文件夹的命名3)按照上述两步骤依次建立其他需要的文件夹,如图1-26所示。1.2.3管理站点文件和文件夹正文_Embed_31.png1.2.3管理站点文件和文件夹正文_Embed_32.png图1-26其他文件夹的建立图1-27对文件夹的编辑1.2.3管理站点文件和文件夹2.建立站点文件主页是浏览者登录网站后显示的第一个页面。主页文件一般命名为index.html。其他网页文件应该放在指定的子文件夹下,便于管理。1)在“文件”面板中单击鼠标右键,在弹出的快捷菜单中选择【新建文件】命令,如图1-28所示。2)将建立的文件命名为“index.html”,如图1-29所示。正文_Embed_33.png1.2.3管理站点文件和文件夹正文_Embed_34.png图1-28首页的建立图1-29首页的命名1.2.3管理站点文件和文件夹正文_Embed_35.png图1-30利用【文件】菜单建立网页文件1.2.3管理站点文件和文件夹图1-31“新建文档”对话框1.2.3管理站点文件和文件夹图1-32命名文件并保存1.2.3管理站点文件和文件夹正文_Embed_38.png1.2.3管理站点文件和文件夹正文_Embed_39.png图1-33通过起始对话框创建网页图1-34其他文件的建立效果图1)主页文件必须存放在本地站点根文件夹下。1.2.3管理站点文件和文件夹2)网页文件名、文件夹名和网站内的其他文件名一般使用小写英文字母,因为Dreamweaver不识别中文文件名,并且有些网站服务器要区分字母大小写。1.3拓展训练创建“我的班级”站点设计要求设计思路参考效果设计要求设计思路1)建立站点。2)建立站点内文件夹,分类管理素材、文件。3)建立首页。4)建立其他网页文件。参考效果图1-35“我的班级”站点示意图
本文档为【静态网页设计与制作 教学课件 作者 胡汉辉 模块一】,请使用软件OFFICE或WPS软件打开。作品中的文字与图均可以修改和编辑, 图片更改请在作品中右键图片并更换,文字修改请直接点击文字进行修改,也可以新增和删除文档中的内容。
该文档来自用户分享,如有侵权行为请发邮件ishare@vip.sina.com联系网站客服,我们会及时删除。
[版权声明] 本站所有资料为用户分享产生,若发现您的权利被侵害,请联系客服邮件isharekefu@iask.cn,我们尽快处理。
本作品所展示的图片、画像、字体、音乐的版权可能需版权方额外授权,请谨慎使用。
网站提供的党政主题相关内容(国旗、国徽、党徽..)目的在于配合国家政策宣传,仅限个人学习分享使用,禁止用于任何广告和商用目的。
下载需要: 免费 已有0 人下载
最新资料
资料动态
专题动态
个人认证用户
在线教务服务
暂无简介~
格式:ppt
大小:1MB
软件:PowerPoint
页数:0
分类:工学
上传时间:2020-01-02
浏览量:7