#AndroidStudio ตอนที่ 2 ทำ App เรียกโฮมเพจมาแสดงใน Smart Phone

ตอนที่ 2 ทำ App เรียกโฮมเพจมาแสดงใน Smart Phone

<introduction>
เคยเห็นแอพใน Smartphone ที่เปิดขึ้นมา แล้วก็ไปเรียกเว็บจาก URL มาแสดง
คำสั่งสำคัญที่มักใช้กัน คือ webview
แต่มีการปรับรุ่น SDK + Security + Device
ทำให้การใช้คำสั่งต้องมีรายละเอียดเพิ่มขึ้น
และนึกถึงการทำเว็บแบบ Progressive Web Apps
แต่ PWA กับ APK เชื่อมกันได้ไม่สนิท หรืออาจไม่เชื่อมกันเลย
ผมก็พยายามปรับ code ฝั่ง web server และ android ได้คุยกันรู้เรื่อง
โดยให้ส่ง user agent ไปให้กับ php ทั้งที่มี

HTTP_X_REQUESTED_WITH = [The package name from the app]

เพื่อกำหนดการทำงานให้ถูกต้องว่า
1) ถ้าถูกเรียกจาก app ใน android ต้องส่งอะไรไปให้
2) ถ้าเปิดแบบปกติก็ปล่อยให้เป็นการทำงานของ PWA
สำหรับ URL ที่ใช้เป็นกรณีศึกษาครั้งนี้เลือกใช้ Miss Grand 2017
http://www.thaiall.com/actress/missgrand2017/
และทดสอบกับ Smartphone จริง ผ่านแอพ WiFi ADB
https://play.google.com/store/apps/details?id=com.ttxapps.wifiadb
แล้ว code ที่แสดงไว้นี้ ฝากไว้กับ github.com เพราะมี plugin ใน blog

ทำให้แสดงผลได้สวยงาม
</introduction>

<process>
กระบวนการในการพัฒนา APP
เพื่อใช้งาน webview เรียกโฮมเพจผ่าน URL มาแสดงผล
มีขั้นตอน ดังนี้

1. เปิด Android Studio แล้วสร้าง New Project
เลือก Activity แบบ Empty Activity

2. ใน IDE ของ Android Studio มองหา Tab ด้านซ้าย
จะพบ 1: Project หรือกดปุ่ม ALT-1 ก็ได้
จะพบ 2 หัวข้อใหญ่ คือ app กับ gradle scripts
ให้ดูใน app จะพบหัวข้อ manifests, Java และ Res

3. ถ้าจะทำให้ App เรียกโฮมเพจผ่าน URL มาแสดงผล
สิ่งแรกที่ต้องทำ คือ คลิ๊กเปิดแฟ้ม AndroidManifest.xml ใน manifests
แล้วใส่ tag user-permission 2 บรรทัดตามตัวอย่าง code
เข้าไปด้านท้าย แทรกกลางระหว่าง TAG : /application กับ /manifest

</application>
แทรก code ไว้ที่นี่
</manifest>

AndroidManifest.xml

4. เปิดแฟ้ม MainActivity.java ที่อยู่ใต้ Package Name
ใน code ก็จะเริ่มด้วย package บรรทัดต่อมาก็ import อีกเพียบ
ตามด้วย public class MainActivity ..
สรุปว่า
copy code ด้านล่างนี้ไปวางทับของเดิม
แล้วแก้ชื่อ package name หรือแก้ไขข้อมูลอื่น ๆ ตามความเหมาะสม
อาทิ url ที่ต้องการ load
หรือ package name ให้ตรงกับที่ท่านตั้งไว้
หรือ user agent ถ้าไม่ใช้ ก็ลบบรรทัดนี้ไปได้
หรือ เปลี่ยนชื่อ host ที่ไม่ต้องการให้ทำ Intent ไปนอก App

 

MainActivity.java

