网页设计 网页设计的布局理念.

Slides:



Advertisements
Similar presentations
高中新课程思想政治(必 修 1 、 2 )的教学体会 北京师大二附中 李文燕 2008 年西城新课程教师培训的讲稿.
Advertisements

《饲料分析与质量检测技术》 说课 主讲教师:管建慧. 课程名称: 《饲料分析与饲料质量检测技术 》 课程编码:
练一练: 在数轴上画出表示下列各数的点, 并指出这些点相互间的关系: -6 , 6 , -3 , 3 , -1.5, 1.5.
教师资格定期注册 申请人工作流程. 注意事项: 1. 申请人拟进行定期注册的教师资格证书的资格种类或任 教学科与申请人现任教学段所对应的资格种类或现任教学 科不一致的,在填写教师资格证书信息时, “ 资格种类 ” 和 “ 任教学科 ” 项须如实按照证书上的内容填写(不得填写申 请人现任教学段所对应的资格种类或现任教学科);
2009/12/211 商務科技管理系 實 務 專 題 報 告 辦桌非難事 學生: 施雅雯 ( ) 張敬芝 ( ) 葉明臻 ( ) 黃怡琅 ( )
广州市小学信息技术教学同步资源 第一册 第二章 第六节 《 Window窗口》 广州市荔湾区西华路小学 董绮珊.
“321人才计划”情况介绍 南京高新技术产业开发区 人才工作办公室.
南宁市中考网上报名录取系统 使用手册 2014年5月.
成语乐园 成语乐园 执教老师:李道梅.
第六 章数据库访问页 6.1 数据访问页视图 6.2 创建数据访问页 6.3 编辑数据访问页 6.4 查看数据访问页 退出.
詹天佑.
北师大版义务教育课程标准实验教科书 七年级上册讲义 第17课 先进的科学技术.
邮币卡开户、银行签约、出入金流程.
实验一:分析“征途游戏”网站的类型与推广手段
立體四子棋 研究成員:謝旻諺、 鄭家鈞 指導老師:林屏森老師.
“三步式”网络学习法 《探究与发现》数学网络学习平台介绍
簡報內容 網路請購系統說明 經費授權注意事項 請購單&授權應用範例 系統環境及設定. 簡報內容 網路請購系統說明 經費授權注意事項 請購單&授權應用範例 系統環境及設定.
初中思想品德 规范的教学设计与案例分析.
Web 编程基础(4).
电子商务网站的主页内容布局 授课:花小琴.
第3节 页面分析与设计.
第12章 Web 设计基础 清华大学出版社.
三創產業學程 學群主持人:袁國榮召集人.
文書檔案與實務概述 103年7月30日 主講人:總務處文書組單秀琴組長.
UI(用户界面)集训班 Illustrator 高级班.
给点阳光我就灿烂 ——工作简历模板.
北京市医师定期考核信息管理系统 在线考试培训会 北京市卫生和计划生育委员会 北京市医师定期考核办公室 2016年9月
第2章 网站建设概论.
苏教版(国标本)第六册 习作四 南京市五老村小学   王咏慧.
《体育与健康》说课稿 课题:新兴体育舞蹈 —踢踏舞教学 北师大泉州附中 陈玉慈.
§5 微分及其应用 一、微分的概念 实例:正方形金属薄片受热后面积的改变量..
§5 微分及其应用 一、微分的概念 实例:正方形金属薄片受热后面积的改变量..
教师资格定期注册 申请人工作流程.
在PHP和MYSQL中实现完美的中文显示
UI 软件 设计 网页基本元素设计(二).
第11章:一些著名开源软件介绍 第12章:服务安装和配置 本章教学目标: 了解当前一些应用最广泛的开源软件项目 搭建一个网站服务器
POWERPOINT TEMPLATE Design by Richasy
哈利路亚 敬拜歌曲: 1)奉主名来的是应当称颂的 2)同路人 3)这一生最美的祝福
常见介词的使用与比较.
UI 软件 设计 页面布局(三).
SOA – Experiment 2: Query Classification Web Service
实用网络营销基础 冯英健 2006年8月6日 首页.
网页设计与制作 —— 学习情境二:网页模板设计
下一代网络营销探讨 —网络营销移动化问题思考
欢迎返校! 2016 返校之夜.
用计算器开方.
计算机网络与网页制作 Chapter 07:Dreamweaver CS5入门
Word中活用“艺▪图▪框” 信息技术必修(一).
Logo 思维 力量 商务展示·企业内训.
第9章 多媒体技术 掌握 Windows 画图工具的基本操作; 掌握 Windows 音频工具进行音频播放;
Module 9 Unit 2 Happy Birthday
武汉纺织大学传媒学院 cm.wtu.edu.cn
总复习.
《手把手教你学STM32-STemWin》 主讲人 :正点原子团队 硬件平台:正点原子STM32开发板 版权所有:广州市星翼电子科技有限公司
_01自己实现简单的消息处理框架模型 本节课讲师——void* 视频提供:昆山爱达人信息技术有限公司
第四节 向量的乘积 一、两向量的数量积 二、两向量的向量积.
找 因 数.
项目:交互式网页 义乌工商学院机电信息分院省级精品课程.
从社交网络游戏中发现艺术的灵魂 Brad MacDonald 麦泊然 艺术总监
创建、启动和关闭Activity 本讲大纲: 1、创建Activity 2、配置Activity 3、启动和关闭Activity
使用Fragment 本讲大纲: 1、创建Fragment 2、在Activity中添加Fragment
江苏省中小学教师 信息技术能力提升工程培训
PURPLE PASSION Add Your Subtitle Here.
网 上 开 店 第15周2.
《手把手教你学STM32-STemWin》 主讲人 :正点原子团队 硬件平台:正点原子STM32开发板 版权所有:广州市星翼电子科技有限公司
指數、對數函數 數101乙 周文翔 朱哲明 張良聿.
UTips — Service Stage for ZhanChi
李商隐诗两首 锦 瑟 马 嵬 夕阳无限好,只是尽黄昏。.
学习目标 1、什么是列类型 2、列类型之数值类型.
百万行、千万行数据查询教程 老黄牛.
Presentation transcript:

