Your SlideShare is downloading. ×
分层语义化模板实践 ---- 张克军
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×

Introducing the official SlideShare app

Stunning, full-screen experience for iPhone and Android

Text the download link to your phone

Standard text messaging rates apply

分层语义化模板实践 ---- 张克军

9,306
views

Published on

webrebuild.org北京第一届交流会-悟道WEB标准,分层语义化模板实践。

webrebuild.org北京第一届交流会-悟道WEB标准,分层语义化模板实践。

Published in: Education, Technology, Design

2 Comments
20 Likes
Statistics
Notes
  • 分层语义化
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • 国内应用案例
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
No Downloads
Views
Total Views
9,306
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
209
Comments
2
Likes
20
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 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. 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
  • 23. 1. demo: http://hikejun.com/work/qq/share_8.4/example2/article-layout.html
  • 24. II. demo: http://hikejun.com/work/qq/share_8.4/example2/article.html
  • 25. III. demo: http://localhost/~kejun/douban/ui-framework/test/all.html
  • 26. IV. demo: http://localhost/~kejun/douban/ui-framework/test/all.html
  • 27. UI
  • 28. Q&A
  • 29. :)