5. ความตั้งใจคือ เรียกโฮมเพจตาม URL มาแสดงใน APP
เมื่อเปิดแฟ้ม activity_main.xml ที่อยู่ในใน app,res,layout
ก็ใส่ Tag : WebView ที่สำคัญเพียง Tag เดียว

activity_main.xml

6. ในบทเรียนนี้ สรุปว่าต้องแก้ไข 3 ส่วน เมื่อมองจาก project explorer
เปิดผ่าน Menu bar ที่ View, Tool Windows, Project
– app, manifests, AndroidManifest.xml
– app, java, [package name], MainActivity.java
– app, res, layout, activity_main.xml

7. เมื่อแก้ไข code เสร็จแล้ว และไม่มี error มาให้กวนใจ
ก็สั่ง Menu bar, Make Project หรือ Ctrl+F9 หรือ Build APK 
แล้วส่ง Menu bar, Run, Run ‘app’ หรือ Shift+F10
เพื่อดูผลการทำงานของ App ใน Device Emulator หรือ Device
</process>

<website_guide>
+ http://www.thaiall.com/android
</website_guide>

หมายเหตุ 
ถ้าสนใจติดตามเนื้อหาในบล็อกนี้ สามารถ subscribe ด้วย email ที่อยู่ข้างขวา หรือ click here

#AndroidStudio ตอนที่ 1 การพัฒนา app สำหรับใช้งานบน Smart Phone ที่ลง Android

ตอนที่ 1 การพัฒนา app สำหรับใช้งานบน Smart Phone ที่ลง Android

<introduction>
หลังจากผมได้คอมพิวเตอร์โน๊ตบุ๊ค แล้ว IT Clinic ลง Windows 10 Home 64Bit (OEM=Original Equipment Manufacture)
ก็นำมาลองสร้างแอพ (App = Application) สำหรับ Moveable Device ด้วย Android Studio
ซึ่งมีผู้พัฒนา คือ บริษัทกูเกิ้ล (Google.com) เริ่มต้นก็คิดว่าจะลงโปรแกรมแล้วเขียนโปรแกรม Hello World ไป Run บน Smart Phone ที่ใช้อยู่
</introduction>

<process>
กระบวนการในการพัฒนา APP
เพื่อให้ได้ .apk ไปใช้งาน
ซึ่ง Google พัฒนา Android Studio เป็น IDE ที่มี everything และใช้งานง่ายกว่าเดิม
มีขั้นตอน ดังนี้

1. Download : Java (jdk-8u144-windows-i586.exe หรือรุ่นใหม่กว่า)
จาก https://java.com/en/download/
เพราะเครื่องมือสำหรับพัฒนาโปรแกรม ต้องใช้ Java Runtime Environment (JRE)
แต่ใน Android Studio รุ่นที่ผมใช้เป็นแบบ Portable
มี JRE Embeded ติดมาให้ด้วย ไม่ต้องติดตั้ง เพราะเรียกใช้งานจากในแฟ้มที่คัดลอกมาได้เลย
ดังนั้นในเครื่องที่ผมใช้พัฒนา Android App จึงไม่ติดตั้ง JAVA ด้วยตนเอง
เพราะมีมาพร้อม Android Studio แล้ว

project structure in android studio
project structure in android studio

2. Download : Android Studio (android-studio-ide-162.4069837-windows32.zip)
จาก https://developer.android.com/studio/
ของผมได้รุ่น Android Studio v2.3.3 (June 2017) ซึ่งใหม่สุด ณ ตอนนี้
ซึ่ง Include Everything มาแล้ว
ทั้ง IDE (Integrated Development Environment) + SDK (Android Software Development Kit) + Emulator
ผมเลือกรุ่น .zip ไม่เลือกแบบ install
เพราะคลาย zip แล้ว เรียกให้โปรแกรม Folder> android-studio\bin\studio.exe ทำงานได้เลย
ทำงานแบบ Portable ที่ไม่ต้องติดตั้งก่อน
และผมไม่เลือกใช้ Eclipse เพราะ sdk-tools-r2602_windows-3859397.zip
จะไม่มี SDK Manager มาให้ ต้องใช้ SDK Manager ใน Android Studio
และ Google ประกาศเลิกสนับสนุน SDK ให้ Software ภายนอกแล้ว

