|
马上注册,结交更多好友,享用更多功能,让你轻松玩转社区。
您需要 登录 才可以下载或查看,没有帐号?立即注册
x
DIV本身就是容器性质的,你不但可以内嵌table还可以内嵌文本和其它的HTML代码CSS是CascadingstyleSheets的简称,中文译作“层叠样式表单”。
网页教授教养中心提醒:我们处置的事情复杂的说就是“将计划稿转换成WEB页面”,这一历程能够很复杂到间接把PSD从PS里导出成网页;也可庞大到必要思索页面中每一个标签的利用,思索“页面功能”。以“前端工程师”为方针的同砚大概会不肯供认将页面重构这块分出来,但跟着工种的细分,加上页面重
做为一个专职的页面重构者,我们处置的事情复杂的说就是“将计划稿转换成WEB页面”,这一历程能够很复杂到间接把PSD从PS里导出成网页;也可庞大到必要思索页面中每一个标签的利用,思索“页面功能”。以“前端工程师”为方针的同砚大概会不肯供认将页面重构这块分出来,但跟着工种的细分,加上页面重构自己的专业性,自力为一个职业也不是不成能,最少我如今处置的就是一个专职的职位。假如你以为一个前端工程师必需往画计划稿,能够不睬会上面的内容。
纯真的页面重构,所触及到的事情内容通常为“剖析计划稿=>切图=>写HTML和CSS”,固然看起来很少,但要做好这份事情,尽非所想的那末简单。缘故原由很复杂:事情内容单一,在工夫和事情量上必会很刻薄,常常跟计划师的事情工夫是3:1,即计划师给三天的工夫,制造只给一天的工夫完成;在这类事情强度下,良多人都是靠着对这份事情的喜好在保持着,一旦事情热忱消散,很简单就会变得单调,坚持热忱同样成了重构事情者(大概是一切列入事情的人)应当具有的才能。
跟“前端工程师”所请求的有所分歧,“页面重构”固然也是“前端工程师”的一个范围,退职业化中,对专职的页面重构者,请求固然也更高。不但是做出页面,而是做出好页面。又引出另外一个话题,“作甚好页面?”,一样平常包含上面几点:
- 布局完全,可经由过程尺度考证
- 标签语义化,布局公道
- 充实思索到页面在站点中的“感化和主要性”,并对其举行有针对性的优化
良多同砚几都碰到过偏向不明,不晓得本人应当进步些甚么,我们能够从“剖析计划稿=>切图=>写HTML和CSS”这个事情内容,针对每点提出一些请求,以便利我们剖析本人的才能程度,为持续进步断定个偏向:
一,计划稿的剖析
计划稿的剖析是指对计划稿怎样制造成页面的剖析,即哪一块的内容能够做为大众的部分、哪一块的内容布局能够怎样完成等。对计划稿的剖析才能能够分别成上面的几个阶段:
- 能分清计划稿中的大众与公有的部分
- 在1的基本上对各部分的完成体例有一个开端的计划(包含怎样切图、写布局、写款式)
- 在1的基本上,正确的给出各部分的完成计划(包含怎样切图、写布局、写款式)
- 在3的基本上,能同时思索计划的扩大性、复用性及页面功能(包含怎样切图、写布局、写款式)
- 在4的基本上,思索整站的布局散布(包含文件散布、目次布局)
下面这些都是在还没入手下手下手制造之前所要做的。
二,切图
切图是指将计划稿切成便于制造成页面的图片。都有个误区,以为切图就是把图片切出来,实在其实不完整是如许,还包含把切出来的图片兼并到一同,怎样切、从哪切才干将功能最年夜化,说“切图是一门艺术”完整不为过。切图也能够分别成几个阶段:
- 切成所必要的图片(怎样将必要的部分切出来)
- 在1的基本上,对切出来的图片举行一些优化(包含紧缩文件巨细、选择图片范例)
- 在2的基本上,计划切出来的图片(包含文件散布)
- 在3的基本上,思索全体的功能(包含兼并图片、紧缩文件巨细)
HTML和CSS的编写
HTML和CSS的编写是指将下面完成的内容,经由过程HTML和CSS的编写,将计划稿转换成WEB页面最主要的一块,也是我们所要重点把握的内容,把它们放在一同,是由于它们互相的联系关系性太强,HTML的写法会影响到CSS的写法,它又能够分别成上面几个阶段:
- 复原计划稿视觉效果,并经由过程尺度考证(HTML)
- 在1的基本上,完成多扫瞄器的兼容(HTML)
- 在2的基本上,标签语义化(HTML)
- 在3的基本上,选择较优的完成体例(包含模块化布局,便利程序剧本利用,HTML和CSS)
- 在4的基本上,思索到扩大性、复用性和可保护性(HTML和CSS)
- 在5的基本上,思索到整站的款式散布(包含怎样完成散布)
- 在6的基本上,款式写法的优化(包含技能的使用)
是对所碰到成绩的办理才能,这一点在分歧的阶段都大概会碰到,以是没有写到下面。
假如你已到达或凌驾3、4、5,祝贺你,你已是一个职业的“页面重构事情者”了。为了我们本身的开展,存眷新手艺、手艺立异、进步用户体验、审美妙、程序剧本的完成体例等,也是非常需要的。人人一同前进吧。
你的设计不仅仅用于web浏览器,也可以发布在其他设备上,比如PowerPoint。 |
|