对html制作新手的一些建议，大牛可以忽略
本篇主要讲前端并给制作html页面的新手一些建议，大牛勿喷大牛可以绕过。
感受：我是搞后端开发的，有时拿到一些静态（Html）页面，看到里面的页面结构命名规则极不规范，就有点不好的
感觉了。当然出现这样的情况都是发生在新人身上，一般会拿出以往的规范页面、命名DEMO给TA看下，也是为了
提高开发效率。
目的：本篇不是介绍规范，标准的规范请参考W3C。只是一种放之四海较为皆准的一种套路，也是为了制作新手能更好的上手。
编码能力是一回事，这里也不讨论，这里仅仅说一些个人觉得还可以的方法。
废话到此为止，看代码
一、页面编码结构及基础的命名规范
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<!--页面编码：以UTF-8居多-->
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title> <!--额外样式以及引用的外部样式文件，其中相对路径和绝对路径这里暂不讨论-->
<style type="text/css"></style> <!--额外脚本以及引用的外部Js、Jquery库等
--><script type="text/javascript"></script>
</head>
<body> <!--头部标签 有的时候header会包含在warp，但最好给独立标签--> <div id="header"> <!--导航标签 注：虽然有时候头部和导航会合二为一，但不能图省事而混为一谈--> <div id="Nav"> <ul>
<li><a href="##">Nav1</a></li>
<!--或-->
<li><a href="##"><span>Nav1</span></a></li> </ul>
</div> </div> <!--页面主体 页面主体ID按我的习惯用Warp和Main比较多-->
<div id="wrap"> <!--左侧内容 一般为左侧导航，后面接着广告位、简单的联系信息或者快速搜索等-->
<div id="LeftContent"> <!--左侧导航-->
<div id="LeftNav">
<ul>
<li><a href="###">Jump To</a></li>
</ul>
</div> <!--广告位-->
<div id="Ad" ></div> <!--简单联系信息-->
<div id="Contact" ></div>
</div> <!--右侧主体内容 这里面就自由发挥，不赘述-->
<div id="RighrContent"></div>
</div> <!--底部 包括了版权 备案号、统计代码、推广代码等各种代码的均加到此处-->
<div id="footer"></div>
</body>
</html>
1、相信大多数新手还是看的懂得。页面总共化为为<head>、<header>、<warp>、<footer>，以上将页面划分为四块
有时候也会有三块，情况是<header>包含在了<warp>里面。具体的因设计页面来灵活调整。其实无论分几块，主要是
各个块独立成标签形成规律，这样的话在后续程序开发中<header>、<footer>以及上述代码中的<div id="LeftContent">等标签可
以使用公用控件利于后端开发效率以及后期维护
二、页面文件结构
1、如图这是一个基本的文件结构方式。其中NewsCenter、Product为各栏目，一定要按栏目建立文件夹然后在里面建立页面文件。
要不然所有页面全部放在根目录，刚开始做的时候还不觉得，给另外的人用或者自己改，那就眼睛瞎了。 2、其次也是最为重要的页面元素文件(我自己定义的)，全部放在skins文件夹里面，然后按文件属性再建立文件夹然后再建立对应文件。
本文要讲述的是一种在开发规范和标准，为了团队更好的协作开发，而这些都需要首先对自己提高要求。
博文仅代表个人观点，博文为原创，如有转载请在明显位置注明作者名称和博客园文章地址。
对html制作新手的一些建议，大牛可以忽略的更多相关文章
- 给Java新手的一些建议----Java知识点归纳(J2EE and Web 部分)
J2EE(Java2 Enterprise Edition) 刚出现时一般会用于开发企业内部的应用系统,特别是web应用,所以渐渐,有些人就会把J2EE和web模式画上了等号.但是其实 J2EE 里面 ...
- 给Java新手的一些建议----Java知识点归纳(Java基础部分)
写这篇文章的目的是想总结一下自己这么多年来使用java的一些心得体会,主要是和一些java基础知识点相关的,所以也希望能分享给刚刚入门的Java程序员和打算入Java开发这个行当的准新手们,希望可以给 ...
- 给Java新手的一些建议——Java知识点归纳(Java基础部分)
原文出处:CSDN邓帅 写这篇文章的目的是想总结一下自己这么多年来使用java的一些心得体会,主要是和一些Java基础知识点相关的,所以也希望能分享给刚刚入门的Java程序员和打算入Java开发这个行 ...
- 给Java新手的一些建议——Java知识点归纳(Java基础部分)
写这篇文章的目的是想总结一下自己这么多年来使用java的一些心得体会,主要是和一些java基础知识点相关的,所以也希望能分享给刚刚入门的Java程序员和打算入Java开发这个行当的准新手们,希望可以给 ...
- 新手在sae部署程序容易忽略的一个细节
从来没用过这类云空间服务,尝了下鲜试用一下sae,但是部署的时候发现问题了,各种404..各种无奈啊..虽然百度无数篇介绍,但是都千篇一律没什么启发.. 但是巧在我部署的应用有个欢迎页面,点击链接的时 ...
- .NET开发中基础问题,CODE First AND DB First(大牛自动忽略,小白可以看一下)
最近在做一个新项目开发时,碰到了下面这个问题.在使用EF时,提示错误信息 To continue using Database First or Model First ensure that the ...
- 编写更好的jQuery代码的建议
讨论jQuery和javascript性能的文章并不罕见.然而,本文我计划总结一些速度方面的技巧和我本人的一些建议,来提升你的jQuery和javascript代码.好的代码会带来速度的提升.快速渲染 ...
- ROS探索总结（三）——ROS新手教程【转】
转自:http://blog.csdn.net/hcx25909/article/details/8811313 版权声明:本文为博主原创文章,未经博主允许不得转载. 目录(?)[-] 一ROS的 ...
- 编写更好的jQuery代码的建议（share）
留个备份! 原文链接: Mathew Carella 翻译: 伯乐在线- yanhaijing译文链接: http://blog.jobbole.com/52770/ 讨论jQuery和javas ...
随机推荐
- AFNetworking 3.0的GET和POST的使用
POST: AFHTTPSessionManager *session = [AFHTTPSessionManager manager]; session.requestSerializer = [A ...
- Smtp协议与Pop3协议的简单实现
前言 本文主要介绍smtp与pop3协议的原理,后面会附上对其的简单封装与实现. smtp协议对应的RFC文档为:RFC821 smtp协议 SMTP(Simple Mail Transfer Pro ...
- js中的apply call 操作小结(参考自网络)
1.方法定义 call方法: 语法:call([thisObj[,arg1[, arg2[, [,.argN]]]]]) 定义:调用一个对象的一个方法,以另一个对象替换当前对象 说明: call ...
- Linux 挂载iso,并设置为源
ubuntu在安装lsb-core时需要从 /media/cdrom中查找源,无奈我机器的光驱被我换为硬盘了,无法安装光盘,只有在网上下载的iso文件在硬盘中,所以把iso挂载到它要查找位置 执行: ...
- jquery读取后台代码
前台代码: <script type="text/javascript"> $(function () { $("#btn") ...
- JQUERY1.9学习笔记 之基本过滤器(三)偶数选择器
偶数选择器 jQuery( ":even" ) 例:查询偶数个表格的行. <!DOCTYPE html><html lang="zh-cn"& ...
- ubuntu 14.下 netbeans 自体锯齿 消除
Ubuntu下NetBeans消除字体锯齿的方法 在netbeans.conf 文件的netbeans_default_options的最后添加 -J-Dswing.aatext=true -J-Da ...
- 关于ASP.NET MVC中的视图生成
在 ASP.NET MVC 中,我们将前端的呈现划分为三个独立的部分来实现,Controller 用来控制用户的操作,View 用来控制呈现的内容,Model 用来表示处理的数据. 从控制器到视图 ...
- Django新手图文教程
Django新手图文教程 本文面向:有python基础,刚接触web框架的初学者. 环境:windows7 python3.5.1 pycharm专业版 Django 1.10版 pip3 一 ...
- Android中的webview的进度条
<application android:icon="@drawable/hunqin" android:label="@string/app_name" ...