制作网页图片素材简单-怎么制作简单的网页

现在我们经常会在产品标签上加上二维码,让人扫描二维码后就可以看到一个简单的图片网页,可以了解更多产品的详细信息。那么这个网页要怎么制作呢?下面我们来看一个非常简单的方法。

1、将网页需要展示的图片在Photoshop里面排版好;

2、将排版好的页面进行切片,并将文件保存为web所用格式文件(切片可以有两个作用,一是防止因为图片太大,在网速一般的情况下很久都加载不出来,这样别人可能会认为网页有问题就关掉了;另一个是不同图片需要添加跳转链接的话会很方便)。

3、这样文件就保存为了一个HTML文件和一个images文件夹,可以看到我们刚排版的图片已经被切成一张张的图片保存在images文件夹中了。

4、接下来打开Dreamweaver,新建站点,填写站点信息,选择本地根文件夹(刚才保存文件的文件夹)和默认图像文件夹(刚保存的文件里面的images文件夹);新建好之后就可以看到软件页面右边栏中有了刚刚新建的站点了,展开可以看到站点内的文件。

5、预览网页效果。点击工具栏上的小地球(快捷键F12),可以在浏览器中对网页效果进行预览。这时如果你没有保存页面,会弹出保存提示框,点保存就可以预览了。

制作简单的网页可能有很多方法,用不同的软件。今天我来介绍一下用Dreamweaver CS5中文版来制作简单的网页步骤。由于DW软件具有可视化的特点,所以学起来很简单,和office word一样简单的工具。

首先下载安装Dreamweaver,打开后,新建一个网页,一般选择“HTML”建立网页。选择“经典”界面,有助于我们更便捷使用这个软件。

下面选择这三个界面,代码、拆分、设计,一般默认设计界面,对于新手这个功能具有可视化,能更好的制作网页。

下面我们来制作网站站点,在电脑上建一个文件作为根目录。我们所建网站的所有文件和网页都保存在这个文件中。站点的作用就是使你的网站网页之间框架清晰。同时给站点起个名字。

然后再在站点根目录下建立一个专门储存网站图片的文件,并设置默认。这样你添加到这个网站的所有图片都自动保存到这个文件,不会丢失。注意文件命名要用英文。下面我用我建立的(篮球资讯网)来介绍,点击右下方篮球资讯网――下拉点击管理站点――点击高级设置――设置默认图像文件夹为刚建立的images。保存。

下面我们来制作这个网站首页,先学习添加图片。插入――图像――选择素材添加。点击图片,下面属性可以编辑修改图片大小,添加超链接等等。下面我修改图片大小做示范。

下面学习添加文本。编辑“篮球资讯网”,下面属性可以设置文本字体、添加超链接等等,点击页面属性,可以详细编辑文本属性。

网页基本就是文字和图片的组合,添加视频还需要学习者好好搜索Dreamweaver 的使用视频加以学习。最后制作完一个网页要记得保存。左上角文件――保存。

最后我们学习添加超链接。我用建立的第二个网页来做示范。选中篮球资讯网文本,点击页面下方属性――链接――点文件小按钮――选中第一个网页,这样篮球资讯网文本变成蓝色。这是网站内部链接,相反就有外部链接。添加如图,一定要写

http://......

就可以了。

最后我们浏览网页。左上角文件――在浏览器中浏览网页,点击网页中两个链接都能到达指定网页。

1.将网页需要展示的图片在Photoshop里面排版好;

2.

将排版好的页面进行切片,并将文件保存为web所用格式文件;

3.

这样文件就保存为了一个HTML文件和一个images文件夹,可以看到我们刚排版的图片已经被切成一张张的图片保存在

4.

接下来打开Dreamweaver,新建站点;填写站点信息,选择本地根文件夹(刚才保存文件的文件夹)和默认图像文件夹(刚保存的文件里面的images文件夹);

5.新建好之后就可以看到软件页面右边栏中有了刚刚新建的站点了,展开可以看到站点内的文件。

6.双击里面的HTML文件,就可以打开刚刚保存的排好版的内容页面进行编辑;

7.因为我们已经排版好了,不需要对图片再多做处理,所以我们只需要在上方的设计视图框中全选整个页面(Ctrl+a),在属性栏中将页面进行居中就可以了,内容居中的网页比较能适应不同的浏览器;