本文目录
- 静态网页设计
- 静态网页设计与制作热点工具的用途
- 静态网页和动态网页在制作与页面效果上有何区别
- 简要叙述静态网站制作的主要步骤
- 怎么做一个静态网站
- 静态网页
静态网页设计
我把网上最主流的网页/网站制作工具都列出来了其中第1、2是主要制作工具,后面的多是辅助工具3、6是比较容易上手的另外最简单的静态页面其实可以用word制作,保存成html就可以你可以试试1、FrontPage FrontPage是一款优秀的网页制作与开发工具之一,它本身也是Office2000中的一个重要组件,采用了与Office2000其他组件一致的界面和操作方式,只要您使用过Office软件,就可以轻松掌握FrontPage的用法。 2、网页制作三剑客 Flash、Dreamweaver、Fireworks合在一起被称为网页制作三剑客。这三个软件相辅相承,是制作网页的首选工具,其中Dreamweaver主要用来制作网页文件,制作出来的网页兼容性好、制作效率也很高,Flash用来制作精美的网页动画,Fireworks用来处理网页中的图形。 3、Photoshop Photoshop是Adobe公司的王牌产品,无论是在平面广告设计、室内装潢,还是处理个人数码照片方面,Photoshop都已经成为不可或缺的工具。在网页制作方面,它多姿多彩的滤镜和功能强大的选择工具可以做出各种各样的文字效果来。 4、Swishmax Swish是一款非常方便的Flash文字特效制作工具,你只要点几下鼠标,就可以创造出形状、文字、按钮动画,你也可以选择内建的超过230种诸如爆炸、漩涡、3D旋转以及波浪等预设的动画效果。 5、PhotoImpact PhotoImpact提供了多媒体时代专业影像设计者最直觉的创意空间、最方便的制作工具、及最宽广的表达形式,整合了新时代的3D物件及文字特效与粒子效果、压力笔支援、不同的自然笔触、各式直觉操作的特效图库、以及网页影像与办公室文件的相容性,将构思到表达的过程完整组合,是专业网页影像设计者不可或缺的利器。 6、Sound Forge Sound Forge软件是一款非常棒的音效编辑软件,它除了音效编辑软件的功能外,还可以让你处理大量的音效转换的工作,使你能够轻松的完成各种看似复杂的音效编辑工作。如果下载的是英文版,可以用金山快译永久汉化,但效果不是很尽人意。 7、硕思闪客精灵 硕思闪客精灵是一款用于浏览和解析Flash动画的工具。它可以将.swf文件导出成.fla文件,还能将flash动画中的图片、矢量图、声音、视频(*.flv)、文字、按钮、影片片段、帧等基本元素完全分解,以及对动作脚本(ActionScript)进行解析,清楚的显示其动作代码,让你对Flash动画的构造一目了然。建议你赶快去下载吧!} 8、Clipyard 你只要导入不同的Flash动画文件,将其放在不同的层上,经调试效果,导出后就成了一个单独的flash了,操作简单,特别适合于将自己喜欢的Flash动画加入祝福、签名后赠送友人。 9、FlashFXP 是一款优秀的FTP工具,特别适合Web站点管理员使用。支持文件夹(带子文件夹)的文件传送、删除;支持上传、下载及第三方文件续传;可以跳过指定的文件类型,只传送需要的文件;可以自定义不同文件类型的显示颜色;可以缓存远端文件夹列表,支持FTP代理;具有避免空闲功能,防止被站点踢出;可以显示或隐藏“隐藏”属性的文件、文件夹;支持每个站点使用被动模式等。 10、FlaX FlaX是一款制作Flash文字特效的小巧软件。在以前若要制作文字绕圆圈的动画,在Flash里一个一个字的慢慢调整位置,颇费时间,如果使用FlaX很快就可以就搞定。 FlaX有四个窗口面板:预览窗口、影片属性面板、文字属性面板、特效属性面板。 11、Web Animator Web Animator(网页动画设计)是HomePage Builder附带的创建动画GIF的程序。所谓动画GIF是GIF格式图像文件的一种,组合几个图像象漫画一样连续运动。动画GIF与普通的GIF图像一样可以粘贴到页面。使用Web Animator可以完成如下工作:组合现有的图像,创建类似于漫画的动画;给一个图像添加动画效果,创建具有效果的动画;给指定的字符串添加动画效果,创建字符动画。12.goliveAdobe收购mm之后推出的网页制作工具,将代替Dreamweaver成为主流.满意请采纳。
静态网页设计与制作热点工具的用途
静态网页的布局模式主要有:1、表格布局2、层布局3、div+css样式表布局4、布局表格等备注:1、表格布局容易把握,是最简单的一种总局方式,适用于初学者。设计网页的第一步是设计版面布局。所谓布局,就是以最适合浏览的方式将图片、文字以及表单等元素排放在页面的不同位置。网页设计常用布局方法是表格布局。另外一种方便的工具,就是使用框架。框架的作用就是把浏览器窗口划分为若干个区域,每个区域可以分别显示不同的网页。案例:①在网页中插入表格,不显示边框只用来布局;②在单元格内插入文字、·图片,设置丰富的效果;③通过拆分单元格或者插入嵌套表格来细化某些单元格内部的布局。2、层布局较难把握,经常会受屏幕的分辨率影响,网页中很少用,主要用于浮动广告。3、div+css样式表布局,难度较大,作者需了解一定数量的html代码。是应用较广泛的一种,也是最难的一种布局。一、准备一张图片。准备一张需要给不同区域添加不同热点的图片。二、插入图片:打开Dreamweaver,新建一个网页,将图片插入到页面中。三、找到地图工具:单击鼠标左键点击图片,这时候软件下方的属性面板就会变成和图片相关的属性,注意看左下角部分,如图一中的红色框内所示。 注:如果没有上图显示的热点地图工具,是地图工具属性隐藏了,可以点击属性面板右侧的三角符号打开,如下图:四、绘制热点:注意方块、圆形、多边形三个小图标,它们就是我们要用的“图片热点”工具,不同的热点工具可以绘制出不同形状的热点区域。先点击方块按钮,将鼠标移动到图片上,这时候鼠标就变成了十字,在你想加链接的地方画一个方块。添加热点后的图片区域会出现一个浅蓝色蒙版,意味着该区域已经添加了热点。依次添加其他区域的热点。五、给热点添加链接:热点区域画好后,下面的属性面板就会变成该热点区域的属性,如下图:“链接”就是点击此处跳转的链接地址;“目标”就是点击此处时窗口的打开方式;“替换”就是鼠标悬浮在该区域时提示的文字。一般使用“_blank“,指超链接将在新窗口打开。注:可以采用画一个区域,添加对应的连接,也可以依次把所有的区域热点画完,然后点击热点区域,依次添加对应的连接。初学者建议一个一个的添加。六、修改热点:对热点区域进行拖动或者局部调整如果需要修改热点区域,或者需要进行微调,如中国地图添加热点,不可能把所有的热点区域都做到刚好覆盖对应的区域,那就需要对已经添加热点的区域进行调整。点击热点区域,热点区域四周会出现浅蓝色的点。光标放在浅蓝色的点,点击鼠标左键,即可调整热点区域的大小。七、对个图片添加热点:如果一个页面中有多个图片需要添加热点,那么久需要给每一张图片对应的热点设置不同的热点名称,如图示,地图(M)处的文本框中的字符就是当前热点的名称。可以使用map1、map2、map3。。。也可以使用不同图片的内容对热点进行命名,如top_map,foot_map,act_map。。。总之,不同图片的热点名称不同即可。
静态网页和动态网页在制作与页面效果上有何区别
静态网页与动态的区别 ��程序是否在服务器端运行,是重要标志。在服务器端运行的程序、网页、组件,属于动态网页,它们会随不同客户、不同时间,返回不同的网页,例如ASP、PHP、JSP、ASP.net、CGI等。运行于客户端的程序、网页、插件、组件,属于静态网页,例如html页、Flash、JavaScript、VBScript等等,它们是永远不变的。 静态网页和动态网页各有特点,网站采用动态网页还是静态网页主要取决于网站的功能需求和网站内容的多少,如果网站功能比较简单,内容更新量不是很大,采用纯静态网页的方式会更简单,反之一般要采用动态网页技术来实现。 静态网页是网站建设的基础,静态网页和动态网页之间也并不矛盾,为了网站适应搜索引擎检索的需要,即使采用动态网站技术,也可以将网页内容转化为静态网页发布。 动态网站也可以采用静动结合的原则,适合采用动态网页的地方用动态网页,如果必要使用静态网页,则可以考虑用静态网页的方法来实现,在同一个网站上,动态网页内容和静态网页内容同时存在也是很常见的事情。 我们将动态网页的一般特点简要归纳如下: (1)动态网页以数据库技术为基础,可以大大降低网站维护的工作量; (2)采用动态网页技术的网站可以实现更多的功能,如用户注册、用户登录、在线调查、用户管理、订单管理等等; (3)动态网页实际上并不是独立存在于服务器上的网页文件,只有当用户请求时服务器才返回一个完整的网页; (4)动态网页中的“?”对搜索引擎检索存在一定的问题,搜索引擎一般不可能从一个网站的数据库中访问全部网页,或者出于技术方面的考虑,搜索蜘蛛不去抓取网址中“?”后面的内容,因此采用动态网页的网站在进行搜索引擎推广时需要做一定的技术处理才能适应搜索引擎的要求 什么是静态网页?静态网页有哪些特点? 在网站设计中,纯粹HTML格式的网页通常被称为“静态网页”,早期的网站一般都是由静态网页制作的。 静态网页的网址形式通常为: 我们将静态网页的特点简要归纳如下: (1)静态网页每个网页都有一个固定的URL,且网页URL以.htm、.html、.shtml等常见形式为后缀,而不含有“?”; (2)网页内容一经发布到网站服务器上,无论是否有用户访问,每个静态网页的内容都是保存在网站服务器上的,也就是说,静态网页是实实在在保存在服务器上的文件,每个网页都是一个独立的文件; (3)静态网页的内容相对稳定,因此容易被搜索引擎检索; (4)静态网页没有数据库的支持,在网站制作和维护方面工作量较大,因此当网站信息量很大时完全依靠静态网页制作方式比较困难; (5)静态网页的交互性交叉,在功能方面有较大的限制 第一看后缀名,第二看是否能与服务器发生交互行为
简要叙述静态网站制作的主要步骤
一、整理规划。网站建设的开始就应该有一个整体的战略目标,即确定站点的目标。首先要有一个总的目标,这个网站到底是要做什么。有的要显示自己的设计水平,这就要求页面美观;有的是为了求职而设计的求职网站,这就要求提供足够的信息让别人了解你的工作能力;有的是要为用户服务,这就要求网站有较强的互动性,而本站建设之初的主要目的就是为了本人更好的学习网络知识,只是兴趣而已,确定好目标之后,还要决定网站的目标观众。二、新建站点规划好站点之后,就可以用专门的网页开发软件创建站点了。三、收集资源确定好站点目标和结构之后,接下来要做的就是收集有关网站的资源。四、布局页面设计站点结构和收集了足够的资源之后,就可以开始布局页面了。在Dreamweaver中,可以通过以下手段进行排版五、编辑文档与超级连接经过上面的几个步骤之后,一切准备工作都已经就绪,现在可以像装箱一样把收集到的资料及制作的组件放到页面布局中为它们指定的位置上了。六、发布站点站点的发布网站发布就是把网站上传到因特网上,以提供浏览者浏览。站点的维护站点发布之后还要经常对站点进行维护。站点维护是指不断优化网站功能和更新网页内容。维护网站的目的是使网站的结构规划合理、内容与形式统一、主题鲜明,经常更新网页内容,让网站与时俱进。
怎么做一个静态网站
下载Dreamweaver.exe并打开,选择你使用的编辑语言,本案例用html
一、打开页面后,选着设计窗口,如图所示。设计窗口可以快速布局网页,不需要自己编辑代码。
二、打开你要设计的网页的设计图,本经验是百度经验首页为例,首先我们制作顶上的搜索条,点击插入—表格(如图所示)。打开表格属性编辑表格属性。插入1行和5列,表格宽度为1130,(即为网页的宽度),边距,间距分别为0,此表格只是为了定位,因此不设边框。
三、设置好表格后,可在表格里面插入你的内容,首先我们插入logo,点击插入—图像—选择你要插入的图片。点确定即可完成logo插入。表格的小大高度都可根据设计图需要调整,鼠标移到表格边框虚线即可拖拉调整高度或宽度。如图所示
接下来我们来做搜索框,点击插入—表单—插入文本域—确定。插入文本框后可点击文本框调整文本框的属性。根据设计图,文本框上班还要添加内容,因此,可选择单元格右击选择表格—拆分单元格,此处是需要添加一行的内容,因此拆分为两行,如图所示。
四、用同样的办法拆分上面的行,因为要添加10个选择项,因此拆分为10列(右击选中的行—拆分单元格—10列—确定)。拆分好后在小格里面添加文字内容即可。表格大小可根据步骤四调整。
五、接下来我们做搜索按钮,同样根据设计图要把表格拆分为两行。点击插入插入按钮的图片。
六、接下来给按钮添加链接,本次经验分享的是静态网页,因此在此先跟大家分享怎么直接添加按钮链接。同样是点击插入—添加超级链接,填写你事先做好的页面链接,或者其他网站链接。
七、剩下的内容都可根据方法步奏逐渐添加,调节细节即可完成你想要设计的网页。如图所示是上面步奏所做的静态页面,把所有做好的网页用超级链接链接起来即可做成一个简单的网站。
静态网页
1. 网页中的对象(图像、图片、音乐)通过什么方式与HTML文档发生联系,如何才能保证在复制网页时不遗漏相关文档? 网页中的对象(图像、图片、音乐)通过链接方式与HTML文档发生联系,在HTML文档中仅包含文本、格式等信息,网页中包含的其他对象都以独立文件的形式存储在磁盘上,HTML文档通过链接方式把这些文件组织在一起。 为了保证复制网页时不遗漏相关文档,需要把所有文档以相对路径方式组织到统一的HTML体系中。为此,需要为一个网站项目建立站点,利用网页设计软件(例如Dreamweaver)对所有的链接文件进行统一管理。 2. 在网页设计中,主要有哪些布局方式,各有何特点? 在网页设计中,主要的布局方式有表格布局、层布局和框架布局。其中表格布局借助表格实现页面布局,把对表格的约束直接书写在HTML中的《Table》代码中;层布局是利用《Div》+CSS文档实现布局,由于在层布局中,对层格式的定义可以集中在CSS文档中,使得网页的编码效率高,是当前主流的布局方式。框架布局则以框架技术为核心,把页面划分为若干个区域,在每个区域中都可以嵌入一个独立的HTML页面文件。3. 如何向网页中插入滚动字幕?如何实现垂直滚动字幕效果? 如果需要在页面上插入水平滚动的文字或图片,可以先选定需要滚动的文字和图片,然后切换到DW的【代码】视图下,会发现文字或图片仍处于选定状态。此时,只需在选定的代码两端分别输入《marquee》和《/marquee》。 如果需要在页面上插入垂直滚动的文字或图片,可以先选定需要垂直滚动的文字和图片,然后切换到【代码】方式下,此时会发现文字或图片仍处于选定状态,只需在选定的代码两端分别输入“《marquee direction=up width=宽度 height=高度》和《/marquee》”,预览网页效果时就会发现选定的内容会在一个矩形区域内自下而上地滚动。 此处direction=up表示滚动方向,子属性Width指定滚动窗口的宽度,Height指定滚动窗口的高度。4. 如何向网页中插入“当鼠标经过时自动切换图片”的效果? 【插入】→【图像对象】,选择【鼠标经过图片】。此时DW弹出对话框,要求开发者回答原始图片和交替图片的名称。当用户正确地提交了两个文件名后,单击【确定】后确认设置。