การสร้างเว็บเพจแบบ Responsive Design

การสร้างเว็บเพจแบบ Responsive Design

หลังจากที่ได้อ่านบทความ ‘Responsive Web Design คืออะไร?’ ซึ่งเกรินนำเกี่ยวกับหลักการสร้างเว็บไซต์ให้เป็น Responsive ครั้งนี้เราจะมาทำ Workshop วิธีการทำกันบ้างนะครับ โดยผมได้เขียน HTML , CSS , javascript ให้อยู่ในหน้าเดียวกันเลย โดยทำ Breakpoint ขนาดแสดงผลไว้ 3 รูปแบบเพื่อแสดงผลกับ หน้าจอคอมพิวเตอร์ , แท็บเล็ต และมือถือสมาร์ทโฟน ซึ่งการแสดงผลแบบ มือถือ จะมีข้อแตกต่างในส่วนของเมนู เอาหล่ะครับเรามีดูกัน

Read More

สร้าง Tab จาก jQuery แบบประยุกต์ใช้

สร้าง Tab จาก jQuery แบบประยุกต์ใช้

Workshop นี้จะมานำเสนอวิธีประยุกต์ใช้ jQuery เพื่อทำ Tab สำหรับแสดงผลข้อมูลครับ โดยจะเป็นตัวอย่างที่ไม่มี plugin ใดๆเพิ่มเติม เขียนด้วย HTML5 + css3 + jQuery ครับ ลองเข้ามาดูภาพตัวอย่างกันเล็กน้อย

Read More

ระบบ Poll (PHP+Jquery+CSS) แสดงกราฟด้วย CSS

ระบบ Poll (PHP+Jquery+CSS) แสดงกราฟด้วย CSS

สวัสดีครับ วันนี้จะมาสอนวิธีการสร้างระบบ Poll หรือ ระบบแบบสำรวจ และแสดงผลแบบกราฟโดยใช้ css สร้างขึ้นมา ทำอย่างไร? ไปดูกันเลยครับ

Read More

Adobe Edge เครื่องมือสร้างเว็บและแอพด้วย HTML5

Adobe Edge เครื่องมือสร้างเว็บและแอพด้วย HTML5

หลังจากที่ Adobe ถูกตั้งคำถามซ้ำแล้วซ้ำอีกมานานว่า ไม่ใช้ Flash แล้วจะทำอย่างไรต่อ วันนี้ Adobe มีคำตอบกับชาวโลกแล้วว่าเราจะใช้ HTML5 ผ่านเครื่องมือพัฒนาเว็บและแอพชุดใหม่ Adobe Edge

Read More

Responsive Web Design คืออะไร?

Responsive Web Design คืออะไร?

Responsive Web Design คือ การออกแบบ Web Page ให้แสดงผลออกมาให้เหมาะสมกับขนาดหน้าจออุปกรณ์ซึ่งปัจจุบันมีขนาดที่แตกต่างกันออกไปเช่น คอมพิวเตอร์ มือถือ แท็บเล็ต เครื่องเล่นเกมพกพา เป็นต้นซึ่งปัจจุบัน Browser ได้พัฒนาให้สามารถใช้ได้กับหลากหลายอุปกรณ์ แต่ที่เราเจอกันจะพบปัญหาการแสดงผลหน้าเว็บที่ไม่ตรงกับอุปกรณ์เช่น ขนาดตัวหนังสือเล็กไป, ปุ่มต่างๆก็เล็กลง หรือแม้กระทั่งการแสดงผลข้อมูลไม่ครบถ้วน เป็นต้น

Read More