网页设计 网页设计的布局理念

网页设计的布局理念 网页可以说是网站构成的基本元素。当我们轻点鼠标,在网海中遨游,一副副 精彩的网页会呈现在我们面前,那么,网页的精彩与否的因素是什么呢?色彩的搭 配、文字的变化、图片的处理等,这些当然是不可忽略的因素,除了这些,还有一 个非常重要的因素——网页的布局。下面,我们就有关网页布局谈论一下。   网页布局类型   网页布局大致可分为“国”字型、拐角型、标题正文型、左右框架型、上下框架型、 综合框架型、封面型、Flash型、变化型,下面分别论述。 1、“国”字型:   也可以称为“同”字型,是一些大型网站所喜欢的类型,即最上面是网站的标题以 及横幅广告条,接下来就是网站的主要内容,左右分列一些两小条内容,中间是主 要部分,与左右一起罗列到底,最下面是网站的一些基本信息、联系方式、版权声 明等。这种结构是我们在网上见到的差不多最多的一种结构类型。 2、拐角型:   这种结构与上一种其实只是形式上的区别,其实是很相近的,上面是标题及广 告横幅,接下来的左侧是一窄列链接等,右列是很宽的正文,下面也是一些网站的 辅助信息。在这种类型中,一种很常见的类型是最上面是标题及广告,左侧是导航 链接。

3、标题正文型:   这种类型即最上面是标题或类似的一些东西,下面是正文,比如一些文章页面或注册页面等就是这种类。 4、左右框架型:   这是一种左右为分别两页的框架结构,一般左面是导航链接,有时最上面会有一个小的标题或标致,右面是正文。我们见到的大部分的大型论坛都是这种结构的,有一些企业网站也喜欢采用。这种类型结构非常清晰,一目了然。 5、上下框架型:   与上面类似,区别仅仅在于是一种上下分为两页的框架。 6、综合框架型:   上页两种结构的结合,相对复杂的一种框架结构,较为常见的是类似于“拐角型”结构的,只是采用了框架结构。

7、封面型:   这种类型基本上是出现在一些网站的首页,大部分为一些精美的平面设计结合一些小的动画,放上几个简单的链接或者仅是一个“进入”的链接甚至直接在首页的图片上做链接而没有任何提示。这种类型大部分出现在企业网站和个人主页,如果说处理的好,会给人带来赏心悦目的感觉。 8、Flash型:   其实这与封面型结构是类似的,只是这种类型采用了目前非常游戏行的Flash,与封面型不同的是,由于Flash强大的功能,页面所表达的信息更丰富,其视觉效果及听觉效果如果处理得当,绝不差于传统的多媒体。 9、变化型:   即上面几种类型的结合与变化,比如本站在视觉上是很接近拐角型的,但所实现的功能的实质是那种上、左、右结构的综合框架型。

 关于第一屏   所谓第一屏,是指我们到达一个网站在不拖动滚动条时能够看到的部分。那么第一屏有多“大”呢?其实这是未知的。一般来讲,在800*600的屏幕显示模式(这也是最常用的)下,在IE安装后默认的状态(即工具栏地址栏等没有改变)下,IE窗口内能看到的部分为778px*435px,一般来讲,我们以这个大小为标准就行了,毕竟,在无法适合所有人的情况下,我们只能为大多数考虑了。   说了那么多,无非是一个标准的问题,其实接下来不用我说大家也能想到,第一屏当然要放最主要的内容,关键要知道的是,我们要对第一屏能显示的面积要有个估计,而不要仅仅以自己的机器为准。其实网页制作的一个很麻烦的地方就是浏览者的机器是未知的。 有关导航栏的位置   导航栏能让我们在浏览时容易的到达不同的页面,是网页元素非常重要的部分,所以导航栏一定要清晰、醒目,一般来讲,导航栏要在“第一屏”能显示出来,但是有时第一屏可能会小于上面所说的435px,积于这点考虑,那种横向放置的导航栏要优于纵向的导航栏考虑,原因很简单:如果浏览者的第一屏很矮,横向的仍能全部看到,而纵向的就很难说了,因为窗口的宽度一般是不会受浏览器设置影响的,而纵向的则不确定性要大的多。

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