《
设计师必知网页设计命名规范》文章地址:http://www.tfxk.com/wangyesheji/jianzhanjingyan/030234V62013.htm
四.常用命名汇总:
三.Photoshop图层结构规范:
二.须要留神的多少点:
第二级结构图例(病院网站):
第一级图层结构如下图:
3.涉及到交互行为的元素命名:
凡波及交互行动的元素通常会有畸形(link)、悬停(hover)、点击(click)和已阅读(visited)等不同款式,命名可参考以下规矩:
鼠标悬停::hover 点击:click 已浏览:visited
如:搜索按钮: btn-search、btn-search-hover、btn-search-visited
--> [
网站建设之]设计师必知
网页设计命名标准
做什么事件都要有准则,在网页设计中,我们从开端就得规范我们的设计,这里咱们说说命名规则,首页叫index,广告条叫banner,这些可不是乱取的名字。
Tag: 网页设计 命名规范  ,
设计师也必须要会编写代码; 网页设计 命名规范
2.组合命名规则:
[元素类型]-[元素作用/内容]
如:搜索按钮: btn-search
登录表单:form-login
新闻列表:list-news
页头:header
登录条:loginbar
标记:logo
侧栏:sidebar
广告条:banner
导航:nav
子导航:subNav
菜单:menu
子菜单:subMenu
下拉菜单:dropMenu
工具条: toolbar
表单:form
栏目:column
箭头:arrow
搜寻:search
搜索按钮:btn-search
转动条:scroll
内容:content
标签页:tab
文章列表:list
提醒信息:msg
小技能:tips
栏目题目:title
链接:links
页脚:footer
服务:service
热门:hot
消息:news
下载:download
注册:regsiter
状况:status
按钮:btn
投票:vote
配合搭档:partner
版权:copyright
网站舆图: sitemap
1. Container(整体)
“container“ 就是将页面中的所有元素包在一起的部分,这部分还可以命名为: “wrapper“, “wrap“, “page“.
2. Header(头部)
“header” 是网站页面的头部区域,个别来讲,设计图做的边线衬线 比较粗浅的总结,它包括网站的logo跟一些其余元素。这局部还能够命名为:“page-header” (或 pageHeader).
3. Navbar(导航)
“navbar“等同于横向的导航栏,是最典范的网页元素。这部分还可以命名为:“nav”, “navigation”, “nav-wrapper”.
4.  ,设计作品的评审 各类评审形式的关键点; Menu(菜单)
“Menu”区域包含普通的链接和菜单,这部分还可以命名为: “subNav “, “links“,“sidebar-main”.
5. ,设计三要素:清晰、独创、幽默; Main(内容)
“Main”是网站的重要区域,假如是博客的话它将包含的日志。这部分还可以命名为: “content“, “main-content” (或“mainContent”)。
6. Sidebar(侧边链接)
“Sidebar” 部分可以包含网站的次要内容,比方最近更新内容列表、对于网站的先容或广告元素等…这部门还可以命名为: “subNav “, “side-panel“, “secondary-content“.
7. Footer(页脚)
“Footer”包含网站的一些附加信息,这部分还可以命名为: “copyright“.
一.网站设计及基础框架结构:
第三级结构图例及后果图对照(医院新闻栏目):
1.尽量用"有意思的命名"来给元素命名到达语义化。不要使用名义情势的命名.
如:red/left/big等,设置class元素的三种方式。
效果图
图层命名结构
Photoshop图层命名遵守树形构造,凡某元素组成的图层大于3层,即可构成组,所有图层尽量防止应用默认命名(图层+编号)。
(责任编辑:网站建设)
设计师必知网页设计命名规范相关文章