Android Studio can be the portable software
Android Studio can be the portable software

3. เมื่อสั่งให้ studio.exe ทำงาน
ก็สั่ง Menu Bar, File, New, New Project
Application name : My Application
Company domain : www.thaiall.com
Minimum SDK : API 19: Android 4.4 (KitKat)
อาจเลือก API 25: Android 7.1.1 (Nougat)
หรือ API 26: Android 8 (O) ก็แล้วแต่ชอบนะครับ แต่ผมชอบของเก่า
Add an Activity to Mobile
เป็น Template ให้เลือก 12 แบบ แบบแรกที่เลือก คือ Basic Activity
แล้วก็ Finish อะไรไม่แจ้งไว้ แสดงว่าไม่ได้เปลี่ยน

Default Activity on Android Studio
Default Activity on Android
Studio
Default Activity on Android Studio
Default Activity on Android
Studio
Default Activity on Android Studio
Default Activity on Android
Studio

4. เข้าสู่ส่วนของ IDE มีหน้าต่างย่อยเพียบ
เห็นคำว่า Hello World! ใน content_main.xml
พบช่อง Text ด้านขวา สามารถเปลี่ยนเป็น Hello My World! ที่นั่นได้

We can change from hello world to hello my world
We can change from hello world to hello my world

5. ทดสอบประมวลผล
Menu bar, Run, Run ‘app’ หรือ Shift F10

6. เลือก Device
จาก Connected Devices หรือ Available Virtual Devices
หรือกด Create New Virtual Device
ผมสร้าง Device ชื่อ Nexus 5X API 19 ไว้ทดสอบตัวหนึ่ง
สร้างเสร็จก็เลือก Device ที่สร้างขึ้น
จะมีการ Popup อุปกรณ์ Emulator ขึ้นมา เพื่อแสดงผลการ Run

android emulator
android emulator

7. หลังพอใจในผลลัพธ์ ที่เห็นบน Emulator แล้ว
สั่งสร้าง .APK ด้วย Menu bar, Build, Build APK
แฟ้ม .apk ที่ได้ชื่อ app-debug.apk
อยู่ใน C:\Users\[Your Name]\AndroidStudioProjects\basicactivity\app\build\outputs\apk
นำแฟ้มนี้ไปใช้ใน Smart Phone ได้ตามต้องการ
หากผลบน Emulator ไม่น่าพอใจ ก็สั่ง Uninstall
ได้เหมือนกับที่ทำบน Smart Phone คือ ลากลงถังขยะ

we can use apk file on smart phone
we can use apk file on smart phone

 

https://www.4shared.com/folder/AgIkeXaS/android.html

</process>

<website_guide>
+ http://www.thaiall.com/android
</website_guide>

หมายเหตุ 
ถ้าสนใจติดตามเนื้อหาในบล็อกนี้ สามารถ subscribe ด้วย email ที่อยู่ข้างขวา หรือ click here

สุดยอดโปรแกรมสำนักงานฟรี (The Best Free Office Software)

buy notebook from SiamTV
buy notebook from SiamTV

