分享

CMS系统浅析 ? "有意思"的用户体验团队

 苏小棉 2013-02-15

/前端开发 /2009.03.06

处女帖已经酝酿许久,最终决定简单的分析一下CMS系统的架构。
首先大家看看下面这个图,这是网易页面的一部分:(为了博客的效果,我把图缩小了,不好意思,请点击放大)

网易部分首页

第一感觉是不是内容很多,很复杂。那我们把它分解一下,再看看图2:(为了博客的效果,我把图缩小了,不好意思,请点击放大)

分解

是不是清晰很多,它是由这些红色的块组成。下面我再取一部分出来:

分解2
 
看看这部分代码:
<div class=”list”>
<ul>
<li><a href=”http://blog.163.com/jzchenyong/blog/static/1042960432009265137898/“>报道假币记者怒斥央行</a></li>
<li><a href=”http://adong360.blog.163.com/blog/static/21725364200926103415811/“>中国女性是出版业救星?</a></li>
<li><a href=”http://shiqinyao2005.blog.163.com/blog/static/665324720092695548890/“>如何成为女明星男朋友</a></li>
<li><a href=”http://keyunlu2006.blog.163.com/blog/static/41051792009269358859/“>怎样读书才能改变命运</a></li>
<li><a href=”http://d.p.hill.blog.163.com/blog/static/89123982009247426250/“>广州最简陋的法院(图)</a></li>
<li><a href=”http://adong360.blog.163.com/blog/static/21725364200926103757559/“>两会会场外的各国记者</a></li>
<li><a href=”http://weimin17104.blog.163.com/blog/static/960595002009230258210/“>”无人”报亭背后的故事</a></li>
</ul>
</div>
我再用程序来解释他,
<div class=”list”>
<ul>
<?php
foreach ($list as $value) {
?>
<li><a href=”<?php echo $url?>”> <?php echo $title?></a></li>
<?php
}
?>
</ul>
</div>
很亲切吧!那我们倒推回去,实际一个页面的组成是这样的:

18

一个页面实际上是由一些有规则代码的块组成,那么这些块可以由程序的循环来解释。这一点的理解是构建一个大型CMS的基础。那么下面将一下CMS系统的基本结构,请看图,我喜欢用图来解释,这样比文字更直观。

23

简单说一下模块的设计,那么模块就是提取指定频道(可以是任一频道不一定是本频道的)的资讯,包括提取的条数,是否显示图片,是否显示描述文字,标题的字数,描述文字的字数等,这样再生成一段代码,去替换频道页面相应的模块名。就拿上面那段代码来做实例吧,
频道页面模板的显示代码:
<div class=”list”>
<ul>
{template_list}
</ul>
</div>
模块生成的代码:
<li><a href=”http://blog.163.com/jzchenyong/blog/static/1042960432009265137898/“>报道假币记者怒斥央行</a></li>
<li><a href=”http://adong360.blog.163.com/blog/static/21725364200926103415811/“>中国女性是出版业救星?</a></li>
<li><a href=”http://shiqinyao2005.blog.163.com/blog/static/665324720092695548890/“>如何成为女明星男朋友</a></li>
<li><a href=”http://keyunlu2006.blog.163.com/blog/static/41051792009269358859/“>怎样读书才能改变命运</a></li>
<li><a href=”http://d.p.hill.blog.163.com/blog/static/89123982009247426250/“>广州最简陋的法院(图)</a></li>
<li><a href=”http://adong360.blog.163.com/blog/static/21725364200926103757559/“>两会会场外的各国记者</a></li>
<li><a href=”http://weimin17104.blog.163.com/blog/static/960595002009230258210/“>”无人”报亭背后的故事</a></li>
那么在生成页面的时候用此代码替换。

这里讲的并不详细,只是提供给大家一个思路。如果想了解更多或者有好的想法讨论,可以在此发表评论或者发邮件elgin_chen’at’163.com,加我的QQ:31524932

    本站是提供个人知识管理的网络存储空间,所有内容均由用户发布,不代表本站观点。请注意甄别内容中的联系方式、诱导购买等信息,谨防诈骗。如发现有害或侵权内容,请点击一键举报。
    转藏 分享 献花(0

    0条评论

    发表

    请遵守用户 评论公约

    类似文章 更多