设为首页收藏本站

澳纽论坛

 找回密码
 注册

QQ登录

只需一步,快速开始

搜索
查看: 520|回复: 0

www.ggx8.com/weige PS转换html实践常识:PS切图到CSS+XHTML步骤

[复制链接]

3

主题

0

好友

3

积分

新手上路

Rank: 1

买家信用
卖家信用
收听数
0
听众数
0
UID
38761
威望
0
金钱
0
主题
3
帖子
3
精华
0
积分
3
阅读权限
10
注册时间
2012-2-22
最后登录
2012-2-25
在线时间
0 小时
好友
0
记录
0
日志
0
相册
0
个人主页
分享
0
发表于 2012-2-26 22:08:35 |显示全部楼层
最近一段时光发明友人许多在网页制作教程中寻找如何ps切图到html转换的教程,都说例子很丰盛,然而缺乏实践支持,不知道ps to html转换的正确步骤。
这里给大家一点倡议。
实在尺度的网制作完成的工作实际是:psd to html,武汉伟哥,个别情况下,我们会拿到美工的psd,这时候不同的人会有不同的做法:
翻开photoshop/fireworks将图片切割导出为(x)html。
直接在dreamweaver之类的工具去拖沓布局,导入相干的图片、flash资源。
先在ps中实现切图后,在文本编纂器中看着后果图一步步的制造。
  
以上是大多被采取的办法,但都不好:

第一种方法最为不好,这样的代码基本不具维护性跟可读性。
第二种方式也不好,ywd321.org/ggx8,代码未免会有冗余,做出来的货色基础需要排查一遍,人体艺术 深圳反思(下) 挤压空间的行政力气。
第三种方法也不好,由于你需要看效果图一点点的拼,也就是说写html标签的时候,你在不断的假设这块要怎么去显示。
  
准确的做法是:

拿到psd后,先不要做别的,直接在文本编辑器中将网页的框架写出来,不要假设这块未来css要去怎么渲染,完整天然化的标签,不加任何的css。
写完之后在各个阅读器运行之后确保大体定位都不问题。
书写总体css,这里的css只负责大块的定位及款式。
切出须要的图片资源,在写好的框架中一点点的去结构,一直的调试,终极为成品。
最后,为本人的代码增添解释,在css,html中都要适合的为自己的代码增加正文。
  
要想做出能机动切换皮肤,kkjy8/weig 秘方解秘 通治所有咽喉病!,让css主导表示,还有良多要留神的处所,但大体的流程就是这样的,当然咱们一开始不能直接就做到先写html,但最少要有这个意识,循序渐进,ggx8/weige。。。
==============================================================
psd出网站从两个大点斟酌
一、一个独破的页面

剖析这个页面,先在脑袋中或者草稿纸上刻画大略的结构
依据设计稿的的情形,分析背景图的分布、ico图的分布等
切割相应的图片,导出、合并图片
在编辑器中写整体结构xhtml代码,包含页面中呈现的所有元素的构造
编写css样式中的整体以及模块代码
细节调剂
收工,北京朝阳伟哥,浏览器验证是否正确
  
二、由多个页面组成的小站点或者大站点

浏览所有设计稿,增大胶囊 成大事必需依附的五种人跟十种手腕,同一规划站点模块、图片、文件分布
开端第一点的操作,但计划站点的内容散布很主要
  
三、整体考虑点
图片的合并,减少恳求量,结构的公道性,语义化,样式的简练,北京伟哥,便于后期保护,多为后期的维护以及程序开发着想,如何简略实现效果。

相关ps切图到ps转换的实例:
        1、css网页制作实例:ps切图将psd网站模板转换为xhtml+css网页
            zzarea/css/cssbj/css-733.html
        2、css布局:9个对于psd转换成div+css架构的教程
           zzarea/css/cssbj/css-747.html
        3、css网页制作教程-完全布局实例(十分具体的完整网页布局制作)
          zzarea/css/cssbj/css-710.html
本文起源网页制作教程网zzarea 原文链接:zzarea/css/cssjc/css-869.html
您需要登录后才可以回帖 登录 | 注册

手机版|Archiver|Sitemap|澳纽网   

GMT+12, 2019-11-21 17:13 , Processed in 0.091735 second(s), 23 queries .

Powered by Discuz! X2.5

© 2001-2012 Comsenz Inc.

回顶部