การเขียนรายงานสักฉบับหนึ่ง หรือนำเสนองานหน้าชั้นสักเรื่อง
สมัยนี้ต้องใช้โปรแกรมสำนักงาน (Office Suite)
หลังจากมีผู้คนใช้งานกไปแล้วระยะหนึ่ง
ก็พบว่า Mark Wycislik-Wilson ได้ Review
แล้วเขียนเรื่อง “สุดยอดโปรแกรมสำนักงานฟรี
http://www.techradar.com/news/the-best-free-office-software
โดยมีทั้งหมด 5 โปรแกรม เรียงจาก Best ที่สุด ดังนี้
1) WPS Office Free
2) LibreOffice
3) Apache OpenOffice
4) SoftMaker FreeOffice
5) SSuite Office Premium HD+
ผมไม่ได้ทำลิงค์ดาวน์โหลดไว้ แต่เข้า techradar.com ตามลิงค์ด้านบน เค้าก็ลิงค์ไปให้แล้ว
ส่วน Best ในใจผม ยกให้ LibreOffice เพราะเคยซื้อ Notebook มา
แล้ว “ไอทีคลินิก (IT Clinic)” ของสยามทีวี เค้าลงตัวนี้ให้ฟรี ซึ่งมั่นใจว่าเค้าเลือกมาอย่างดีแล้ว

หากถามว่าโปรแกรม Office Suite ในโลกเรา มีอะไรบ้าง
ไปพบใน Wikipedia.org
ที่ https://en.m.wikipedia.org/wiki/Comparison_of_office_suites
เค้าเปรียบเทียบแต่ละโปรแกรม 12 หัวข้อ แบ่งได้ดังนี้
1) Software Name
2) Developer
3) First public release
4) Predecessor (แหล่งที่มา)
5) Latest Stable version / (Date)
6) Operating system
7) Price in USD
8) License
9) Microsoft Office (.doc, .xls) support
10) Microsoft Office Open XML support
11) OpenDocument support
12) Portable Document Format support
แล้วแต่ละโปรแกรมสำนักงาน ทำงานบนระบบปฏิบัติการใดได้บ้าง
ก็มีแบ่งไว้ 5 ระบบปฏิบัติการ
1) Windows 2) macOS 3) GNU/Linux 4) BSD 5) Unix
องค์ประกอบของโปรแกรมที่โปรแกรมสำนักงานแต่ละค่ายมี ก็เทียบไว้ว่าใครมีชื่ออะไรกันบ้าง
ดังนี้
1) Word processor
2) Spreadsheet
3) Presentation program
4) Notetaking software
5) Diagramming software
6) Raster graphics editor (Bitmap)
7) Vector graphics editor
8) Image viewer
9) Formula editor
10) Database management system
11) Project management software
12) Desktop publishing software
โปรแกรมสำนักงาน (Office suite) ในปัจจุบันได้นำมาเปรียบเทียบไว้มี 27 โปรแกรม
หากโปรแกรมใด Free จะมีเครื่องหมาย * (12 โปรแกรม) ต่อท้ายชื่อโปรแกรมไว้ และทั้งหมดมีดังนี้
1) Ability Office
2) Apache OpenOffice*
3) Breadbox Office
4) Calligra Suite*
5) Feng Office Community Edition*
6) Gobe Productive
7) Google Apps (GoogleDocs)*
8) IBM Lotus Symphony*
9) iWork
10) LibreOffice*
11) Lotus SmartSuite
12) MarinerPak
13) Microsoft Office
14) Microsoft Works (Discontinued in 2009)
15) MobiSystems OfficeSuite
16) NeoOffice
17) OnlyOffice*
18) SoftMaker Office*
19) SSuite Office Premium HD+*
20) StarOffice
21) TeXmacs*
22) TeamLab
23) ThinkFree Office
24) Tiki Wiki CMS Groupware*
25) WordPerfect Office
26) WPS Office (Kingsoft Office)*
27) Zoho Office Suite

office suite comparison
office suite comparison

การที่ VirtualBox จะได้ IP จริง และ start httpd พร้อม Host

