• Home
  • About
    • 打怪少年 photo

      打怪少年

      专打各类难缠怪兽

    • Email
    • Github
  • 学习笔记
    • 可视化笔记
    • web笔记
  • 作品集
    • 可视化作品集
    • web作品集

页面结构|网站结构|界面设计|图形设计

02 Jan 2018

Reading time ~1 minute

页面结构

page-structure


网站结构

site-structure

  • 当搭建网站的html和目录时,尽可能直观的反映主要的界面和内容分区。
  • html页面分区命名要具有语义
  • 如何针对搜索优化页面?
    • 页面标题和主要内容标题内的关键词出现频率在5%-8%
    • 将关键字放在靠近页面顶部和左部的位置可以提升整体排名
    • 在文件和目录名使用主要的主题关键字
    • 在高访问量的网站创建请求链接
    • 从其他现有的指向新网站的网站来请求链接
    • 使用html元标签,将其元信息描述网页网站页面的主要内容关键字
    • 使用网站导航链接
    • 使用两类网站地图

界面设计

  • 导航和路径搜索:四大核心 我现在在哪? → 定向(Orientation) 我是否能识别我已经到达了正确的地方? → 结局(Closure) 我的经验是否足够用来获知我到过哪以及预测我接下来要去哪? → 意象图( Mental mapping) 我能找到去目的地的路线吗? → 路线决策(Route Decisions

  • 界面设计: 由於用户可能出现在任何页面上,所以要无死胡同頁 由於用户使用的装置各类型都有。所以顾及到给类型的显示屏 由於用户希望以尽可能最少的步骤获取信息。所以要能够直接访问
    由於用户要精确及可靠信息。所以设计要完整性和稳定性 由於用户不会容忍长时间的延迟。所以考虑带宽和交互 由於用户想知道她在哪,有什麽选项及功能。所以要有反馈和对话框 由於用户不喜复杂,要即时及正确信息。所以设计要简洁性和一致性

  • 信息设计: 每个 Web 页面需要 : - 一个翔实的标题 (标题还可以成为页面的文字书签)。 - 创建者的标识(作者或者机构)。 - 创建或者修改日期 。 - 版权声明、许可声明或者其他用来保护知识产权的所有权卢明。 - 在所有页面的相同位置至少要有一个连接到局部主页或者菜单页的链接- - 主页URL. 大多数 Web 页面还应该包括以下这些附加元素 : - 左上角需要放置带有跳转回主页面的企业 Logo 或者名称的链接。 - 链到网站其他主要部分的导航链接。 - 至少一个标识和阐释页面内容的标题。 - 邮箱地址和联系人信息或者与i主信息相连的链接。 - 用来标识页面图形的可替代 ( Alt 〉 文字 。

  • 企业界面规划三大目标:象征性,一致性,定位


图形设计

  • 文档设计: 使用响应式设计,媒体查询;使用替代文本,如alt.

  • 视觉设计:

    • 格式塔视觉设计原则
    • 使用分栏,栏的宽度与黄斑大致匹配
    • 恰当的网页长度需要平衡4方面的因素:页面与屏幕大小之间的关系;文档内容;读者带宽及读者希望在线阅读或打印后续阅读
    • 设计页眉创建网站一致的标识和导航,页脚放置一系列其他页面的链接



rwd-note Share Tweet +1

中山大学南方学院 网络与新媒体 培养方案核心课程学期作品,由 廖汉腾副教授 指导