บล็อกที่มีเนื้อหาเน้นทางด้านเทคโนโลยีสารสนเทศ
Website development,
Web application,
Windows application,
Operating System,
Android Studio
สคลิ๊ปอ่านข้อมูลจาก ratings.list แบบ plain text
ที่เผยแพร่โดย imdb.com
มาแสดงผลในเว็บเพจแบบตาราง แบ่งหน้าละ 50 รายการ
และมีลิงค์ค้น title ในฐานข้อมูล imdb.com ผ่านชื่อเรื่อง
โดยปรับภาษาให้แสดงตัวอักษรชื่อเรื่อง
ผ่าน html ที่ใช้รหัส ord() เพื่อแสดงอักษรพิเศษ
เช่นเรื่อง 8½ (1963) ในรายการที่ 230
BD = 189 = ฝ = one by two
https://gist.github.com/thaiall/5f424d021c203b828710bdeaadee3c03
มีโอกาสนั่งคุยกับนักศึกษา
เรื่องตัวเลข ฐานสิบ ฐานสิบหก และตาราง ASCII
พบตาราง Character Set ของคนไทย
คือ Windows-874 หรือ TIS-620
หากจะแสดงเว็บเพจภาษาไทย
มักใช้ <meta http-equiv=”content-type” content=”text/html;charset=windows-874″ />
หรือ <meta charset=”tis-620″ />
แล้วสั่งแสดงตัวอักษร ก ด้วย ก หรือพิมพ์ตรง ๆ ก็ได้
หากใช้ตัวเลข ก็แสดงว่า 3585 คือ ก
ซึ่งเป็นเลขสำหรับตัวอักษรภาษาไทยตัวแรก ในระบบ Unicode
แล้วพบว่าไม่สามารถแสดงด้วย ¡ หรือ ¡
เพราะ Browser ไม่ได้รองรับ
อักษรพิเศษอื่น ๆ ที่ชวนมอง และมี Entity Name
อาทิ
& = Ampersand
# = Number sign
# = Hashtag sign
# = Sharp sign
โฮมเพจที่น่าสนใจ
http://www.w3schools.com/charsets/ref_utf_symbols.asp
http://www.rakjung.com/facebook-no163.html
http://www.thailibrary.in.th/2014/02/13/char-set/
https://en.wikipedia.org/wiki/Code_page
เล่าสู่กันฟัง
เคยมีเพื่อนสนใจเรื่อง “การประเมินเว็บเพจให้ทำงานเร็ว และดีกับผู้ใช้”
เพราะถ้าข้อมูลมหาศาลแล้ว ก็มีประเด็นสำคัญ 2 เรื่องใหญ่ที่ต้องใส่ใจ
ความเร็ว (Speed Rules) คือ ปัญหาในการให้บริการ
การใช้งาน (Usability Rules) คือ หน้าตาเว็บเพจสำหรับผู้ใช้
บริการของ Pagespeed จาก google.com
เป็นตัวเลือกหนึ่ง ที่มีเกณฑ์การประเมินชัดเจน
การได้ 100/100 คือ อะไรที่น่าสนใจ
วันนี้ลองอีกตั้งหนึ่ง ปรับแก้ให้ผ่านเกณฑ์จนได้ (หลังจากไม่เคยถึงเลย)
แล้วก็ผ่านครับ กับเว็บเพจหน้าแรกของผม คือ ศูนย์สอบออนไลน์
http://www.thaiall.com/quiz/index.html
สรุปว่า เมื่อ 22 ม.ค.60 ได้ปรับเว็บเพจ index.html ใน /quiz
ซึ่งเป็นหน้า welcome page ของศูนย์สอบออนไลน์ และเป็นการปรับใหญ่ที่มีคุณสมบัติต่าง ๆ
ต้อนรัปปี 2560 ดังนี้
1) เป็น Responsive Web Design
2) ผ่านเกณฑ์ Pagespeed ของ Google
3) ปรับรูปแบบ และเพิ่มเนื้อหาพาไปยังโฮมเพจที่สำคัญ
การผ่านเกณฑ์ของ Pagespeed มีข้อดี คือ
เว็บเพจของเราจะถูกโหลดอย่างรวดเร็วโดยผู้ใช้
และแสดงผลอย่างเหมาะสม
ทั้งบน mobile device และ desktop computer
ส่วนการเป็น Responsive Web Design
ทำให้การพัฒนา Application บน Google play store กับ App store ของ Google
สามารถทำ Redirect ไปยัง webpage ได้ทันที โดยไม่ต้องปรับแต่งเพิ่มเติม
เห็นแอพหลายตัวที่ทำขึ้นมาง่าย ๆ โดยเชื่อมกับเว็บไซต์โดยตรง
http://www.thaiall.com/web2
[Speed Rules]
Avoid landing page redirects
Enable compression
Improve server response time
Leverage browser caching
Minify resources
Optimize images
Optimize CSS Delivery
Prioritize visible content
Remove render-blocking JavaScript
Use asynchronous scripts
[Usability Rules]
Avoid plugins
Configure the viewport
Size content to viewport
Size tap targets appropriately
Use legible font sizes
ที่เว็บไซต์ คนไทย.com มี Thailand Gateway มีข้อมูลทำให้เรารู้ว่าประเทศไทย มีคนไทยกี่คน วันนี้สนใจเรื่องการนำเสนอข้อมูลตัวเลข (Number) โดยใช้แผนภาพ (Diagram หรือ Chart) จะใช้ Google chart ทำ Pie chart เทียบหญิงกับชาย ว่ามีจำนวนเพศละกี่คน จากข้อมูลใน khonthai.com
พบว่า ประกาศสำนักทะเบียนกลาง
เรื่อง จำนวนราษฎรทั่วราชอาณาจักร ตามหลักฐานการทะเบียนราษฎร
ณ วันที่ 31 ธันวาคม 2558
คนที่มีสัญชาติไทย
มีชาย (Male) 31,865,175 คน
มีหญิง (Female) 33,064,910 คน
รวม 64,930,085 คน
http://www.thaiall.com/php/google_ajax_api_pie.htm
แล้วเมื่อเที่ยงของวันที่ 17 มกราคม 2560 นอกจากข้อมูลข้างต้น
ยังพบว่าเครื่องบริการข้อมูลของที่นี่ น่าจะใช้ Mysql
และใช้ภาษา PHP ที่รู้เพราะขณะโหลดข้อมูล
มีข้อความ Warning แจ้งให้ทราบ ว่าระบบฐานข้อมูลไม่ตอบตามปกติ
ก็เป็นกรณีศึกษาที่สามารถนำไปแบ่งปันในห้องเรียนได้
http://stat.bora.dopa.go.th/stat/y_stat58.htm
https://google-developers.appspot.com/chart/interactive/docs/gallery
การนำเสนอ chart ในเว็บเพจมีกันหลายวิธี นั่งทบทวนการใช้ OFC (Open Flash Chart) อยู่พักหนึ่ง สุดท้ายก็ต้องยอมแพ้ เพราะ เส้นทางของ Flash ในอนาคต ดูจะตีบตันเหลือเกิน และ OFC ก็ไม่ได้พัฒนาต่อให้สมบูรณ์ ต่างกับ Google Chart ที่พัฒนาอย่างต่อเนื่อง และเลือกใช้งานได้หลากหลาย ตามความต้องการของผู้ใช้
จากการทดสอบ code ที่ใช้นำเสนอข้อมูลใน chart แต่ละแบบ ได้เก็บตัวอย่าง code ไว้เป็นไฟล์ และเก็บภาพตัวอย่าง chart เพื่อจะได้เลือกนำมาใช้ และนำ code มาปรับแก้โดยง่าย
ระบบนี้ไม่ต้องมี server เพราะจะเรียกไปยัง google.com โดยส่งข้อมูลผ่าน javascript code ทำงานแบบ AJAX คือ ประมวลผลร่วมกันระหว่าง client กับ google server มีตัวอย่าง chart แบบต่าง ๆ ดังนี้
google_ajax_api_annotation.htm
google_ajax_api_area.htm
google_ajax_api_bar.htm
google_ajax_api_bubble.htm
google_ajax_api_calendar.htm
google_ajax_api_candlestick.htm
google_ajax_api_column.htm
google_ajax_api_combo.htm
google_ajax_api_diff.htm
google_ajax_api_donut.htm
google_ajax_api_gantt.htm
google_ajax_api_gauge.htm
google_ajax_api_geo.htm
google_ajax_api_histrogram.htm
google_ajax_api_line.htm
google_ajax_api_lineinterval.htm
google_ajax_api_map.htm
google_ajax_api_org.htm
google_ajax_api_pie.htm
google_ajax_api_scatter.htm
google_ajax_api_table.htm
google_ajax_api_timeline.htm
google_ajax_api_trendline.htm
google_ajax_api_wordtree.htm
วันนี้เตรียมเมล็ดมะละกอพันธุ์ฮอลแลนด์ จากมะละกอสุก
นำไปตากให้แห้งเอง ไม่ต้องซื้อใครเขา ทำเมล็ดพันธุ์เองเลย
เค้าว่าเมล็ดพันธุ์สำหรับนำไปปลูก
ขายกันเป็นขีด (100 กรัม)
ขีดละประมาณ 700 – 900 บาท มี 7000 – 8000 เมล็ด
บางรายขายเป็นซอง ๆ ละ 100 บาท มี 50 เมล็ด
https://www.facebook.com/malakoboy69/
จากนั้นก็มาทบทวน Operating System
จำได้ว่าเคยลง Debian ไว้บน Oracle VM VirtualBox
ใน WinXP ที่ใช้งานอยู่
ในเครื่องผมตั้ง user เข้า Debian ว่า “nation”
ต้องกรอกรหัสผ่านเข้าเครื่องให้ถูก
ถ้าไม่ถูกระบบจะแจ้งว่า “Authentication failure”
1. เปิดขึ้นมาก็เห็น Gnome Desktop
2. มุมบนซ้ายสุดมี Application, Places, System
ก็เลือก Application – Accessories – Terminal หรือ Root Terminal
เหมือนพิมพ์ SU เลยครับ
3. ตรวจว่าเครื่องเราเปิด port อะไรไปแล้วบ้าง
ด้วย #netstat -na
4. ตรวจว่ามี process อะไร start อยู่บ้าง
ด้วย #ps -aux
5. ตรวจว่ามีใครเข้าออกระบบเมื่อใด
ด้วย #last
6. ตรวจว่ามี user name อะไรที่อยู่ที่สร้างไว้แล้ว
ด้วย #cat /etc/passwd
7. ตรวจว่าเชื่อมต่อสื่ออะไรจากที่ไหนไว้บ้าง
ด้วย #mount
พบว่าแชร์เข้ามาจากระบบ Windows จำนวน 2 Folders
http://www.thaiall.com/blog/burin/4628/
Julia Blake เขียนเมื่อ 13 พฤษภาคม 2015
เรื่อง 15 Worst UI Design Features to Watch Out For and Overcome
1. มีปุ่ม Reset อยู่ติดปุ่ม Submit ทำให้กดพลาดได้
2. มีปุ่ม Cancel อยู่ติดปุ่ม Back สำหรับกรอกหลายหน้า ทำให้กดพลาดได้
3. มีปุ่ม X ทำให้เข้าใจผิดว่า ปิดอะไร ซึ่งไม่ชัดเจน สื่อสารผิดพลาดได้
4. มีหน้า Chat เด้งขึ้นมาคุยกับเรา เมื่อเปิดเว็บไซต์ คงไม่ดีแน่
5. มี *** ขณะพิมพ์รหัสผ่าน ทำให้สับสน เพราะมองไม่เห็น
6. สไลด์ภาพอัตโนมัติ เป็นการบังคับให้ต้องดูข้อมูล
7. การเลื่อนข้อมูลให้เลือกแบบ Carousel เหมือนกงล้อ เห็นแล้วเชย
8. เมนูแบบตกลง ไม่เหมาะกับข้อมูลปริมาณมาก
9. ป้ายแบบทับข้อมูลตามมุม น่ารำคาญ
10. ถ้าคลิ๊กโลโก้ก็ต้องกลับไปหน้าแรก อย่าลืม
11. แถบนำทางขนาดใหญ่บนจอภาพ ใช้งานยาก
12. ให้เลือกว่าจะใช้ mouse หรือ keyboard เลื่อนข้อมูล
13. อย่าใช้สีฉูดฉาด
https://alison.com/courses/Colour-Theory-for-Artists-and-Designers
http://www.sessions.edu/certificate-programs/course-color-theory
14. ตัวอักษรเล็กเกินไป
15. ใช้ Captcha ตรวจสอบว่าเป็นมนุษย์หรือไม่
https://idxw.net/2015/05/27/15-%E0%B8%82%E0%B9%89%E0%B8%AD%E0%B8%9C%E0%B8%B4%E0%B8%94%E0%B8%9E%E0%B8%A5%E0%B8%B2%E0%B8%94%E0%B8%97%E0%B8%B5%E0%B9%88%E0%B8%84%E0%B8%99%E0%B8%AD%E0%B8%AD%E0%B8%81%E0%B9%81%E0%B8%9A%E0%B8%9A-ui-webs/
http://www.onextrapixel.com/2015/05/13/15-worst-ui-design-features-to-watch-out-for-and-overcome/
ตัวเราเองก็มักจะประเมินตนเอง หรือมีคนประเมินตัวเราเสมอ
เช่น ได้เกรดอะไร น้ำหนัก ความดัน เบาหวาน
หรือผลสอบแข่งขันต่าง ๆ ว่ามีประสิทธิภาพหรือไม่
http://www.thaiall.com/webmaster/
การทำเว็บไซต์ก็เช่นกัน สามารถติดตามประสิทธิภาพของเว็บไซต์
ได้หลายประเด็น
1. พฤติกรรมการเข้าเว็บไซต์ บริการจากภายนอก
เช่น http://truehits.net/stat.php?login=thaiall
หรือ https://www.stats.in.th/?cmd=stats&sid=47&list=m&y=2016
หรือ https://www.google.com/analytics/
2. พฤติกรรมการเข้าเว็บไซต์ ติดตั้งไว้ภายในเครื่อง
– รวมสคริ๊ปสำหรับนำไปติดตั้ง
http://www.hotscripts.com/category/scripts/php/scripts-programs/web-traffic-analysis/
– วัด web application
http://oracle-java.blogspot.com/2007/08/web-application-jmeter.html
– ภายในเครื่องบริการเว็บก็มี access.log หรือ error.log ที่นำมาวิเคราะห์ได้
3. ประเมินเว็บไซต์ หรือเว็บเพจ
มีหลายมุมให้พิจารณา
http://www.check-domains.com/website-analysis/website-analyzer.php
http://validator.w3.org/check/referer
http://jigsaw.w3.org/css-validator/check/referer
https://developers.google.com/speed/pagespeed/insights/
4. Browser
กด Ctrl-Shift-I มีบริการ Inspector เว็บเพจได้
ว่ารองรับ responsive web design กับอุปกรณ์ต่าง ๆ หรือไม่
5. บริการเสริม
เช่น facebook.com ก็จะมียอด like ยอดแชร์
สามารถ plugin เข้ามาใน webpage ได้
หรือ youtube.com ก็จะมี plugin เช่นกัน
หรือ 4share.com หรือ box.com ก็แชร์แฟ้มให้ดาวน์โหลดได้
—
บทความที่ esarn.com น่าสนใจ
http://www.esarn.com/%E0%B8%A7%E0%B8%B4%E0%B9%80%E0%B8%84%E0%B8%A3%E0%B8%B2%E0%B8%B0%E0%B8%AB%E0%B9%8C%E0%B9%80%E0%B8%A7%E0%B9%87%E0%B8%9A%E0%B9%84%E0%B8%8B%E0%B8%95%E0%B9%8C/
เรื่อง ทำไมต้องวิเคราะห์เว็บไซต์ มี 4 วัตถุประสงค์
1. เพื่อศึกษาพฤติกรรมการใช้งานบนเว็บไซต์ของคุณ
2. เพื่อนำมาต่อยอดในการวางแผนทางการตลาดให้กับธุรกิจ
3. เพื่อวางแผนการใช้งานคนและงบประมาณ
4. เพื่อเป็นข้อมูลในการปรับปรุงแก้ไขเว็บไซต์ของเรา
2 ต.ค.59 เว็บไซต์ lampang.net หายไปเกือบทั้งวัน เพราะช่วงเช้าได้ upgrade wordpress และ plugin jetpack กับหลายไซต์ แต่พบปัญหาที่ lampang.net โดย error ครั้งแรกแจ้งว่า service unavailable แล้วก็เงียบไปเลย ก็เป็นที่ server สิ่งที่ทำได้คือรอให้ server มีการ recover folder ต่าง ๆ กลับมาให้ครบ แต่หลังจากกลับมาทำงานปกติ พบว่าห้อง jetpack กลับไม่เหมือนเดิม
วิธีแก้ไข
1. ลบแฟ้ม jetpack.php พบว่าระบบมาทำงานปกติ แต่ jetpack หายไป
2. ลงใหม่ทับไม่ได้ ระบบไม่ยอม ฟ้องว่ามีของเก่าอยู่
3. ไปลบห้อง jetpack ในเครื่องออก แล้วสั่งลงใหม่
4. หลังลงใหม่ ต้อง activate อีกหลายขั้นตอน
– หน้า Dashboard ต้องกดปุ่ม Connect Jetpack
– แล้ว Log in เข้าระบบด้วย wordpress account
– แล้ว approve
– แล้ว Select Free
– แล้ว Activate Recommended Features
– เรียบร้อย
Plugin : Jetpack ของ wordpress คือ บริการเพิ่มการเข้าใช้งาน
ดูสถิติ เพิ่มความเร็วให้เว็บไซต์ และป้องกันการถูกจู่โจมจากผู้ไม่หวังดี
(Jetpack will be increase your traffic, view your stats, speed up your site, and protect yourself from hackers with Jetpack)
https://th.wordpress.org/plugins/jetpack/
Topics for upgrade member
– Traffic Growth & Insights
– Security
– Image Performance
– Centralized Management
– A few more things that our users love
– Dedicated Support
– Contributing to Jetpack
1. วันหนึ่ง เพื่อนชื่อนางลำ รับอีเมลจาก เพื่อนชื่อนายบาง
ในอีเมลมีแฟ้มอยู่ 6 แฟ้ม คือ
allsheet.xls
filelist.xml
sheet001.htm
sheet002.htm
stylesheet.css
tabstrip.htm
แล้วนางลำก็ forward mail ถามผมว่าเปิดอย่างไร
พยายามเปิดแล้วก็ไม่ได้
เพราะแฟ้มที่ได้รับมาเป็น excel ก็ใช้ excel รุ่นใหม่แล้ว
นามสกุลก็ชัดเจนว่าเป็น .xls จะเป็นอื่นไปไม่ได้
2. เมื่อเพื่อนชื่อลำสอบถามจากเพื่อนชื่อนายบาง ว่าเปิดไม่ได้สงสัยแฟ้มเสีย
เพื่อนชื่อนายบางก็ส่งแฟ้มกลับมาให้อีกรอบ และเปิดไม่ได้เหมือนเดิม
กรณีแฟ้มเสียจึงไม่น่าจะเป็นไปได้ เพราะส่งอีเมลมาให้ถึง 2 รอบ
3. ผมลองเปิดดู ก็พบกับข้อความว่า
“รูปแบบไฟล์และนามสกุลของ ‘allsheet.xls’ ไม่ตรงกัน
ไฟล์อาจเสียหายหรือไม่ปลอดภัย
อย่าเปิดไฟล์ดังกล่าวถ้าคุณไม่เชื่อถือในแหล่งที่มา
คุณต้องการเปิดไฟล์นี้หรือไม่”
4. ก็ต้องเลือก “ใช่” เข้าสู่ขั้นต่อไป
แต่กลับพบข้อความว่า มีปัญหาเกิดขึ้นระหว่างการโหลดในส่วนต่อไปนี้
แสดงว่าเปิดแฟ้ม .xls จะไปเรียกแฟ้มอื่นมาทำงานด้วย
อยู่ใน allsheet.files\sheet001.htm
และ allsheet.files\sheet002.htm
5. ทำการสร้าง folder ชื่อ allsheet.files
ในห้องเดียวกับที่เก็บแฟ้ม allsheet.xls
แล้วย้าย 5 แฟ้มเข้าไป ยกเว้นแฟ้ม allsheet.xls เข้าห้องที่สร้างขึ้น
6. เปิด allsheet.xls ก็พบว่ามีข้อมูลที่ต้องการ
—
[Download]
สำหรับผู้ที่ต้องการทดสอบ
ผมมีแฟ้มภาพ และแฟ้ม allsheet.xls ให้นำไปลองจัดโครงสร้างเอง
สามารถดาวน์โหลดได้ที่
https://www.facebook.com/groups/thaiebook/664429603707861/
—
[Looking back]
แต่เมื่อคิดย้อนกลับ ว่า [เพื่อนชื่อนางบาง] สร้างแฟ้ม allsheet.xls ขึ้นมาได้อย่างไร
ผมจึงได้ทดสอบสร้างข้อมูลขึ้นมา 2 sheets
แล้ว save as แล้วเปลี่ยนประเภทเป็น Web Page (*.htm;*.html)
แต่บังคับชื่อแฟ้มและ extension ด้วยการพิมพ์ว่า “allsheet.xls”
จากนั้นเพื่อนชื่อนายบาง ก็ส่งอีเมลเป็นแฟ้มทั้งหมดให้นางลำ
โดยส่งแฟ้ม allsheet.xls พร้อมกับแฟ้มทั้งหมดในห้อง allsheet.files
—
จึงเป็นที่มาที่ทำให้ได้จัดโครงสร้างของแฟ้มแบบย้อนกลับ
เพื่อจะได้เปิดแฟ้ม allsheet.xls ตามประสงค์ของเพื่อนชื่อนางลำ
ซึ่งผลที่ได้คือเลือกเปิดแฟ้มนี้ได้ทั้งโปรแกรม excel และ chrome