การที่ VirtualBox จะได้ IP จริง และ start httpd พร้อม Host
มีขั้นตอนดังนี้
1. เปิด VBox แล้วเลือกตั้งค่าให้ Guest ของผมใช้ Win8
2. เลือก เครือข่าย (Network)
เดิมกำหนดเป็น Nat เปลี่ยนเป็น แผงวงจรแบบบริดจ์ (Bridge Adapter)
ใช้ Net บ้าน มี Router แจก IP แบบ Wireless ภายในบ้าน
3. สั่ง Start : Guest
ขณะอยู่ใน Guest ใช้ DOS>ipconfig
พบ IP คือ 192.168.1.4 เป็นของ Guest
4. อยู่ใน Host ใช้ DOS> ipconfig
พบ IP คือ 192.168.1.5 เป็นของ Host
5. ทดสอบติดตั้ง xampp
[xampp-win32-7.1.7-0-VC14-installer.exe]
ทำให้ Guest เปิดบริการ Port 80
ติดตั้งเสร็จก็ Start : Apache
แล้วตรวจสอบว่าบริการที่เปิดไว้ เข้าถึงจากภายนอกได้หรือไม่
6. ตรวจใน Service ไม่พบว่า Apache
ตรวจโดยเข้า DOS>Services.msc ก็ไม่พบว่า Apache อยู่ใน Services
ใช้ DOS เข้า c:\xampp\apache\bin แล้วติดตั้งเป็น Service เอง
เข้า Windows, Command Prompt (Admin) จึงจะติดตั้ง Service ได้
DOS>httpd -k install
ใน Config มุมบนขวาของ XAMPP Control Panel มีบริการ Start Automatic
หากเลือกให้ MySQL เปิดอัตโนมัติ ก็จะ Start Automatic ได้
7. ขณะอยู่ใน Guest หรือ Host
ทดสอบการเปิดบริการ Apache ใน XAMPP
เปิด http://192.168.1.4 พบ Web Server ทั้งคู่
8. การสั่ง Start VBox ผ่าน Shell:startup
DOS>”C:\Program Files\Oracle\VirtualBox\VirtualBox.exe” –startvm mywin8
สร้างแฟ้ม .bat ในห้อง Startup
ต่อไปเวลาเปิดเครื่องก็จะสั่งให้ mywin8 ถูก Start ขึ้นมาอัตโนมัติ
และ Service Apache ก็จะถูกเรียกขึ้นมาโดยอัตโนมัติเช่นกัน

http://www.thaiall.com/handbill/openphotodir.php?folder=../os/virtualbox_win8/

http://www.thaiall.com/os/virtualbox.htm

ชอบ Continuum บน Windows 10

click on windows button
click on windows button

Continuum คือ ความสามารถใหม่ของ Windows 10
ในการปรับรูปแบบการทำงานให้เหมาะสมกับอุปกรณ์ที่แตกต่างกัน
ทำงานกับ Notebook ก็จะมีความสามารถเน้นอย่างหนึ่ง
เมื่อไม่มีแป้นพิมพ์บน Surface หรือ Tablet หรือ Phone ก็เป็นอีกอย่างหนึ่ง

 

right click on windows button
right click on windows button

http://www.anandtech.com/show/9413/windows-10-editions-compared
https://www.beartai.com/news/itnews/39985

เปรียบเทียบ windows edition
เปรียบเทียบ windows edition

ผมใช้ Windows 10 Home เห็นตารางแล้ว
รู้สึกอยากได้ Edition อื่น ๆ อย่างเช่น Remote Desktop ก็ไม่มีให้
แต่มีนักพัฒนาทำ RDPWrap
https://github.com/stascorp/rdpwrap
ทำให้เครื่องของผมสามารถรับการเชื่อมต่อแบบ Remote Desktop ได้

ซื้อคอมพิวเตอร์มา แล้วได้อะไร

new program from siamtv it clinic
new program from siamtv it clinic

