Your SlideShare is downloading. ×
Responsive Web Design or Mobile App
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×

Saving this for later?

Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime - even offline.

Text the download link to your phone

Standard text messaging rates apply

Responsive Web Design or Mobile App

365
views

Published on

Responsive Web Design or Mobile App - Joomla!Day™ Bangkok 2013

Responsive Web Design or Mobile App - Joomla!Day™ Bangkok 2013

Published in: Design, Technology, Education

0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
365
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
14
Comments
0
Likes
0
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. Responsive  Web  Design   or   Mobile  App   Joomla!Day™  Bangkok  2013   Name: Supachai Teasakul! Location: Bangkok, Thailand! Position: Joomla Translation WG - Joomla.org, ! " "LaiThai Developer Team, ! " "Project Manager - Marvelic Engine Co.,Ltd.! Web: !Marvelic.co.th! Twitter: !@supa_chai!
  • 2. การใช้งานและสถิติ   46.4% ของผู้ใช้โทรศัพท์เป็นมาร์ทโฟน! 22.4% ของเจ้าของมาร์ทโฟนใช้ iPhone! ! ในฝรั่งเศส จากผู้ที่มีมาร์ทโฟน! ! 90% ของผู้เข้าเยี่ยมชมเว็บไซต์ มาจากมาร์ทโฟน! และ! 70% ได้เข้าไปดาวน์โหลดโปรแกรมมาใช้งาน!
  • 3. การใช้งานและสถิติ   บนอุปกรณ์มาร์ทโฟน! ใช้แสดงผลข้อมูล! 60%" ! และเป็นอุปกรณ์ที่เปิดใช้งาน! มากขึ้นทุกวันในโลก! h"p://www.eco-­‐conscient.com  
  • 4. การออกแบบเว็บที่ตอบสนองได้   มีชุดเครื่องมือ และเทคนิคในการจัดระเบียบข้อมูล จากพารามิเตอร์ของอุปกรณ์ ! (คอมพิวเตอร์ตรวจสอบ, มาร์ทโฟน, แท็บเล็ต, โทรทัศน์, ฯลฯ .)! ภาพประกอบจากหนังสือที่ตีพิมพ์โดย Ethan Marcotte, 25 พฤษภาคม 2010!
  • 5. การออกแบบเว็บที่ตอบสนองได้   RWD จะมีอยู่ในเทมเพลตมากที่สุด ในรุ่น Joomla 2.5 และ natively ใน! Joomla เทมเพลต 3.x!
  • 6. การออกแบบเว็บที่ตอบสนองได้   RWD ในส่วนติดต่อของผู้ใช้ (หน้า) และ! ผู้บริหาร (Back-end) Joomla 3.x!
  • 7. การออกแบบเว็บที่ตอบสนองได้   Joomla 3.x จะมี Bootstrap responsive framework ซึ่งประกอบไปด้วย CSS & JavaScript!
  • 8. การออกแบบเว็บที่ตอบสนองได้   ด้วย Bootstrap, เราเพียงเรียกใช้ CSS ด้วยคลาสที่ต้องการ เพื่อนำเสนอเนื้อหาของ เราเพื่อให้ได้ผลลัพธ์เป็น responsive! <img alt="Logo" class="visible-desktop" src="/images/logo.png">!
  • 9. หันมาเขียน CSS  แบบ less