• 网络学院
  • IT资讯
  • 操作系统
  • 网络技术
  • 软件应用
  • 办公软件
  • 编程技术
  • 网站架设
  • 数据库类
  • 平面设计
  • 多媒体类
  • 游戏资讯
  • 教学论文
  • 认证考试
站点构成的基本元素—网页布局
  站点:
  • 首 页
  • 最新软件
  • 文章教程
  • 国内软件
  • 国外软件
  • 绿色软件
  • 源码下载
  • 字体下载
站点构成的基本元素—网页布局
软件发布 站点构成的基本元素—网页布局
网络软件 系统工具 应用软件 联络聊天 图形图像 多媒体类 行业软件 游戏娱乐 编程开发 安全相关 教育教学 数码软件 绿软下载
热门软件: QQ 瑞星 pplive e话通 木马克星 千千静听 office2000 五笔字根 Photoshop 视频分割
返回文章教程首页 >> 网站架设 >> DreamWeaver >> 站点构成的基本元素—网页布局

站点构成的基本元素—网页布局

添加时间: 2005-6-2 2:43:22  作者: 网页教程  阅读次数:48   来源: http://d9soft.com

       

    网页可以说是网站构成的基本元素。当我们轻点鼠标,在网海中遨游,一幅幅精彩的网页会呈现在我们面前,那么,网页的精彩与否的因素是什么呢?色彩的搭配、文字的变化、图片的处理等,这些当然是不可忽略的因素,除了这些,还有一个非常重要的因素——网页的布局。下面,我们就有关网页布局谈论一下。

    网页布局类型


  网页布局大致可分为“国”字型、拐角型、标题正文型、左右框架型、上下框架型、综合框架型、封面型、Flash型、变化型,下面分别论述。


  1. “国”字型:也可以称为“同”字型,是一些大型网站所喜欢的类型,即最上面是网站的标题以及横幅广告条,接下来就是网站的主要内容,左右分列一些两小条内容,中间是主要部分,与左右一起罗列到底,最下面是网站的一些基本信息、联系方式、版权声明等。这种结构是我们在网上见到的差不多是最多的一种结构类型。


  2. 拐角型:这种结构与上一种其实只是形式上的区别,其实是很相近的,上面是标题及广告横幅,接下来的左侧是一窄列链接等,右列是很宽的正文,下面也是一些网站的辅助信息。在这种类型中,一种很常见的类型是最上面是标题及广告,左侧是导航链接。


  3. 标题正文型:这种类型即最上面是标题或类似的一些东西,下面是正文,比如一些文章页面或注册页面等就是这种类。


  4. 左右框架型:这是一种左右为分别两页的框架结构,一般左面是导航链接,有时最上面会有一个小的标题或标致,右面是正文。我们见到的大部分的大型论坛都是这种结构的,有一些企业网站也喜欢采用。这种类型结构非常清晰,一目了然。


  5. 上下框架型:与上面类似,区别仅仅在于是一种上下分为两页的框架。


  6. 综合框架型:上页两种结构的结合,相对复杂的一种框架结构,较为常见的是类似于“拐角型”结构的,只是采用了框架结构。


  7. 封面型:这种类型基本上是出现在一些网站的首页,大部分为一些精美的平面设计结合一些小的动画,放上几个简单的链接或者仅是一个“进入”的链接甚至直接在首页的图片上做链接而没有任何提示。这种类型大部分出现在企业网站和个人主页,如果说处理的好,会给人带来赏心悦目的感觉。


  8. Flash型:其实这与封面型结构是类似的,只是这种类型采用了目前非常游戏行的Flash,与封面型不同的是,由于Flash强大的功能,页面所表达的信息更丰富,其视觉效果及听觉效果如果处理得当,绝不差于传统的多媒体。


  9. 变化型:即上面几种类型的结合与变化,比如本站在视觉上是很接近拐角型的,但所实现的功能的实质是那种上、左、右结构的综合框架型。


  关于第一屏


  所谓第一屏,是指我们到达一个网站在不拖动滚动条时能够看到的部分。那么第一屏有多“大”呢?其实这是未知的。一般来讲,在800×600的屏幕显示模式(这也是最常用的)下,在IE安装后默认的状态(即工具栏地址栏等没有改变)下,IE窗口内能看到的部分为778px×435px,一般来讲,我们以这个大小为标准就行了,毕竟,在无法适合所有人的情况下,我们只能为大多数考虑了。


  说了那么多,无非是一个标准的问题,其实接下来不用我说大家也能想到,第一屏当然要放最主要的内容,关键要知道的是,我们要对第一屏能显示的面积要有个估计,而不要仅仅以自己的机器为准。其实网页制作的一个很麻烦的地方就是浏览者的机器是未知的。


  有关导航栏的位置


  导航栏能让我们在浏览时容易的到达不同的页面,是网页元素非常重要的部分,所以导航栏一定要清晰、醒目,一般来讲,导航栏要在“第一屏”能显示出来,但是有时第一屏可能会小于上面所说的435px,基于这点考虑,那种横向放置的导航栏要优于纵向的导航栏考虑,原因很简单:如果浏览者的第一屏很矮,横向的仍能全部看到,而纵向的就很难说了,因为窗口的宽度一般是不会受浏览器设置影响的,而纵向的则不确定性要大的多。


  什么样的布局是最好的


  这是初学者可能会问的问题。其实这要具体情况具体分析的:比如如果内容非常多,就要考虑用“国字型”或拐角型;而如果内容不算太多而一些说明性的东西比较多,则可以考虑标题正文型;那几种框架结构的一个共同特点就是浏览方便,速度快,但结构变化不灵活;而如果是一个企业网站想展示一下企业形象或个人主页想展示个人风采,封面性是首选;Flash型更灵活一些,好的Flash大大丰富了网页,但是它不能表达过多的文字信息。还没有提到的就是变化型了,我只是想把这个留给各位朋友了,因为,只有不断的变化才会提高,才会不断丰富我们的网页

 