วันนี้ไปซื้อคอมพิวเตอร์มาเครื่องหนึ่ง จาก siamtv ลำปาง
เห็นป้ายลดจาก 16990 เหลือ 14990 บาท
นั่นเป็นอีกปัจจัยที่ทำให้เลือกซื้อ
แล้วก็ยังติดตั้ง Windows 10 มาพร้อมกับตัวเครื่อง มีการ์ดจอในตัว
ขั้นตอนการสำรวจเครื่องเบื้องต้น
1.  เมื่อเข้าไปดูใน Control Panel, System and security, System
พบ
Windows edition
Windows 10 Home Single Language
ซึ่งได้ทำ Windows Activation มาเรียบร้อยแล้ว
System
Model : Acer – Aspire E5-475G
Processor : Intel(R) Core(TM) i3-6006U CPU @2.00GHz 1.99 GHz
Installed memory (RAM): 4.00GB (3.88 GB usable)
System type: 64-bit Operation System, x64-based processor
2. Device Manager
ไม่พบปัญหาเรื่อง Driver และใน Display adapters
พบ NVIDIA Geforce 940MX และ Intel(R) HD Graphics 520

3. This PC, Manage, Disk Management
พบ Disk 0 แบ่งเป็น
C: พื้นที่ 232.87 GB NTFS
D: พื้นที่ 231.77 GB NTFS
รวมกันก็น่าจะใกล้ 500 GB เพราะที่เหลือถูกใช้ทำอย่างอื่น
แล้วใน D: ก็วางเปล่า เหมาะกับการไว้เก็บอะไรอะไรได้

4. network กับ speaker ใช้ได้ เชิงประจักษ์
เปิดเว็บ speedtest.net จากลำปาง ไปเชียงใหม่ ตอน 2 ทุ่ม ผ่าน wifi
Download 36.24 Mbps
Upload 14.50 Mbps
ก็น่าจะ ok แล้วครับ
เพราะใช้ TOT Fiber 2 U
FTTx 20Mb/5Mb 590 บาท

5. โปรแกรมที่ไอทีคลินิกลงให้
– CCleaner (Free)
โปรแกรมทำความสะอาดเครื่องด้ายการลบแฟ้มที่ไม่จำเป็น
– WinRAR 5.20 (Evaluation copy)
โปรแกรมบีบอัด และคลายแฟ้มที่ถูกบีบอัด
– Unity Web Player
Unity Web Player is a plug-in for your browser that allows you to play games and watch great 3D content developed with the Unity game engine.
https://unity3d.com/showcase/gallery/games
http://th.y8.com/games/slope
– AIMP3
โปรแกรมเปิดแฟ้มเสียง
– Adobe AIR (AIR = Adobe Integrated Runtime)
ทำให้ OS รองรับโปรแกรมที่พัฒนาบน Adobe AIR ได้
ตัวอย่างที่ http://www.hongkiat.com/blog/60-useful-adobe-air-applications-you-should-know/
– Adobe Flash Play 16 NPAPI
รองรับแฟ้มมัลติมีเดีย
– Edraw Max 7.7
โปรแกรมวาดไดอะแกรมที่หลากหลาย
– Google Chrome (47.0.2526.106m => 59.0.3071.115)
โปรแกรมบราวเซอร์
– Lexitron dictionary 2.6
โปรแกรมดิกชันนารี่
– Line
โปรแกรมติดต่อสื่อสาร
– Mozilla Firefox 40.0 (=> 44.0b1)
โปรแกรมบราวเซอร์
– Mozilla Maintenance Service
เป็นบริการช่วย update รุ่นใหม่ของ Firefox หรือ Thunderbird
– Nero 8 Lite 8.3.6.0
โปรแกรมเขียน CD
– PhotoScape
โปรแกรมจัดการภาพครบวงจร
– Picasa 3
โปรแกรมจัดการภาพครบวงจร
– The KMPlayer (remove only)
โปรแกรมดูหนัง
– VLC Media player
โปรแกรมดูหนัง
– WebcamMax
โปรแกรมแต่งเว็บแคม
– LibreOffice 4.4.5.2
โปรแกรมสำนักงาน
– Microsoft Visual C++ 2005 Redistributable
เครื่องมือช่วยให้โปรแกรมอื่นทำงานได้สมบูรณ์
– Microsoft Silverlight
Silverlight is a powerful development tool for creating engaging, interactive user experiences for Web and mobile applications.
Silverlight is a free plug-in, powered by the .NET framework and compatible with multiple browsers, devices and operating systems, bringing a new level of interactivity wherever the Web works.
– Adobe Reader XI (11.0.10)
โปรแกรมอ่านแฟ้ม PDF

