您的位置: 首页 > 技术文档 > 网页制作 > 基于标准的web项目开发模式探索
网页制作前台之javascript 回到列表 使用有趣的自定义标记来布局页面
 基于标准的web项目开发模式探索

作者:jxdawei 时间: 2006-12-15 文档类型:原创 来自:蓝色理想

本文讨论的是如果开发一个符合w3c标准的web站点,重点探讨在新的设计与开发模式下,web项目组中的美工/页面制作人员/后台程序员三者之间如何有效地配合。为了便于阅读,制作了一个微缩型的项目。大家可以先预览一下 最终效果 。

本文适合于对web标准已经有了初步了解的同行共同研究。对此感兴趣的朋友欢迎在博客里发表您的评论。

项目内容:首页上的一个新闻列表

项目人员:网站美工一名/页面制作人员一名/程序员一名。(有很多人是三者合一的,哈哈。)

美工主要负责出效果图,截图。如下图:

然后对该图进行提取,得到相应的背景图片,见项目img文件夹。

程序员的工作有几下几点:

  • 根据需求设计网站数据库结构。
  • 定义底层相应的对象,如:user/news等等。
  • 定义数据访问层,包括访问数据库、编写存储过程等。
  • 提供表现层读取数据的方法供调用。

我这里定义的程序员几乎可以不了解html代码/javascript脚本/css样式。相对比较独立。项目中的程序员工作部分被我简化了,想了解的朋友可参考vs.Net2003中自带的几个例子,分层做得很有借鉴价值。

页面制作人员的工作:(PS:我给页面制作人员的定义可能有些超纲了。)

一:对美工的效果图进行初步的页面实现,如根据上边的效果图,初步可写成以下代码:

<h4>八卦新闻</h4>
<ul>
<li>大学生为啥争当农民</li>
<li>TVB制造8大极品女明星</li>
<li>上流社会秘密旅馆的真相</li>
<li>大学生洗鸳鸯浴被曝光</li>
<li>男明星性感阳刚露点</li>
<li>明星挖鼻抠脚丑态</li>
<li>陈好是怎样变成美女的</li>
<li>X光揭秘魔术师"吞剑"</li>
<li>西安一村“喝尿”强身</lil>
<li>汪明荃青春惊艳旧照片 </li>
</ul>

二:将需要动态生成的部分换成程序员提供的相应接口,如例子中的代码为:

<ul>
<%
Call LoadTopNews()
%>
</ul>

如果程序员对html代码不熟悉,表现层的很多程序代码也应该由页面制作人员来实现,如上边的LoadTopNews()中涉及到了html代码,此部分如页面制作人员完成不了,也应该与程序员共同协商。根据页面制作人员的需要写出相应的程序代码。

三:CSS的页面效果实现。详见项目中的css/Style.css。(略)

四:Javascript脚本的编写。本例子中仅设计了新闻的折叠显示功能,详见项目中js/common.js。(略)

写得有点粗糙,欢迎同行一起探讨!

源代码下载:一个简单的基于标准的web项目

经典论坛讨论
http://bbs.blueidea.com/thread-2702960-1-2.html

出处:蓝色理想
责任编辑:moby

◎进入论坛网页制作网站综合版块参加讨论

相关文章 更多相关链接
Sun首页改版分析
美日网站设计比较
fireworks设计网页平面稿入门
使用有趣的自定义标记来布局页面
当前的网站设计风格
作者文章
改善用户体验之密码强度提示
RSS 在线阅读器开发实例
改善用户体验之alert提示效果
热门搜索:CSS Fireworks 设计比赛 网页制作 Dreamweaver Studio8 Flash
站点最新 站点最新列表
跟我去香港:The third Day
单件模式结合命令链模式
快乐狗原创动漫大赛
元素层叠级别及z-index剖析
CSS 浏览器的等宽空格
电影变形金刚概念画欣赏
疯狂的程序员 第三十五回
疯狂的程序员 第三十四回
疯狂的程序员 第三十三回
运用ASDoc工具
栏目最新 栏目最新列表
火星人的耳机
公司正式宣布创业失败
用corelDEAW 12打造唇膏
二行代码解决全部网页木马
一行代码解决iframe挂马
Photoshop制作星空爆炸效果
CorelDraw 12打造休闲裤
Firework如何画特殊的切角图形
Firework打造韩式风格的手提袋
flash实例:打造佛光效果
 

蓝色理想版权申明:除部分特别声明不要转载,或者授权我站独家播发的文章外,大家可以自由转载我站点的原创文章,但原作者和来自我站的链接必须保留(非我站原创的,按照原来自一节,自行链接)。文章版权归我站和作者共有。

转载要求:转载之图片、文件,链接请不要盗链到本站,且不准打上各自站点的水印,亦不能抹去我站点水印。

特别注意:本站所提供的摄影照片,插画,设计作品,如需使用,请与原作者联系,版权归原作者所有,文章若有侵犯作者版权,请与我们联系,我们将立即删除修改。

本文暂时没有评论和评分

您的评论
用户名:  口令:
说明:输入正确的用户名和密码才能参与评论。如果您不是本站会员,你可以注册 为本站会员。
注意:文章中的链接、内容等需要修改的错误,请用报告错误,以利文档及时修改。
不评分 1 2 3 4 5
注意:请不要在评论中含与内容无关的广告链接,违者封ID
请您注意:
·不良评论请用报告管理员,以利管理员及时删除。
·尊重网上道德,遵守中华人民共和国的各项有关法律法规
·承担一切因您的行为而直接或间接导致的民事或刑事法律责任
·本站评论管理人员有权保留或删除其管辖评论中的任意内容
·您在本站发表的作品,本站有权在网站内转载或引用
·参与本评论即表明您已经阅读并接受上述条款
推荐文档 | 打印文档 | 评论文档 | 报告错误  
专业书推荐 更多内容
大师之路--Photoshop 完全解析
《超越CSS》新书上市
Don't Make Me Think 第2版
HTML与CSS入门经典(第7版)
《FLASH MX2004网站开发精粹》
《CSS入门经典》
《设计师谈网页设计思维》
作品集 更多内容

戴可普健康产品集团黑白广告 迷上手作 公司留念 宁波人防综合信息网 奇丽的花 DreamESP 公司网站 美饰美刻