web 全栈 学习 2 一个好的页面是如何炼成的

第一章:Web页面内容的构成
2.Web内容的分工
一个Web页面可能的构成(视觉上看);
①文字、链接、标题
②交互入口(表单元素)
③图片(哪些类型)
④动画
Flash动画
HTML5 CSS3 动画
⑤音视频
背景音乐
Flash广告视频
HTML5视频
⑥交互效果

问题:如下元素或者内容,那个是网页中最重要的? (A)
A.html
B.jsascript
C.CSS
D.服务器端脚本
E.其他页面资源

3.从技术上看待一个页面
①HTML 负责内容与结构
-是骨架和肉体,没有内容,一切都是失去了意义
②CSS 负责样式与表现
-是装饰美化,是皮肤,是外貌,赏心悦目,人人喜欢
③JavaScript 负责动作与交互
-是动作,是增强,是机能。功能强大不但能提高体验,还能提高效率

4.负责内容的HTML
①结构
结构标签有哪些?(分块、组成部分、骨架)
②语义
语义标签有哪些?(纯内容、肢体)
③其他元素类型
图片(img、map)
对象(object、emed)

误区在哪里?语义标签为什么重要?半结构化与结构化?

*** 结构标签 ***
* 纯结构标签
- center - 居中对齐块
- div - 常用块控制标签
- span - 常用内联容器
- br - 换行
- head - 头部
- body - 主体
* 看标签的结构得注意很重要一点
- 标签本身的默认结构属性(块元素还是内容元素)
- 互相转换

*** 语义标签 ***
* 常见的有
- h1-hx
- p
- table
- li
- ul
- img
* 在 HTML5 中大大增多
- header nav footer article section aside figure summary details

5.负责样式的 CSS
①内容修改
- color、background、font
②选择器与优先级
- id、类、元素
③边框三要素与边距
- border(哪三要素)、margin
④空间与位置
- z-index、left、top、position

*表格布局 VS DIV+CSS
①什么是表格布局?
看一下新浪2007年的页面
②什么是div+css布局?
看一下新浪2008的年页面
③div+css就要通吃吗?
在合适的时候,用合适的标签
④表格就不能使用了吗?
不要太绝对,在二维数据展示的时候,还是合适用的

6.负责行为的JavaScript
①合法性验证,表单验证
②前后端数据交互,Ajax
③界面处理与动画实现,界面效果
④环境检测与系统API调用
⑤JavaScript优化课程放在《编写高效的JS以及前端的魔鬼细节》这一节

时间: 2024-10-08 21:48:54

web 全栈 学习 2 一个好的页面是如何炼成的的相关文章

Web全栈工程师修养

全栈工程师现在是个很热的话题,如何定义全栈工程师?在著名的问答网站Quora上有人提出了这个问题,其中一个获得了高票的回答是: 全栈工程师是指,一个能处理数据库.服务器.系统工程和客户端的所有工作的工程师.根据项目的不同,客户需要的可能是移动栈.Web栈,或者原生应用栈 深以为然,所以,全栈工程师应该分为Web全栈和App全栈.恰巧最近看了本有关Web全栈工程师的书,记录下其中一些观点. 笔记 应该从能力和思维方式两方面来判定一个人是否是一个合格的全栈工程师. 对于一些经理来说,宁可雇佣多个可管

web全栈开发工程师的趋势、价值

随着技术的发展.用户量的增加.客户端种类变多,每一个小小的细节都需要优化和考虑.在海量的访问量面前,也许改变一个按钮的位置和颜色就能影响上千万次的用户体验.如今的互联网产品已不是以一己之力就可以完成的乐高积木了,Web开发需要以某种可控的方式来管理.于是,所有认真对待互联网产品的大公司都引入了流水线开发流程,在这条流水线上诞生了多个非常专业的职位. 1. 岗位需要"T"型人才 要求你不仅"一样精"更要在"一样精"的基础上"百样通&quo

基于LeanCloud云引擎的Web全栈方案