siamtv promotion
siamtv promotion

การแสดงชื่อภาพยนตร์ และ Rating ของแต่ละเรื่อง จากฐานข้อมูลของ IMDB.COM

eight and a half
eight and a half

สคลิ๊ปอ่านข้อมูลจาก ratings.list แบบ plain text
ที่เผยแพร่โดย imdb.com
มาแสดงผลในเว็บเพจแบบตาราง แบ่งหน้าละ 50 รายการ
และมีลิงค์ค้น title ในฐานข้อมูล imdb.com ผ่านชื่อเรื่อง
โดยปรับภาษาให้แสดงตัวอักษรชื่อเรื่อง
ผ่าน html ที่ใช้รหัส ord() เพื่อแสดงอักษรพิเศษ
เช่นเรื่อง 8½ (1963) ในรายการที่ 230

BD = 189 = ฝ = one by two

notepad++ is free editor for programmer
notepad++ is free editor for programmer

การสั่งแสดงตัวอักษร ก ใน CP874 บน Webpage

มีโอกาสนั่งคุยกับนักศึกษา
เรื่องตัวเลข ฐานสิบ ฐานสิบหก และตาราง ASCII
พบตาราง Character Set ของคนไทย คือ Windows-874 หรือ TIS-620
หากจะแสดงเว็บเพจภาษาไทย
มักใช้ <meta http-equiv=”content-type” content=”text/html;charset=windows-874″ />
หรือ <meta charset=”tis-620″ />
แล้วสั่งแสดงตัวอักษร ก ด้วย &#3585; หรือพิมพ์ตรง ๆ ก็ได้
หากใช้ตัวเลข ก็แสดงว่า 3585 คือ ก
ซึ่งเป็นเลขสำหรับตัวอักษรภาษาไทยตัวแรก ในระบบ Unicode
แล้วพบว่าไม่สามารถแสดงด้วย &#161; หรือ &#xA1;
เพราะ Browser ไม่ได้รองรับ
อักษรพิเศษอื่น ๆ ที่ชวนมอง และมี Entity Name

อาทิ
&amp; = 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

แล้วโฮมเพจหน้าหนึ่งของผมก็ได้ 100/100 จาก pagespeed ของ google.com

pagespeed 100/100
pagespeed 100/100

เล่าสู่กันฟัง
เคยมีเพื่อนสนใจเรื่อง “การประเมินเว็บเพจให้ทำงานเร็ว และดีกับผู้ใช้
เพราะถ้าข้อมูลมหาศาลแล้ว ก็มีประเด็นสำคัญ 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

คนไทย.com มี Thailand Gateway มีข้อมูลทำให้เรารู้ว่าประเทศไทย มีคนไทยกี่คน
คนไทย.com มี Thailand Gateway มีข้อมูลทำให้เรารู้ว่าประเทศไทย มีคนไทยกี่คน

แล้วเมื่อเที่ยงของวันที่ 17 มกราคม 2560 นอกจากข้อมูลข้างต้น
ยังพบว่าเครื่องบริการข้อมูลของที่นี่ น่าจะใช้ Mysql
และใช้ภาษา PHP ที่รู้เพราะขณะโหลดข้อมูล
มีข้อความ Warning แจ้งให้ทราบ ว่าระบบฐานข้อมูลไม่ตอบตามปกติ
ก็เป็นกรณีศึกษาที่สามารถนำไปแบ่งปันในห้องเรียนได้
http://stat.bora.dopa.go.th/stat/y_stat58.htm