Submit Search
Upload
分层语义化模板实践 ---- 张克军
•
20 likes
•
1,114 views
裕波 周
Follow
webrebuild.org北京第一届交流会-悟道WEB标准,分层语义化模板实践。
Read less
Read more
Education
Technology
Design
Report
Share
Report
Share
1 of 35
Download now
Download to read offline
Recommended
Best of the Web V. V
Best of the Web V. V
David Kapuler
User Interface Prototyping
User Interface Prototyping
Hans Põldoja
Photo sharing
Photo sharing
dancermegan
AWSで秋のデプロイ祭! CodeDeploy JAWS-UG KOBE
AWSで秋のデプロイ祭! CodeDeploy JAWS-UG KOBE
Atsushi Ando
設計與程式的溝通之道
設計與程式的溝通之道
Even Wu
Prototyping and Wireframing tools
Prototyping and Wireframing tools
Damian T. Gordon
My Portfolio (Final)
My Portfolio (Final)
AmandaPaolitto
Herramientas en línea para edición de fotos
Herramientas en línea para edición de fotos
Gisela Rodríguez Verasmendis
Recommended
Best of the Web V. V
Best of the Web V. V
David Kapuler
User Interface Prototyping
User Interface Prototyping
Hans Põldoja
Photo sharing
Photo sharing
dancermegan
AWSで秋のデプロイ祭! CodeDeploy JAWS-UG KOBE
AWSで秋のデプロイ祭! CodeDeploy JAWS-UG KOBE
Atsushi Ando
設計與程式的溝通之道
設計與程式的溝通之道
Even Wu
Prototyping and Wireframing tools
Prototyping and Wireframing tools
Damian T. Gordon
My Portfolio (Final)
My Portfolio (Final)
AmandaPaolitto
Herramientas en línea para edición de fotos
Herramientas en línea para edición de fotos
Gisela Rodríguez Verasmendis
page 2015「クリエイティブゾーンセミナー」『Illustratorでの配置画像事情 2015』
page 2015「クリエイティブゾーンセミナー」『Illustratorでの配置画像事情 2015』
swwwitch inc.
Front End Development for Backend Developers - GIDS 2019
Front End Development for Backend Developers - GIDS 2019
Matt Raible
Front End Development for Back End Java Developers - NYJavaSIG 2019
Front End Development for Back End Java Developers - NYJavaSIG 2019
Matt Raible
Front End Development for Back End Developers - UberConf 2017
Front End Development for Back End Developers - UberConf 2017
Matt Raible
Html5 Overview
Html5 Overview
Daniel Arndt Alves
Front End Development for Back End Java Developers - West Midlands Java User ...
Front End Development for Back End Java Developers - West Midlands Java User ...
Matt Raible
Front End Development for Back End Java Developers - Dublin JUG 2019
Front End Development for Back End Java Developers - Dublin JUG 2019
Matt Raible
Beyond CSS Architecture
Beyond CSS Architecture
拓樹 谷
No Feature Solutions with SharePoint
No Feature Solutions with SharePoint
mikehuguet
Front End Development for Back End Java Developers - South West Java 2019
Front End Development for Back End Java Developers - South West Java 2019
Matt Raible
Front End Development for Back End Developers - vJUG24 2017
Front End Development for Back End Developers - vJUG24 2017
Matt Raible
JS Fest 2019. Minko Gechev. Building Fast Angular Applications by Default
JS Fest 2019. Minko Gechev. Building Fast Angular Applications by Default
JSFestUA
HTML5 Report Card
HTML5 Report Card
Michael(tm) Smith
High Performance Web Design
High Performance Web Design
Koji Ishimoto
Web Systems Architecture by Moshe Kaplan
Web Systems Architecture by Moshe Kaplan
Moshe Kaplan
建立前端開發團隊 - 2011 中華電信訓練所版
建立前端開發團隊 - 2011 中華電信訓練所版
Joseph Chiang
Front End Development for Back End Java Developers - Jfokus 2020
Front End Development for Back End Java Developers - Jfokus 2020
Matt Raible
3 ways-to-create-sprites-in-rails
3 ways-to-create-sprites-in-rails
Nico Hagenburger
Technical Introduction to YDN
Technical Introduction to YDN
Christian Heilmann
Front End Development for Back End Developers - Devoxx UK 2017
Front End Development for Back End Developers - Devoxx UK 2017
Matt Raible
web标准化交流会上海站bobby分享
web标准化交流会上海站bobby分享
裕波 周
web标准化交流会bobby分享
web标准化交流会bobby分享
裕波 周
More Related Content
Similar to 分层语义化模板实践 ---- 张克军
page 2015「クリエイティブゾーンセミナー」『Illustratorでの配置画像事情 2015』
page 2015「クリエイティブゾーンセミナー」『Illustratorでの配置画像事情 2015』
swwwitch inc.
Front End Development for Backend Developers - GIDS 2019
Front End Development for Backend Developers - GIDS 2019
Matt Raible
Front End Development for Back End Java Developers - NYJavaSIG 2019
Front End Development for Back End Java Developers - NYJavaSIG 2019
Matt Raible
Front End Development for Back End Developers - UberConf 2017
Front End Development for Back End Developers - UberConf 2017
Matt Raible
Html5 Overview
Html5 Overview
Daniel Arndt Alves
Front End Development for Back End Java Developers - West Midlands Java User ...
Front End Development for Back End Java Developers - West Midlands Java User ...
Matt Raible
Front End Development for Back End Java Developers - Dublin JUG 2019
Front End Development for Back End Java Developers - Dublin JUG 2019
Matt Raible
Beyond CSS Architecture
Beyond CSS Architecture
拓樹 谷
No Feature Solutions with SharePoint
No Feature Solutions with SharePoint
mikehuguet
Front End Development for Back End Java Developers - South West Java 2019
Front End Development for Back End Java Developers - South West Java 2019
Matt Raible
Front End Development for Back End Developers - vJUG24 2017
Front End Development for Back End Developers - vJUG24 2017
Matt Raible
JS Fest 2019. Minko Gechev. Building Fast Angular Applications by Default
JS Fest 2019. Minko Gechev. Building Fast Angular Applications by Default
JSFestUA
HTML5 Report Card
HTML5 Report Card
Michael(tm) Smith
High Performance Web Design
High Performance Web Design
Koji Ishimoto
Web Systems Architecture by Moshe Kaplan
Web Systems Architecture by Moshe Kaplan
Moshe Kaplan
建立前端開發團隊 - 2011 中華電信訓練所版
建立前端開發團隊 - 2011 中華電信訓練所版
Joseph Chiang
Front End Development for Back End Java Developers - Jfokus 2020
Front End Development for Back End Java Developers - Jfokus 2020
Matt Raible
3 ways-to-create-sprites-in-rails
3 ways-to-create-sprites-in-rails
Nico Hagenburger
Technical Introduction to YDN
Technical Introduction to YDN
Christian Heilmann
Front End Development for Back End Developers - Devoxx UK 2017
Front End Development for Back End Developers - Devoxx UK 2017
Matt Raible
Similar to 分层语义化模板实践 ---- 张克军
(20)
page 2015「クリエイティブゾーンセミナー」『Illustratorでの配置画像事情 2015』
page 2015「クリエイティブゾーンセミナー」『Illustratorでの配置画像事情 2015』
Front End Development for Backend Developers - GIDS 2019
Front End Development for Backend Developers - GIDS 2019
Front End Development for Back End Java Developers - NYJavaSIG 2019
Front End Development for Back End Java Developers - NYJavaSIG 2019
Front End Development for Back End Developers - UberConf 2017
Front End Development for Back End Developers - UberConf 2017
Html5 Overview
Html5 Overview
Front End Development for Back End Java Developers - West Midlands Java User ...
Front End Development for Back End Java Developers - West Midlands Java User ...
Front End Development for Back End Java Developers - Dublin JUG 2019
Front End Development for Back End Java Developers - Dublin JUG 2019
Beyond CSS Architecture
Beyond CSS Architecture
No Feature Solutions with SharePoint
No Feature Solutions with SharePoint
Front End Development for Back End Java Developers - South West Java 2019
Front End Development for Back End Java Developers - South West Java 2019
Front End Development for Back End Developers - vJUG24 2017
Front End Development for Back End Developers - vJUG24 2017
JS Fest 2019. Minko Gechev. Building Fast Angular Applications by Default
JS Fest 2019. Minko Gechev. Building Fast Angular Applications by Default
HTML5 Report Card
HTML5 Report Card
High Performance Web Design
High Performance Web Design
Web Systems Architecture by Moshe Kaplan
Web Systems Architecture by Moshe Kaplan
建立前端開發團隊 - 2011 中華電信訓練所版
建立前端開發團隊 - 2011 中華電信訓練所版
Front End Development for Back End Java Developers - Jfokus 2020
Front End Development for Back End Java Developers - Jfokus 2020
3 ways-to-create-sprites-in-rails
3 ways-to-create-sprites-in-rails
Technical Introduction to YDN
Technical Introduction to YDN
Front End Development for Back End Developers - Devoxx UK 2017
Front End Development for Back End Developers - Devoxx UK 2017
More from 裕波 周
web标准化交流会上海站bobby分享
web标准化交流会上海站bobby分享
裕波 周
web标准化交流会bobby分享
web标准化交流会bobby分享
裕波 周
前端架构漫谈
前端架构漫谈
裕波 周
从无阻塞并行脚本加载(Lab.js)到浏览器消息模型
从无阻塞并行脚本加载(Lab.js)到浏览器消息模型
裕波 周
从无阻塞并行脚本加载(Lab.js)到浏览器消息模型
从无阻塞并行脚本加载(Lab.js)到浏览器消息模型
裕波 周
白玉磊 Webrebuild
白玉磊 Webrebuild
裕波 周
彪叔 [2010]webrebuild
彪叔 [2010]webrebuild
裕波 周
Scrum敏捷项目管理
Scrum敏捷项目管理
裕波 周
移动设备web重构
移动设备web重构
裕波 周
重温网站重构
重温网站重构
裕波 周
从问题开始,前端,架构、框架与库的实战
从问题开始,前端,架构、框架与库的实战
裕波 周
从问题开始,谈前端架构
从问题开始,谈前端架构
裕波 周
Ie9 overview
Ie9 overview
裕波 周
《一专多长》——Twinsen[梁璟彪]
《一专多长》——Twinsen[梁璟彪]
裕波 周
浏览器兼容性问题简介 --- 黄昊
浏览器兼容性问题简介 --- 黄昊
裕波 周
揭秘Html5和Css3 ---- 鲁超伍
揭秘Html5和Css3 ---- 鲁超伍
裕波 周
网站重构Whoami ---- 偷米饭
网站重构Whoami ---- 偷米饭
裕波 周
javascript的分层概念 --- 阿当
javascript的分层概念 --- 阿当
裕波 周
More from 裕波 周
(18)
web标准化交流会上海站bobby分享
web标准化交流会上海站bobby分享
web标准化交流会bobby分享
web标准化交流会bobby分享
前端架构漫谈
前端架构漫谈
从无阻塞并行脚本加载(Lab.js)到浏览器消息模型
从无阻塞并行脚本加载(Lab.js)到浏览器消息模型
从无阻塞并行脚本加载(Lab.js)到浏览器消息模型
从无阻塞并行脚本加载(Lab.js)到浏览器消息模型
白玉磊 Webrebuild
白玉磊 Webrebuild
彪叔 [2010]webrebuild
彪叔 [2010]webrebuild
Scrum敏捷项目管理
Scrum敏捷项目管理
移动设备web重构
移动设备web重构
重温网站重构
重温网站重构
从问题开始,前端,架构、框架与库的实战
从问题开始,前端,架构、框架与库的实战
从问题开始,谈前端架构
从问题开始,谈前端架构
Ie9 overview
Ie9 overview
《一专多长》——Twinsen[梁璟彪]
《一专多长》——Twinsen[梁璟彪]
浏览器兼容性问题简介 --- 黄昊
浏览器兼容性问题简介 --- 黄昊
揭秘Html5和Css3 ---- 鲁超伍
揭秘Html5和Css3 ---- 鲁超伍
网站重构Whoami ---- 偷米饭
网站重构Whoami ---- 偷米饭
javascript的分层概念 --- 阿当
javascript的分层概念 --- 阿当
Recently uploaded
Staff of Color (SOC) Retention Efforts DDSD
Staff of Color (SOC) Retention Efforts DDSD
David Douglas School District
SOCIAL AND HISTORICAL CONTEXT - LFTVD.pptx
SOCIAL AND HISTORICAL CONTEXT - LFTVD.pptx
iammrhaywood
Presentation by Andreas Schleicher Tackling the School Absenteeism Crisis 30 ...
Presentation by Andreas Schleicher Tackling the School Absenteeism Crisis 30 ...
EduSkills OECD
call girls in Kamla Market (DELHI) 🔝 >༒9953330565🔝 genuine Escort Service 🔝✔️✔️
call girls in Kamla Market (DELHI) 🔝 >༒9953330565🔝 genuine Escort Service 🔝✔️✔️
9953056974 Low Rate Call Girls In Saket, Delhi NCR
BASLIQ CURRENT LOOKBOOK LOOKBOOK(1) (1).pdf
BASLIQ CURRENT LOOKBOOK LOOKBOOK(1) (1).pdf
SoniaTolstoy
Organic Name Reactions for the students and aspirants of Chemistry12th.pptx
Organic Name Reactions for the students and aspirants of Chemistry12th.pptx
VS Mahajan Coaching Centre
Crayon Activity Handout For the Crayon A
Crayon Activity Handout For the Crayon A
UnboundStockton
Mastering the Unannounced Regulatory Inspection
Mastering the Unannounced Regulatory Inspection
SafetyChain Software
Hybridoma Technology ( Production , Purification , and Application )
Hybridoma Technology ( Production , Purification , and Application )
Sakshi Ghasle
TataKelola dan KamSiber Kecerdasan Buatan v022.pdf
TataKelola dan KamSiber Kecerdasan Buatan v022.pdf
Sarwono Sutikno, Dr.Eng.,CISA,CISSP,CISM,CSX-F
Employee wellbeing at the workplace.pptx
Employee wellbeing at the workplace.pptx
NirmalaLoungPoorunde1
Science 7 - LAND and SEA BREEZE and its Characteristics
Science 7 - LAND and SEA BREEZE and its Characteristics
KarinaGenton
Introduction to AI in Higher Education_draft.pptx
Introduction to AI in Higher Education_draft.pptx
pboyjonauth
Class 11 Legal Studies Ch-1 Concept of State .pdf
Class 11 Legal Studies Ch-1 Concept of State .pdf
akmcokerachita
Interactive Powerpoint_How to Master effective communication
Interactive Powerpoint_How to Master effective communication
nomboosow
KSHARA STURA .pptx---KSHARA KARMA THERAPY (CAUSTIC THERAPY)————IMP.OF KSHARA ...
KSHARA STURA .pptx---KSHARA KARMA THERAPY (CAUSTIC THERAPY)————IMP.OF KSHARA ...
M56BOOKSTORE PRODUCT/SERVICE
Solving Puzzles Benefits Everyone (English).pptx
Solving Puzzles Benefits Everyone (English).pptx
OH TEIK BIN
Presiding Officer Training module 2024 lok sabha elections
Presiding Officer Training module 2024 lok sabha elections
anshu789521
Contemporary philippine arts from the regions_PPT_Module_12 [Autosaved] (1).pptx
Contemporary philippine arts from the regions_PPT_Module_12 [Autosaved] (1).pptx
RoyAbrique
Separation of Lanthanides/ Lanthanides and Actinides
Separation of Lanthanides/ Lanthanides and Actinides
FatimaKhan178732
Recently uploaded
(20)
Staff of Color (SOC) Retention Efforts DDSD
Staff of Color (SOC) Retention Efforts DDSD
SOCIAL AND HISTORICAL CONTEXT - LFTVD.pptx
SOCIAL AND HISTORICAL CONTEXT - LFTVD.pptx
Presentation by Andreas Schleicher Tackling the School Absenteeism Crisis 30 ...
Presentation by Andreas Schleicher Tackling the School Absenteeism Crisis 30 ...
call girls in Kamla Market (DELHI) 🔝 >༒9953330565🔝 genuine Escort Service 🔝✔️✔️
call girls in Kamla Market (DELHI) 🔝 >༒9953330565🔝 genuine Escort Service 🔝✔️✔️
BASLIQ CURRENT LOOKBOOK LOOKBOOK(1) (1).pdf
BASLIQ CURRENT LOOKBOOK LOOKBOOK(1) (1).pdf
Organic Name Reactions for the students and aspirants of Chemistry12th.pptx
Organic Name Reactions for the students and aspirants of Chemistry12th.pptx
Crayon Activity Handout For the Crayon A
Crayon Activity Handout For the Crayon A
Mastering the Unannounced Regulatory Inspection
Mastering the Unannounced Regulatory Inspection
Hybridoma Technology ( Production , Purification , and Application )
Hybridoma Technology ( Production , Purification , and Application )
TataKelola dan KamSiber Kecerdasan Buatan v022.pdf
TataKelola dan KamSiber Kecerdasan Buatan v022.pdf
Employee wellbeing at the workplace.pptx
Employee wellbeing at the workplace.pptx
Science 7 - LAND and SEA BREEZE and its Characteristics
Science 7 - LAND and SEA BREEZE and its Characteristics
Introduction to AI in Higher Education_draft.pptx
Introduction to AI in Higher Education_draft.pptx
Class 11 Legal Studies Ch-1 Concept of State .pdf
Class 11 Legal Studies Ch-1 Concept of State .pdf
Interactive Powerpoint_How to Master effective communication
Interactive Powerpoint_How to Master effective communication
KSHARA STURA .pptx---KSHARA KARMA THERAPY (CAUSTIC THERAPY)————IMP.OF KSHARA ...
KSHARA STURA .pptx---KSHARA KARMA THERAPY (CAUSTIC THERAPY)————IMP.OF KSHARA ...
Solving Puzzles Benefits Everyone (English).pptx
Solving Puzzles Benefits Everyone (English).pptx
Presiding Officer Training module 2024 lok sabha elections
Presiding Officer Training module 2024 lok sabha elections
Contemporary philippine arts from the regions_PPT_Module_12 [Autosaved] (1).pptx
Contemporary philippine arts from the regions_PPT_Module_12 [Autosaved] (1).pptx
Separation of Lanthanides/ Lanthanides and Actinides
Separation of Lanthanides/ Lanthanides and Actinides
分层语义化模板实践 ---- 张克军
1.
http://hikejun.com twitter: @kejunz
2.
Me. • • • http://hikejun.com • twitter:
@kejunz
3.
L(ayered) S(emantic) M(arkup)
4.
MVC L(ayered) S(emantic) M(arkup)
5.
MVC
IA L(ayered) S(emantic) M(arkup)
6.
Designer FrontEnd Engineer
demo http://hikejun.com/work/qq/spec/example_mod_compare.html
7.
PRD PSD HTML
CSS
8.
PRD PSD HTML
CSS
9.
PRD PSD
HTML CSS
10.
PRD PSD
HTML CSS
11.
JS PSD
CSS HTML Prototype PRD
12.
JS
C- PSD CSS V- HTML Prototype M- PRD
13.
Javascript
( ) CSS ( ) HTML
14.
UI
15.
step 1:
HTML wireframe demo: http://hikejun.com/work/qq/share_8.4/page_naked.png
16.
step 2: reset
rules( ) demo: http://hikejun.com/work/qq/share_8.4/page_base_style_1.png
17.
step 3:
( ) demo: http://hikejun.com/work/qq/share_8.4/page_base_style_2.png
18.
step 4: demo: http://hikejun.com/work/qq/share_8.4/page_base_style_3.png
19.
step 5:
/
20.
•
UI • •
21.
HTML
22.
23.
24.
25.
demo: http://hikejun.com/work/qq/share_8.23/mod_comp.html ‘
’ http://hikejun.com/work/qq/share_8.23/sports.qq.com.html http://hikejun.com/work/qq/share_8.23/news.qq.com.html
26.
27.
1. demo: http://hikejun.com/work/qq/share_8.4/example2/article-layout.html
28.
II. demo: http://hikejun.com/work/qq/share_8.4/example2/article.html
29.
III. demo: http://localhost/~kejun/douban/ui-framework/test/all.html
30.
IV. demo: http://localhost/~kejun/douban/ui-framework/test/all.html
31.
32.
UI
33.
34.
Q&A
35.
:)
Download now