Adobe学习记录:Dreamweaver软件入门

Dreamweaver概述

Adobe Dreamweaver, 简称“DW”,中文名称“梦想编织者”,是美国MACROMEDAI公司开发的集网页制作和管理网站于一身的所见即所得网页编辑器,DW是第一套针对网页设计师特别发展的视觉化网页开发工具,利用它可以轻而易举地作出跨越平台限制和跨越浏览器限制的充满动感的网页。

了解网站的结构

什么是 HTML?

  • 网页显示内容并且拥有由 HTML 定义的底层结构
  • 内容可包括文本、图像、链接,甚或音频和视频
  • 大多数 HTML 元素通过使用起始的 <element> 和结尾的 </element> 标签编写。这些标签告诉浏览器要显示的内容类型。这些标签以特定顺序编写,用于定义页面结构

什么是 CSS?

  • HTML 为您的网页提供基本结构,但无法提供多样化样式或布局自定义功能。最终,您想要在您的网页上添加颜色、格式文本和图像以及重新定位元素
  • CSS 是配合 HTML 使用的语言,用于将该样式和格式应用至您的网页。
    用 CSS 查找一个或多个 HTML 元素,然后提供更多元素处理指令,例如更改元素颜色或页面居中元素

Dreamweaver与HTML之间的关系

Dreamweaver其实就是一款编辑HTML代码的软件,如果写网页没必要一定使用这款软件不可,之所以使用它,就是因为它提供了不同的编辑窗口,初学者可以配合它提供的设计面板利于学习记忆,并且此软件提供代码提示,能够在实际工作中快速完成网页的搭建。

网页的构成元素

  1. 文本
    详细的传达内容信息
    可编辑文本最常用的字体是:宋体和微软雅黑
    可编辑文本的字号通常是:12px, 14px, 16px, 18px
  2. 图像
    形象并直观的展示网页内容
    JPG:色彩还原好、体积不是很大但不支持透明
    PNG:清晰、无损压缩、支持透明
    GIF:体积小、支持动画和透明效果但色彩还原较低
  3. 表单
    获取用户填入的信息并在后台管理软件的配合下管理用户资料
  4. 动画(动态效果)
    常用的动画格式主要有两种:
    一种是SWF动画(flash),一种是GIF动画(简单动画)
  5. 音乐
    网页中常用的音乐格式有WMV及MP3
  6. 视频
    网页中常用的视频格式有RM、WMV、FLV三种格式

了解Web设计的阶段

学习 Web 项目的主要阶段,包括内容规划、为设计添加线框、网页创建和站点发布。

规划内容

  • 精心规划内容无疑是 Web 设计中最重要的一个阶段。该阶段也是耗时最长,但又举足轻重的一步。出色的内容规划将为您站点的观感和可用性加分,也可提升 Web 开发效率
  • 以下几个关键点要牢记于心:了解您的受众,以简短为佳,从用户角度设想您的站点检索方式,以及有逻辑性地整理内容

为设计添加线框

  • 线框即为一种网站蓝图,或一种抽象的网站可视化呈现方式,可让您和您的团队在设计和规划阶段的合作更加轻松。线框的形式可为手绘简图,该形式可让您随地快速记录想法;线框也可以是更精细的网站导航和功能定义
  • Dreamweaver 为您提供多种线框工具,包括钢笔和纸张、免费/商业线框软件 APP,甚或是其它 Creative Cloud APP(比如 Photoshop)。选择最适合您和您团队的方法和细节级别

创建网页

  • 现在,是时候将出色的设计构想和精心规划付诸实践了。落地概念性计划,要诀在于洞察 Web 设计语言。Web 设计语言主题系列教程将着力于 HTML 和 CSS,也会简单介绍 JavaScript
  • HTML(全称超文本标记语言)用于创建您网站页面的整体结构和内容。CSS(亦称层叠样式表)用于设计网站内容的可视化属性,以及自定义布局。JavaScript 是一种流行的脚本语言,您可使用 JavaScript 向网页添加功能和交互

发布网站

  • 准备好向全世界发布您的网站之后,您需要做些许准备工作
  • 首先,您必须获取域名或网址。
  • 此外,您还需要在 Web 服务器上划分专用空间,以及获取连接详情——FTP 是连接 Web 服务器的通用方式。
  • 若您正在为您的公司创建网站,则可从您的 IT Web 管理员处获取该信息
  • 若您正在发布您自己的站点,则可从 Web 主机提供商处获取该信息
  • 接着,您可以使用 Sites(站点)功能连接至 Web 服务器,然后从Dreamweaver 直接发布您的站点

猜你喜欢

转载自blog.csdn.net/m0_49564079/article/details/115281494
今日推荐