上下文章:

 

上一篇文章: 使用Dreamweaver实现飘浮光球特效 下一篇文章: 高手进阶:网页设计中的文字运用

相关文章:

  • Opera布局中国将发布桌面浏览器 抢3G商机
  • 轻松消除浏览网页时出现的乱码
  • 看不了过期网页 妙用快照突破限制
  • 瑞星云安全 加入反挂马网页功能
  • 活用傲游:精彩网页内容异地收集方法两则

相关软件:

  • 网页图片保存能手 8.7
  • 网页酷 V3.80 正式版
  • 鱼羊网智能网页截取工具
  • 刷网页访问量工具 1.45
  • 网页朗读器 V2006
  • 网页链接搜索王(WebScanKing) V2.0

 

快速导航

  • 网络学院
  • 精品汇聚
  • 字体下载
  • 教程下载
  • ASP源码
  • PHP源码
  • Net源码
  • JSP 源码

网站架设分类导航

  • DreamWeaver
  • HTML/CSS
  • Flash
  • Firework
  • FrontPage
  • 建站指南

本类经典文章推荐

  • 十二个Dreamweaver鲜为人知的小秘...
  • DW8创建自定义代码片段的方法
  • Dreamweaver你未必了解的5个小技巧
  • Dreamweaver制作随机播放背景音乐...
  • 特效:在网页中显示可拖动的月历
  • 教你驾驭Dreamweave中的小秘诀
  • Dreamweaver使用快技法十三则
  • 用DreamweaverMX 做图像热区
  • Dreamweaver 8 新功能总结
  • Studio 8 : Dreamweaver 代码折叠

DreamWeaver阅读排行

  • 教你如何用Dreamweaver制作电子相...
  • 如何设计首页???(解答)
  • 用Dreamweaver插件制作动态下拉菜...
  • Dreamweaver基础技巧-布局阶段
  • 站点-网页布局设计基础
  • 网页制作隐藏对象巧利用
  • Dreamweaver制作网页-幻灯片效果
  • “层”定位的问题的解答
  • DreamweaverMX2004新功能介绍
  • Dreamweaver中实现flash的透明背景

网站架设阅读总排行

  • 用层模拟下拉列表框
  • 教你如何用Dreamweaver制作电子相...
  • 如何设计首页???(解答)
  • 突破网页文字无法复制局限
  • 用Dreamweaver插件制作动态下拉菜...
  • Dreamweaver基础技巧-布局阶段
  • 动态QQ表情DIY Fireworks轻松搞定
  • 流程图软件Visio作“高难度”网页
  • 站点-网页布局设计基础
  • 网页制作隐藏对象巧利用

广告位置

字母检索 A B C D E F G H I J K L M N O P Q R S T U V W X Y Z 回到顶部

关于我们 | 版权声明 | 免责条款 | 广告联系 | 软件发布 | 下载帮助 | 下载排行 | 网站地图 | 特别鸣谢 | 友情连接

copyright; 2005-2008 D9soft.com 第九软件网 版权所有