热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

网站首页的布局必须动静结合浏览者目不暇接

作为一名网站制作人员,笔者在浏览一些大型的门户网站的时候,除了看一些新闻外,更多的是在仔细的体会这些网站的网页设计与布局方面的一些学问。不知不觉,竟然发现一些规律

  作为一名网站制作人员,笔者在浏览一些大型的门户网站的时候,除了看一些新闻外,更多的是在仔细的体会这些网站的网页设计与布局方面的一些学问。不知不觉,竟然发现一些规律性的问题。今天就谈谈对网站首页布局方面,动态元素与静态元素的布局方面一些技巧,大家可以看下是否有道理。

  网站首页内容要合理分布

  网站首页的重要性大家应该都知道,特别是一些门户网站,往往很多浏览者都会花时间在首页上,很多网站的首页往往直接布置一些标题连接,所以,很多网站在浏览者进入首页后,内容页面的流量往往很多是从首页引来的。这个时候,合理布局首页的内容,就有很多技巧了。因为毕竟首页就这么大,而且很多门户的网站内容每天都会有很多新的内容推出,而且是可以说是大量。这个时候,可以很好的运用一些静态与动态的页面元素来引起浏览者的注意。

  关于静态元素与动态元素

  这里说的动态元素与静态元素,指的是视觉方面的。其实现在的网站技术,是基于视觉的艺术,网站的设计其实就是一种视觉效果的设计与开发,通过视觉来传达一些信息。网站的主页的设计布局,就要符合这种直观地传达设计策略与内容表现技巧。浏览者对网站的印象,往往会有下面的一些印象,比如:趣味、温和、冰冷、高档、洁净、动态、静态等等。这些印象就基本决定了浏览者对的网站的最直观的感受和印象,从而决定用户对页面传达的内容的兴趣。

  对于网页里面的一些元素,就要围绕这些用户印象,进行信息传递。或者是文字表达,或者是图片视频传递。网页的静态元素能够让人感觉整洁,温和,平静,动态元素会让人感觉活泼,趣味,热烈等。我们在网站首页的元素布局中,要很好的根据自己页面内容的重要性,合理的进行分配,充分调动浏览者的目光与兴趣。

  首页布局如何动静结合

  首先,动态元素与静态元素的布局,要符合页面整洁有序的要求,比较均匀的分部在页面,不能一打开让人感觉到眼花缭乱感觉有些眼晕,这个时候,往往造成页面的一些原本希望浏览者去浏览的内容,因为无序杂乱而被漏掉。所以,要让页面均衡而有吸引力,让每个地方都能引来浏览者的目光,这才是首页布局的最高的境界,那么如何做到这点呢?

  首要的是先引人入胜,根据大家的浏览习惯,往往是从页面的左上面开始浏览几行或者几块,然后是目光扫页面的右上面,依次向下。我们可以这个特点,把重要的静态文字标题内容放在页面的左上部分,特别重要的适当加粗,页面的右上部分,布置一个次重要或这同样重要的动态的元素,比如图片轮播,动态标题等等,这样,就把这个原本容易被忽视的地方给搞活了。

  这样让浏览者入胜之后,下面的布局同行可以按照这样的规律进行布局,重要的元素放在用户比较容易注意的地方。对于一些不太重要,却又想让浏览者看到的元素,可以稍微的让它们“动”一下,或者在色彩上和其他部分做一个层次上的差异,让浏览者目光扫到这里的时候,可以发现他们引起他们的点击。不过所有的这些,都要注意不要太过夸张,避免喧宾夺主,让浏览者眼晕。

  总之,可以归纳下,动态元素,能够起到激发浏览者注意的作用,静态元素可以让浏览者集中精力感到平静。我们根据浏览者的浏览习惯与视觉感受,动静结合,让整个首页的每个部分都能吸引浏览者的目光,让浏览者目不暇接舍不得离开。