LeanEngine-Full-Stack The FULL STACK DEVELOPER 复杂的项目, 协作分工, 自动化流程,代码组织结构,框架选择,国际化方案等 Generator 或者Seed LeanCloud Node.js 服务的 Web 全栈开发技术解决方案. 将基础架构, 自动化构建, 国际化方案等底层技术解决方案组织成一个整体. 整套方案Javascript代码全部使用ECMAScript6 Server端运行基于LeanEngine Node.js环境,npm  Expr

《web全栈工程师的自我修养》阅读笔记

在买之前以为这本书是教你怎么去做一个web全栈工程师,以及介绍需要掌握的哪些技术的书,然而看的过程中才发现,是一本方法论的书.读起来的感觉有点像红衣教主的<我的互联网方法论>,以一些自己的经历和感悟来阐述web全栈工程师需要具备哪些素质,而不仅仅是需要哪些技术.这算是我买的书中看的最快的一本书. 在阅读这本书之前,我对全栈工程师的理解还停留在node阶段,随着node在服务端的风生水起,有一段时间会认为使用nodejs作为服务端开发,前后端统一使用js开发,便是所谓的全栈开发,比较流行的技术栈

买《Python Web全栈工程师》专题视频课程送纸质图书

经过一年多时间的呕心沥血,Python立体化图书--<Python从小白到大牛>即将与大家见面了.所谓立体化图书包括:电子图书.视频.课件和服务等内容. <Python从小白到大牛>纸质图书将于10月上旬上市,为了答谢广大学员对智捷课堂以及关老师的支持,现购买51CTO学院<Python Web全栈工程师>专题视频课程的学员送一本<Python从小白到大牛>纸质版图书.请于购买课程后10个工作日内申请赠书,过期视为放弃.注意:苹果支付购买,以及打折活动购买不

买《Java Web全栈工程师之路》专题视频课程送纸质图书

<Java从小白到大牛>上市一年来,取得了比较好的成绩. 为了答谢广大学员对智捷课堂以及关老师的支持,现购买51CTO学院<Java Web全栈工程师之路>专题视频课程的学员送一本<Java从小白到大牛>纸质版图书.请于购买课程后10个工作日内申请赠书,过期视为放弃.注意:苹果支付购买,以及8折(含8折)一下活动购买不赠送图书.领取说明:加qq群:51CTO-关老师付费群 523714201 验证消息:用户名+订单号即可通过. 最好您在购买之前咨询客服人员,以免不符合赠

《web全栈工程师的自我修养》 读书笔记

作者:余果. 人民邮电出版社.2015年9月第1版. 值得轻快一读,另外此书里推荐的书籍很好.Full-Stack Engineer! 一.如何成为全栈工程师 1 定义:全栈工程师是指,一个能处理数据库.服务器.系统工程和客户端的所有工作的工程师.根据项目不同,可能分为移动栈.web栈,或原生应用程序栈. 2 研发流水线 产品经理 >交互设计>>视觉设计>>前端开发/后台开发>>测试>>发布 3 代表性的全栈框架 LAMP.MEAN 4 建议:先精后广

《Web全栈工程师的自我修养》读书笔记(转载)

[声明] 欢迎转载,但请保留文章原始出处→_→ 生命壹号:http://www.cnblogs.com/smyhvae/ 文章来源:http://www.cnblogs.com/smyhvae/p/5243181.html [正文] 豆瓣链接:https://book.douban.com/subject/26598045/ [目录] 01 什么是全栈工程师 02 如何成为全栈工程师 03 从学生到工程师 04 野生程序员的故事 05 工程师事业指南 06 全栈工程师眼中的HTTP 07 高性能

一个简单RPC框架是如何炼成的(IV)——实现RPC消息的编解码

之前我们制定了一个很简单的RPC消息 的格式,但是还遗留了两个问题,上一篇解决掉了一个,还留下一个 我们并没有实现相应的encode和decode方法,没有基于可以跨设备的字符串传输,而是直接的内存变量传递. 现在的RPC request不支持带参数的请求命令.如add(a, b), 如何在RPC消息中描述参数a,b . 下面我们处理掉这个编解码问题. 实际的RPC应用基本都是跨机器连接,所以无法直接传递内存变量,也就是说还需要将消息编码成 诸如字符串一类的可以跨设备传输的内容.具体的RPC消息