一、一个独立的页面 
1、分析这个页面，在脑海或草稿上要确立页面板块布局（如版块区域的，位置和大小）
2、根据设计稿的的情况，分析背景图的分布、ICO图的分布等 
3、切割相应的图片，导出、合并图片(一般用ps 切割设计师提供的PSD图)
4、在编辑器中写整体结构XHTML代码，包括页面中出现的所有元素的结构 
5、编写CSS样式中的整体以及模块代码 
6、细节调整
7、浏览器验证网页兼容性，是否正确显示
二、由多个页面组成的小站点或者大站点 
1、浏览所有设计稿，统一规划站点模块、图片、文件分布
2、开始第一点的操作，但规划站点的内容分布很重要
整体考虑点： 
图片的合并，减少请求量 
结构的合理性，语义化 
样式的简洁，便于后期维护 
多为后期的维护以及程序开发着想，如何简单实现效果

使用PSD设计网页页面的更多相关文章

  1. UI设计教程分享：电商网页页面设计常见表现手法

    1.手绘插画  场景.人物以及加上故事的创意绘画 会给人梦幻若隐若现的感觉,留下深刻的印象,适合做活动页面以及宣传自已的品牌 2.简约 颜色少于三色,背景以明度偏低的颜色为主,在信息大爆炸的时代,我们 ...

  2. 年度榜单：2013年最佳免费 PSD 设计素材揭晓

    <年度榜单>系列继续给大家带来2013年度发布的好东西,这篇文章要给大家分享的是本年度最佳的12套精美的 PSD 设计素材,你可以免费下载使用.这些免费素材不仅能帮助他们节省大量的时间,而 ...

  3. 20款风格独特的搜索框 PSD 设计素材免费下载

    搜索框是网站中的最常用的组件一直,但有时候,搜索框因为设计不够新颖容易被访客忽视.通过提高一个搜索框的外观设计,最终对整体的网页设计带来好的变化.这份列表将是一个很好的资源,尤其是对设计师.希望你会喜 ...

  4. 前端切图实战（PSD设计稿转化为前端）

    课程来源:https://www.imooc.com/learn/668 一:读设计稿 划分:头部.尾部.公共部分.大概分多少块.logo的重用.列表有哪些.各部分用什么技术实现等等. 二:建立项目目 ...

  5. 如何在自己设计的页面中调用metamask-1

    启发: https://github.com/MetaMask/metamask-extension/issues/714 https://github.com/MetaMask/metamask-e ...

  6. web网页 页面布局的几种方式（转）

    web网页 页面布局的几种方式 转载 2017年06月16日 12:19:40 2218 网页基本布局方式: (1)流式布局 Fluid 流布局与固定宽度布局基本不同点 就在于对网站尺寸的侧量单位不同 ...

  7. 设计网页录入信息与自己定义server数据接收

    需求:设计一个注冊网页用于录入username和登录password.并将数据传入server并显示出来. 1.前言:网页提交的 get 和 post 两种方式. (1)对于get提交方式,以本文中样 ...

  8. wordPress设计网页实践

    我希望能设计出世界上最美的画面! 首先进入你自己建立的网站http://localhost:8079/Frank,如上图所示.注意,编辑页面时,要可以上外网,否则wordPress的插件会下载出错! ...

  9. 设计Web页面(2)

    1.前面我们新建了一个空白的ASP.NET网页,那么接下来这章我们就讲一下设计Web页面 2.布局页面有两种方法,一种是通过Table表格来布局页面窗体,另一种是通过CSS+DIV来布局窗体,其中作为 ...

随机推荐

  1. MySQL几个注意点

    1.在创建表.对表进行操作之前,必须首先选择数据库.通过 mysql_select_db() 函数选取数据库.当您创建 varchar 类型的数据库字段时,必须规定该字段的最大长度,例如:varcha ...

  2. 学习JSONP

    最近自己研究 跨域调用js,然后 发现 有jsonp 这种技术,在Jquery中可以使用,于是 研究下原理 发现: 其实 就是 利用<script>的跨域访问的能力. 调用 服务端 返回的 ...

  3. C# 采用线程重绘图形要点记录

    大家都知道J2ME 采用一个线程去获取数据,然后得到数据后更新屏幕是件很容易的事情,比如Thread{public void run(){ getData();repaint(); } }这样做就OK ...

  4. ListView美化：去阴影、底色、选中色

    原文:http://blog.csdn.net/wxg630815/article/details/6987305 1.去滑动到顶点和底边时的黑色阴影 [html] view plaincopy   ...

  5. Android 使用 Gmail 来发送邮件

    Android 使用 Gmail 来发送邮件 1. [代码]SendMail.java package org.apache.android.mail; import android.app.Acti ...

  6. android145 360 进程管理

    package com.itheima.mobileguard.activities; import java.util.ArrayList; import java.util.List; impor ...

  7. TCP/IP协议知识科普

    简介 本文主要介绍了工作中常用的TCP/IP对应协议栈相关基础知识,科普文. 本博客所有文章:http://www.cnblogs.com/xuanku/p/index.html TCP/IP网络协议 ...

  8. C# TextBox 换行 滚动到最后一行

    .要让一个Windows Form的TextBox显示多行文本就得把它的Multiline属性设置为true. 这个大家都知道,可是当你要在代码中为Text属性设置多行文本的时候可能会遇到点麻烦:) ...

  9. Eclipse launch failed.Binary not found解决方案

    配置完成后建立工程测试,发现建立Hello World c++ Project类型的项目后可以运行测试,直接建立空项目写个测试类无法运行,提示"launch failed.Binary no ...

  10. Windows 平台下Git 服务器搭建

    由于项目中一直在使用git作为版本管理,自己对git的理解.使用都还不是怎么的熟悉,所以准备深入了解一下git及一些常用命令的使用,于是干脆把服务端架上,通过自己的PC作为服务端同时作为客户端的角色进 ...