[email protected]网页制作基础
网页制作基础[email protected]创想灵动http://loo2k.com/
View Slide
预告 notice1. 网页制作基础知识；2. 网页代码的编写；3. 网站制作案例分享；
预告 notice1. 不会教你如何使用 Dreamweaver；2. 不会手把手教你怎么制作网页；3. 不会有任何复杂的技术；
为什么不用DW1. 臃肿，速度慢，过时；2. 生成垃圾代码；3. 普通用户的玩具；4. 有更靠谱的工具；
不手把手教网页1. 网页是如何工作的？2. 需要学习哪些东西？3. 该如何学习网页制作？那要教什么？
没有复杂的技术1. 这是一节基础课；2. 给网页制作初学者；3. 你需要了解一些基本概念；
开始学习 begin1. 网站服务器 server；2. 域名 domain；3. 浏览器 browser；4. 编辑网页 edit；5. 网页代码 webpage；
网站服务器 server1. 放在机房里面的一台电脑；2. 存放网站和网页的地方；3. 不关机，有网络，随时随地访问；4. 固定的访问地址 eg. 210.38.160.89；
域名 domain1. 顶级域名 eg. loo2k.com；2. 绑定服务器的地址，帮助记忆；访问域名查询域名对应的IP地址访问地址
浏览器 browser1. 有哪些浏览器？2. 网页如何在浏览器里面工作？
Internet Explorer 6:Internet Explorer 6:Internet Explorer 6:Internet Explorer 6:微软2000年推出的一款浏览器，至今已历史悠久。现代浏览器现代浏览器现代浏览器现代浏览器::::推荐使用性能优越的「谷歌浏览器」
网页在浏览器里工作在浏览器里访问一个网站网址网站所在的服务器返回代码给浏览器浏览器显示
编辑网页 edit1. 网页是一个 html 文件；2. 如何编辑网页；3. 编辑工具 记事本；
网页是个 HTML 文件
如何编辑网页网页的背后是一个 HTML 文档，编辑一个 HTML 文档就相当于在编辑一个网页。
编辑工具1. 创建一个记事本文件；2. 重命名为 index.html；3. 打开方式使用记事本；
网页代码 webpage1. HTML （结构&内容）2. CSS （样式）3. JavaScript （动作）
HTML 超文本标记语言网页制作第一课这是一个段落。文档声明文档标题文档内容
HTML 超文本标记语言文档标题文档内容
HTML 超文本标记语言标题段落元素元素元素元素 ((((标记标记标记标记))))：：：：h1~h6, 标题p, 段落ul, 列表……属性：属性：属性：属性：属性名=“属性值”例子中，id的属性值为para元素结束标记：元素结束标记：元素结束标记：元素结束标记：多为元素名>
HTML 超文本标记语言标题段落链接AAAA元素元素元素元素 ：：：：代表的是一个超链接hrefhrefhrefhref属性属性属性属性 ：：：：链接指向的地址链接文字链接文字链接文字链接文字 ：：：：标签包含的文字
HTML 超文本标记语言
HTML 超文本标记语言标题段落IMGIMGIMGIMG元素元素元素元素 ：：：：代表的是一个图片srcsrcsrcsrc属性属性属性属性 ：：：：指向图片的地址自结束标签自结束标签自结束标签自结束标签 ：：：：直接在标签内结束
如何学习 HTML1. 了解 HTML 的历史 (wikipedia)；2. 多翻几遍文档 (w3school.com.cn)；3. 了解常用的 HTML 元素；4. 用！
CSS 层叠样式表<br/>#para {<br/>font-weight: bold;<br/>font-size: 18px;<br/>color: red;<br/>}<br/>选择 id 属性值为para的元素1. 字体为粗体；2. 字体大小18px；3. 字体颜色为红；style元素
CSS 层叠样式表1. 字体为粗体；2. 字体大小18px；3. 字体颜色为红；
CSS 层叠样式表<br/>#para {<br/>font-weight: bold;<br/>font-size: 18px;<br/>color: red;<br/>}<br/>元素选择器属性属性值
CSS 层叠样式表<br/>h1 {<br/>background-color: grey;<br/>text-align: center;<br/>border: 1px solid black;<br/>}<br/>选择标签为 h1的元素1. 背景颜色为灰色；2. 文字居中；3. 边框为1像素的黑色；
CSS 层叠样式表1. 背景颜色为灰色；2. 文字居中；3. 边框为1像素的黑色；
如何学习 CSS1. 了解 CSS 的历史 (wikipedia)；2. 多翻几遍文档 (w3school.com.cn)；3. 了解 CSS 选择器和常用属性；4. 用！
JavaScript 脚本语言<br/>alert('网页制作第一课');<br/>script元素在网页中弹出一个窗口，并显示“网页制作第一课网页制作第一课网页制作第一课网页制作第一课”
JavaScript 脚本语言
如何学习 JavaScript1. 了解 JavaScript 的历史 (wikipedia)；2. 多翻几遍文档 (w3school.com.cn)；3. 了解基本的编程概念；4. 用！
只有这么多么？NO!
放心 be ease初学者只要掌握好HTML&CSS 就能做出普通的网页了。
案例分享 case share嘉应学院名师讲坛专题网http://210.38.160.89/msjt
网页制作流程 process确认网站主题，确认风格画草图&分镜表绘图工具制作效果图
网页制作流程 process调试&除错上传到服务器发布编写HTML结构，CSS实现样式，JS实现效果
确认主题风格BLUE蓝色蓝色蓝色蓝色::::蓝色属于冷色调，让人联想到海洋，天空。代表着沉稳、冷静、稳重以及智慧。能凸显名师讲坛的主题。
画草图&线框图画草图和线框图是为了让自己确认网页的大致效果；而且先画草图的成本比你一上来就开始做PS效果图或者敲网页代码低；
PS 绘制效果图
编写代码
调试&除错
上传到服务器发布
提问时间 Q&A
联系 Contact� 邮箱：[email protected]� 博客：loo2k.com� 微博：@LOO2K� Twitter: @LOO2K
Thanks ☺
yoshikikomoriya
hayaok3
naoto_pq
bun913
salaboy
tsukubachallenge
takagimeow
kawaguti
tkhresk
watany
hcrane
maaaato
sonatard
mza
robhawkes
brianwarren
destraynor
sachag
zenorocha
jponch
bkeepers
moore
jacobian