推荐阅读
  • 本文介绍了拍摄高质量Vlog所需的设备,包括索尼A7 III相机、蔡司镜头、罗德麦克风、单反稳定器、苹果手机及其配件、灯光设备等。此外,还探讨了后期制作所需的软件工具,如剪辑、特效和调色软件。无论你是业余爱好者还是专业创作者,选择合适的设备至关重要。 ... [详细]
  • QUIC协议:快速UDP互联网连接
    QUIC(Quick UDP Internet Connections)是谷歌开发的一种旨在提高网络性能和安全性的传输层协议。它基于UDP,并结合了TLS级别的安全性,提供了更高效、更可靠的互联网通信方式。 ... [详细]
  • 探讨一个老旧 PHP MySQL 系统中,时间戳字段不定期出现异常值的问题及其可能原因。 ... [详细]
  • 国内BI工具迎战国际巨头Tableau,稳步崛起
    尽管商业智能(BI)工具在中国的普及程度尚不及国际市场,但近年来,随着本土企业的持续创新和市场推广,国内主流BI工具正逐渐崭露头角。面对国际品牌如Tableau的强大竞争,国内BI工具通过不断优化产品和技术,赢得了越来越多用户的认可。 ... [详细]
  • 优化ListView性能
    本文深入探讨了如何通过多种技术手段优化ListView的性能,包括视图复用、ViewHolder模式、分批加载数据、图片优化及内存管理等。这些方法能够显著提升应用的响应速度和用户体验。 ... [详细]
  • 郑州大学在211高校中的地位与排名解析
    本文将详细解读郑州大学作为一所位于河南省的211和双一流B类高校,在全国211高校中的地位与排名,帮助高三学生更好地了解这所知名学府的实力与发展前景。 ... [详细]
  • 深入理解 Oracle 存储函数:计算员工年收入
    本文介绍如何使用 Oracle 存储函数查询特定员工的年收入。我们将详细解释存储函数的创建过程,并提供完整的代码示例。 ... [详细]
  • 优化ASM字节码操作:简化类转换与移除冗余指令
    本文探讨如何利用ASM框架进行字节码操作,以优化现有类的转换过程,简化复杂的转换逻辑,并移除不必要的加0操作。通过这些技术手段,可以显著提升代码性能和可维护性。 ... [详细]
  • 本文总结了2018年的关键成就,包括职业变动、购车、考取驾照等重要事件,并分享了读书、工作、家庭和朋友方面的感悟。同时,展望2019年,制定了健康、软实力提升和技术学习的具体目标。 ... [详细]
  • 电子元件封装库:三极管、MOS管及部分LDO(含3D模型)
    本资源汇集了常用的插件和贴片三极管、MOS管以及部分LDO的封装,涵盖TO和SOT系列。所有封装均配有高质量的3D模型,共计96种,满足日常设计需求。 ... [详细]
  • 在计算机技术的学习道路上,51CTO学院以其专业性和专注度给我留下了深刻印象。从2012年接触计算机到2014年开始系统学习网络技术和安全领域,51CTO学院始终是我信赖的学习平台。 ... [详细]
  • CSS 布局:液态三栏混合宽度布局
    本文介绍了如何使用 CSS 实现液态的三栏布局,其中各栏具有不同的宽度设置。通过调整容器和内容区域的属性,可以实现灵活且响应式的网页设计。 ... [详细]
  • 本文详细介绍了如何使用PHP检测AJAX请求,通过分析预定义服务器变量来判断请求是否来自XMLHttpRequest。此方法简单实用,适用于各种Web开发场景。 ... [详细]
  • 小红书提高MCN机构入驻门槛,需缴纳20万元保证金
    近期,小红书对MCN机构的入驻要求进行了调整,明确要求MCN机构在入驻时需缴纳20万元人民币的保证金。此举旨在进一步规范平台内容生态,确保社区的真实性和用户体验。 ... [详细]
  • Linux 系统启动故障排除指南:MBR 和 GRUB 问题
    本文详细介绍了 Linux 系统启动过程中常见的 MBR 扇区和 GRUB 引导程序故障及其解决方案,涵盖从备份、模拟故障到恢复的具体步骤。 ... [详细]
author-avatar
小花姐姐
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有