WEB标准之内容结构表现和行为到底怎么分离

所属分类: 网站运营 / 建站经验 阅读数: 95
收藏 0 赞 0 分享

 内容与表现分离,从标准到国人重视那天起,就已经讨论了,但是停留在div+css xhtml+css 纯代码的分离,思想上流程上,到底如何分离?

古老的话题:一首古诗的分离

  1.给你一首古诗,保存为毫无格式的一堆文字,你去理解它的内容,进行结构的处理。用word排版之后,他有了结构
  2.这个结构其实包含了语义和表现
  3.用html进行结构化,抛开一切的表现形式,只考虑语义
  4.用CSS进行表现处理,包括html的默认表现,他拥有了视觉表现,这个表现体现出了结构化,也体现出了用户体验,用户体验中包含了交互的排版和视觉体验
  5.如果加上行为,比如点击注释序号,缓缓跳转到注释内容。

  再看看css禅意花园
  同样是上面的5个步骤,形成第一版本的css禅意花园
  而更多的模板提供者所做的工作是交互线稿+视觉设计。体现在网页上就是CSS

  可以看出从编码角度来讲
   第一步,内容处理为结构,纯HTML的编写
   第二步,结构处理为表现,纯CSS的编写
   第三步,给表现加上行为。

  从流程的角度来讲
   第一步,策划文档
   第二步,结构处理
   第三步,交互设计(交互样式构建)
   第四步,视觉设计(视觉样式构建)
   第五步,样式构建

更多精彩内容其他人还在看

网站分析工具 通过流量特点来分析网站

使用一些网站分析工具的时候会发现一般报表会被分成三大模块:用户访问、内容浏览和流量来源。
收藏 0 赞 0 分享

提高博客阅读体验的六个方法说明

博客的阅读体验有很多方面,如果您要建立一个受欢迎的博客,那么,你可能要善待你的读者,提高阅读体验,这样会提高他们再次访问你博客的机会,让他们成为你的博客或网站的常客之一,当然你的网站如果可以注册的话,还可以成为你的注册用户之一,下面我就提供较为实用的
收藏 0 赞 0 分享

让网站上的Adsense广告匹配的更加精准的方法

大家都知道做AdSense 广告的话,网站内容与广告内容匹配程度是很关键的,而Google广告内容又是以网页本身的关键词所觉得,那么如何让网页中出现匹配度最高的Adsense 广告呢?
收藏 0 赞 0 分享

Favicon 在线生成器工具小结

favicon 就是出现在浏览器地址栏左侧的那个小图标。所谓favicon,即Favorites Icon的缩写,中文名称是网站头像,顾名思义,便是其可以让浏览器的收藏夹中除显示相应的标题外,还以图标的方式区别不同的网站。
收藏 0 赞 0 分享

网站备案注销方法 关于网站备案问题的解答

关于网站备案问题的解答 如何注销网站备案
收藏 0 赞 0 分享

一家大型行业网站的编辑的职场真实经历分享

想了很久,终于把干了8个月的网络编辑工作给辞掉了。如今静下心来,把8个月来的思绪给缕一下,也给向往这个职业的朋友们些参考。
收藏 0 赞 0 分享

转化率最高的10个网站的经验分享

之前分享过如何提升网站转化率之:谷歌9条和AIDAS模型,这篇文章直接提到了国外网站转化率最高的10个网站他们是如何有效提升转化率的
收藏 0 赞 0 分享

地方门户型网站运营与发展经验的几点总结

地方门户网站获得发展,还需要和当地的实际情况结合起来,不断的尝试和多方的合作,这样就可以在当地将网站打开知名度,同时使门户网站的营运获得很大的发展。
收藏 0 赞 0 分享

地方类网站的建立(从零起步)

只是个人见解和参考前辈的经验,希望对你有所帮助,难免有错误观点和见解,请您及时告知与我,共同成长,共同进步。最后分享一句话:“认准了,就去做;不跟风,不动摇”。
收藏 0 赞 0 分享

博客网站的运营和推广四步基本经验

网站运营经验:博客网站的运营和推广四步走.
收藏 0 赞 0 分享
查看更多