首先说一下HTML网页的制作方法:
1。拿到美工设计图开始切图
2。用表格把切的图拼成一个网页
3。把内容放在已经编排好的空白处
HTML网页制作步骤:
1。内容大刀阔斧划分
2。简单排版
3。细细品位设计
4。兼容性与标准
1。内容划分
将内容大刀阔斧的进行划分:Logo,导航,文章标题,作者,发布时间,Copyright等等,用代码表示就是:
- <div id="context">
- <div id="logo"></div>
- <ul>
- <li>菜单1</li>
- <li>菜单2</li>
- </ul>
- <div id="items">
- <div class="item">
- <span class="title"></span>
- <span class="author"></span>
- <span class="time"></span>
- <div class="memo">
- </div>
- </div>
这时我们拿到了设计师的设计稿,设计师们已经用很漂亮的颜色,很漂亮的版式为我们设计出了这个网页,这时就是CSS发挥威力的时候了,我们将原来定义的内容用CSS进行排版,用颜色块(先不要着急切图)对内容进行区分,先不要着急加背景图,因为那样只会扰乱你自己。
3。细细品位
这是网页的大体架构已经出来了,但是需要对设计师的页面进行细细品位了,为了效果设计师多会加一些阴影或者好看的背景图片,或者渐进式的图片,此时我们可能要在原有内容中加入一些辅助的标签来放置这些背景或点缀图片,但原则是尽可能的少加,能用原标签背景做的就用背景做,此处也比较考验制作人的CSS功力。
4。兼容性
我们还要在多款浏览器中做一下测试,看一下是否在每个浏览器中均正常,然后把代码尽可能的向XHTML标准靠拢。咱们的FarideaRSS已经顺利通过了XHTML的检验。