Rss

  • youtube
  • linkedin
  • google

Archives for : HTML5

เทคนิคในการออกแบบเว็บไซต์สมัยใหม่

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

เทคนิคที่นิยมใช้งานกัน อย่างมากคือ การแทนที่โครงสร้างเว็บไซต์แบบเดิมที่เป็น HTML layout (Table Tag) ด้วย CSS (DIV Tag) เช่นการใช้ fluid Layout เป็นต้น ในบทความนี้รวบรวมจากข้อแนะนำ วิธีการของ Web Designer ระดับโลก นำมาช่วยในการออกแบบเว็บไซต์แบบมืออาชีพ

อ่านต่อ http://www.bakerymedia.com/modern-webdesign

ทดสอบการแสดงผลของเว็บไซต์กันสดๆบน smartphone และ tablet โดย Adobe Edge Inspect

ติดตั้งและใช้งาน ADOBE EDGE INSPECT

สำหรับคนที่คิดจะทำเว็บไซต์ในปัจจุบัน ไม่ว่าจะทำเป็น Fix-layout หรือ  Responsive Layout ก็ตาม สิ่งที่น่าปวดหัวสำหรับนักออกแบบเว็บไซต์มืออาชีพก็คือ ทำอย่างไรจะให้แสดงผลได้สวยงาม กับอุปกรณ์ที่หลากหลาย ด้วยเหตุนี้ Adobe จึงสร้างโปรแกรมที่ชื่อว่า EDGE Inspect ขึ้นมาช่วยเหลือนักออกแบบและนักพัฒนาเว็บไซต์ เพื่อให้แสดงผลในอุปกรณ์ต่างๆได้ทีเดียวพร้อมๆกัน ไปดูกันว่าทำได้อย่างไร

รู้จักกันก่อน Adobe EDGE Inspect โปรแกรม Adobe Edge Inspect ทำให้ Web designer สามารถทดสอบเว็บที่กำลังสร้างบน PC Workstation ไปแสดงผลใน smartphone และ tablet ได้ทันที ทำให้ลดเวลาในการทำงาน และยังเชื่อมต่อโดยตรงกับ Google Chrome และสามารถเรียกใช้งานจากโปรแกรมอื่นๆ ใน Adobe Creative Cloud ได้ทันที สำหรับคนสมัคร Adobe Creative Cloud แบบทดลองใช้งาน จะเชื่อมต่อกับ Smartphone หรือ Tablet ได้ทีละเครื่องสำหรับคนที่จ่ายเงินซื้อลิขสิทธิ์แล้ว สามารถเชื่อมต่อกับ Smartphone หรือ Tablet ได้ไม่จำกัดจำนวนเลยทีเดียว

อ่านเพิ่มเติมใน bakerymedia.com

รวม 13 ฟอนต์ไทยแห่งชาติในรูปแบบ WEBFONT เพื่อใช้แสดงผลในเว็บไซต์

รวม 13 ฟอนต์ไทยแห่งชาติในรูปแบบ Webfont เพื่อใช้แสดงผลในเว็บไซต์

ข้อจำกัดหนึ่งของการทำเว็บไซต์คือ ฟอนต์ ที่เราต้องอึดอัดเพราะต้องทนใช้ฟอนต์มาตรฐานเท่านั้น เนื่องจากข้อจำกัดทางเทคนิค ที่ต้องดึงฟอนต์จากเครื่องที่เปิดเว็บ ทำให้ถ้าใครเครื่องเราไม่มีฟอนต์นั้น จะอ่านไม่ออก หรือ เพี้ยนไปแบบเว็บเสียโครงสร้างไปเลยทีเดียว

ต่อมาเทโนโลยีพัฒนามาสู่ Webfont (CSS3 @font-face) ที่สามารถดึง font จากเรื่อง Server มาแสดงผลได้ เช่น Google Webfont แต่อย่างไรก็ตาม ภาษาไทยก็ยังไม่มีให้ใช้ การใช้ฟอนต์ภาษาไทยสวยๆในเว็บด้วย CSS3 @font-face รวมไปถึงการแปลงฟอนต์จากเว็บ Fontsquirrel ก็อาจจะมีปัญหาบ้าง เพราะตัวเครื่องมือที่ใช้ในการแปลงนั้นไม่มี Preset

จนถึงวันนี้ ข่าวดี 13 ฟอนต์ไทยแห่งชาติ ถูกบรรจุใน Webfont แล้ว ที่สำคัญ ฟรี วันนี้เลยได้รวบรวม 13 ฟอนต์ฟรีมาตรฐาน จากสำนักงานส่งเสริมอุตสาหกรรมซอฟต์แวร์แห่งชาติ (SIPA) มาแปลงเป็นเว็บฟอนต์เพื่อให้ดาวน์โหลดไปใช้งานกันได้เลย

 

วิธีการใช้งานก็แค่ดาวน์โหลดชุด Webfont ของฟอนต์ใดๆด้านล่าง และเมื่อแตกไฟล์ออกมาจะมีไฟล์ index.html ซึ่งภายในจะมีวิธีการติดตั้งฟอนต์ลงในเว็บไซต์ไว้เรียบร้อย

อ่านต่อได้ที่นี่ครับ

เครื่องมือสร้าง HTML5 แบบพอเพียง

พอพูดถึง HTML5 คนทำเว็บมักนึกไปถึงโปรแกรมเจ้าใหญ่อย่าง Adobe Dreamweaver แต่ราคาไม่ได้ย่อมเยา ดูเป็นเครือมือสำหรับมือโปร มากกว่า ทีนี้สำหรับการเริ่มต้น มาหาโปรแกรมที่ ทำได้ง่าย สะดวก และรวดเร็ว กันดีกว่า หลายๆ คนคงเคยใช้ Notepad ในการเขียน HTML กันมาบ้างสำหรับคนเคยทำเว็บ และแน่นอนมันยากและช้าด้วย ไม่ต้องกลัว ผมไม่ได้บอกให้กลับไปใช้ Notepad วันนี้ เครื่องมือสร้างเว็บแบบ HTML5 ง่ายๆ สำหรับ Desktop, Mobile, Tablet มีมากมาย แถมใช้งานฟรีอีกด้วย

Continue Reading >>

Top 10 Best Product in Home Kit 2017 Top 10 Best Product in Women Fashion 2017 Top 10 Best Product in Technology 2017 Top 10 Best Product in Car Accessories 2017