เรื่องการอ้างอิง url (ตัวชี้แหล่งในอินเทอร์เน็ต) นี่เป็นเรื่องใหญ่นะครับ ทำไงให้กระชับ ไม่รกหูรกตามาก เพราะ url เดี๋ยวนี้ยาวเหยียดเหลือเกิน ถ้าแปะไปทื่อๆ นอกจากกินที่แล้ว ยังตรวจทานยากด้วย ว่าผิดอะไรตรงไหนรึเปล่า ลายตา

ถ้ารู้การทำงานของเว็บไซต์ที่เราใช้งานเสียหน่อย อ่าน url พอเป็น ว่าส่วนไหนใช้ทำอะไร อะไรตัดได้ หรือใช้อะไรแทนได้ ก็จะช่วยตรงนี้ได้เยอะ (กดลงไปดูล่างสุด สำหรับวิธีอ่าน url)

—-

อย่างถ้าจะแปะ url ของ notes บนเฟซบุ๊ก แทนที่จะใช้ url แบบ “สวยๆ” ที่เฟซบุ๊กมันทำให้ (ซึ่งใช้ได้ดีกับภาษาอังกฤษ แต่กับภาษาไทยมันจะยาวมาก อ่านไม่ออกด้วย) แบบนี้:

(1) https://www.facebook.com/notes/art-bact/%E0%B8%94%E0%B8%B9%E0%B8%9E%E0%B8%A3%E0%B8%9A%E0%B8%84%E0%B8%AD%E0%B8%A1%E0%B8%9E%E0%B8%B4%E0%B8%A7%E0%B9%80%E0%B8%95%E0%B8%AD%E0%B8%A3%E0%B9%8C%E0%B8%9F%E0%B8%B4%E0%B8%A5%E0%B8%B4%E0%B8%9B%E0%B8%9B%E0%B8%B4%E0%B8%99%E0%B8%AA%E0%B9%8C-%E0%B9%81%E0%B8%A5%E0%B9%89%E0%B8%A7%E0%B8%84%E0%B8%B4%E0%B8%94%E0%B8%96%E0%B8%B6%E0%B8%87%E0%B8%9E%E0%B8%A3%E0%B8%9A%E0%B8%84%E0%B8%AD%E0%B8%A1%E0%B8%9E%E0%B8%B4%E0%B8%A7%E0%B9%80%E0%B8%95%E0%B8%AD%E0%B8%A3%E0%B9%8C%E0%B9%84%E0%B8%97%E0%B8%A2-%E0%B8%9B%E0%B8%A3%E0%B8%B0%E0%B9%80%E0%B8%94%E0%B9%87%E0%B8%99-%E0%B8%82%E0%B9%89%E0%B8%AD%E0%B8%A1%E0%B8%B9%E0%B8%A5%E0%B8%84%E0%B8%AD%E0%B8%A1%E0%B8%9E%E0%B8%B4%E0%B8%A7%E0%B9%80%E0%B8%95%E0%B8%AD%E0%B8%A3%E0%B9%8C/10151428354777646

เราก็ไปใช้แบบนี้แทนได้:

(2) https://www.facebook.com/notes/10151428354777646

ฟอร์แมตมันจะเป็นว่า https://www.facebook.com/notes/<เลขไอดีของบันทึก>
ซึ่งเจ้าเลขไอดีนี่ ก็คือส่วนท้ายสุดหลังอักขระ / ตัวสุดท้ายใน (1)

—-

อีกประเภท เรียกว่าพวก tracker parameters ละกัน หน้าตาจะประมาณนี้

(3) http://prachatai.com/journal/2012/12/44412?utm_source=dlvr.it&utm_medium=twitter

เจ้า utm_ อะไรทั้งหลายเนี่ย เป็นของที่เพิ่มเข้ามาเพื่อให้โปรแกรม Google Analytics รู้ว่า คนคลิกเข้าหน้านี้หรือรู้ url นี้มาจากไหน ซึ่งเราตัดทิ้งได้หมดเลย เหลือแค่นี้ได้

(4) http://prachatai.com/journal/2012/12/44412

ถ้าใครไม่อยากมาตัดออกเองแบบนี้ทุกครั้ง แล้วใช้เบราว์เซอร์ Google Chrome อยู่ มันมีส่วนเสริมชื่อว่า Tracking Token Stripper ซึ่งจะตัด utm_* ทั้งหลายให้เอาอัตโนมัติ ก็สะดวกดี

—-

หรือลิงก์ยูทูบยาวๆ แบบนี้

(5) https://www.youtube.com/watch?feature=player_embedded&v=rv_SFqK-OZM

ก็ตัดให้สั้นเหลือแค่นี้ได้

(6) https://www.youtube.com/watch?v=rv_SFqK-OZM

เพราะตัว feature=player_embedded นั้น ไม่ได้ใช้ทำอะไรมากกว่าไปกว่าบอกกับยูทูบว่า มีคนคลิกลิงก์นี้มาจากตัวเล่นที่ฝังอยู่ในหน้าเว็บ (เช่นกดดูจากไทม์ไลน์ในเฟซบุ๊ก) เราไม่จำเป็นต้องใส่ลงไปให้ยาวก็ได้

จริงๆ สำหรับยูทูบ ถ้าอยากให้สั้นกว่านี้ ตัวยูทูบมีฟอร์แมตสั้นๆ ให้ด้วย ถ้าเรากด share/แบ่งปัน ที่หน้าวิดีโอนั้นๆ จะเห็น url ในฟอร์แมตนี้:

(7) http://youtu.be/rv_SFqK-OZM

—-

บริการหลายอย่างเดี๋ยวนี้มี url แบบสั้นๆ ให้ได้ใช้งาน ซึ่งสะดวกกับการเอาไปใช้ในป้ายหรือสื่อประชาสัมพันธ์อื่นๆ รวมทั้งการอ่านออกอากาศ

Google Maps ก็มีบริการ url สั้นๆ เหมือนกัน ถ้าอยากจะแชร์ลิงก์แผนที่จุดไหน ก็กดไปที่ไอคอนโซ่ แล้วติ๊ก “URL แบบสั้น” แค่นี้ก็จะได้ url แบบสั้นๆ จาก:

(8) https://maps.google.com/?ll=37.0625%2C-95.677068&spn=60.376022%2C84.990234&t=h&z=4

หดเหลือแค่นี้ได้

(9) http://goo.gl/maps/oql4G

—-

ถ้าบริการไหนไม่มี url สั้นๆ เราก็ยังไปใช้บริการเว็บย่อลิงก์อย่าง bit.ly goo.gl is.gd v.gd su.pr ฯลฯ ได้เช่นกัน

โดยบริการย่อลิงก์ (url shortener) เหล่านี้ บางตัวเช่น bit.ly อนุญาตให้เรากำหนด url ที่ย่อแล้วได้ด้วย ซึ่งเราอาจใช้ความสามารถนี้ช่วยให้ url อ่านง่ายขึ้น เห็นแล้วพอจะรู้ว่าลิงก์ไปหาอะไร รวมทั้งใช้จัดกลุ่มลิงก์ได้ด้วย

เช่น ผมเคยย่อกลุ่ม url ที่ลิงก์ไปยังหน้าเวิร์กช็อปต่างๆ ของงานประชุมอินเทอร์เน็ตภิบาลครั้งที่ 7 แบบนี้ http://bit.ly/igf12ws149 http://bit.ly/igf12ws111 http://bit.ly/igf12ts — IGF12 ใน url มาจาก hashtag สำหรับงานประชุมดังกล่าว

—-

สำหรับคนที่เป็นแอดมินเพจเฟซบุ๊ก สามารถตั้ง url ของเพจให้สั้นๆ ได้ ด้วยการไปที่หน้า https://www.facebook.com/username แล้วตั้งได้เองเลย พยายามเอาที่สะกดง่ายๆ หน่อย

—-

เอาแบบทื่อๆ เลย เว็บไซต์หลายแห่งมากๆ เราไม่ต้องใส่ www. นำหน้าก็ได้ เข้าได้หน้าตาเหมือนกัน เช่น thainetizen.org กับ www.thainetizen.org — ถ้าแบบนี้เราตัด www. ทิ้งได้เลย ประหยัดพื้นที่ได้อีก

หรือบางครั้ง url ที่มี index.html หรือ index.htm หรือ index.php หรือ main.php พวกนี้ห้อยท้าย ถ้าเราลองตัดออกดู อาจจะเข้าหน้าถึงเว็บเดียวกันได้ก็ได้ เช่น http://ilaw.or.th/index.php กับ http://ilaw.or.th/ นี่ หน้าตาเหมือนกัน

แต่พวกนี้ต้องทดสอบดูก่อนนะครับ บางทีมันก็อาจจะนำไปสู่หน้าเว็บคนละหน้ากันก็ได้

—-

จริงๆ นี่ไม่ควรจะเป็นภาระของผู้ใช้อย่างเดียว คนทำเว็บก็ช่วยทำให้ url มันอย่ายาวมาก (หรือใช้ .htaccess จัดการตัดบางอย่างที่ไม่จำเป็นทิ้งให้อัตโนมัติ เช่น www.) แล้วทำให้มันพออ่านได้หน่อย มันมีแนวคิดที่เรียกว่า “semantic url” กับ “clean url” อยู่ (ซึ่งอาจจะใช้วิธี rewrite url เอา)

อย่างไรก็ตาม บางทีสั้นๆ เป็นโค้ด ก็เหมาะกับงานบางอย่าง แต่อาจจะไม่ค่อย semantic คือดูปราดเดียวไม่รู้ว่านี่มันหน้าเว็บเกี่ยวกับอะไร ต้องหาทางสมดุลเอา ให้เหมาะกับงาน หรือไม่ก็มีทั้งสองแบบให้ใช้ไปเลย

—-

เข้าใจ url ก่อนผ่าตัด (เพิ่ม 2013.01.15)

หน้าตาของ url ที่ซับซ้อนหน่อย ก็อาจจะประมาณนี้

(10) http://www.example.com/products/women/dresses.php?sessionid=34567&source=google.com&color=red

ถ้าแบ่งเป็นส่วนๆ ตามหน้าที่ของมัน จะได้แบบนี้

(11) http:// | www.example.com | /products/women/ | dresses.php | ? | sessionid=34567 | & | source=google.com | & | color=red

ส่วนหน้าสุด โดยมากจะเป็น “http” หรือ “https” ซึ่งเป็นตัวบอกว่านี่กำลังใช้เว็บอยู่นะ ด้วยวิธีการรับส่งข้อมูลที่เรียกว่า Hypertext Transfer Protocol ถ้าเป็น https ตัว s ที่เพิ่มขึ้นมา หมายถึง secure แปลว่าปลอดภัย

ส่วนต่อมา ก็คือตัวชื่อโดเมน โดยมันจะไล่ย้อนหลัง: .com นี่เป็นโดเมนประเภทที่เรียกว่า TLD หรือ top-level domain คือใหญ่สุด (ในประเภทเดียวกันนี้ก็มีเช่น .net .org .edu .asia ฯลฯ), ต่อมาคือ example เป็นชื่อโดเมน ที่อยู่ใต้ .com อีกที, แล้วก็ www ซึ่งอยู่ใต้ .example.com อีกที ซึ่งเจ้า www นี้ เราเรียกว่าโดเมนย่อยหรือซับโดเมน (sub-domain) เว็บไซต์บางเจ้าอาจจะมีโดเมนย่อยหลายอันได้ เช่น login.example.com ไว้จัดการเรื่องล็อกอิน, www.example.com เป็นหน้าเว็บหลัก, m.example.com เป็นหน้าเว็บสำหรับมือถือ

ส่วนต่อมา เรียกว่า path คล้ายๆ ป้ายบอกเส้นทางไปสู่ข้อมูลที่เราจะเรียกดู จะมองมันเป็นชื่อห้องก็ได้ ซึ่งกรณีนี้ก็เป็น ห้อง women ที่อยู่ในห้อง products อีกที (คั่นชื่อห้องด้วยเครื่องหมาย “/”)

ต่อไปก็เป็นชื่อแฟ้มข้อมูลที่เราจะเรียกดู ซึ่งอาจจะเป็นชื่อแฟ้มที่เก็บตัวข้อมูลอยู่จริงๆ เช่น index.html หรือ image.jpg หรืออาจจะเป็นการบอกให้โปรแกรมมันไปดึงข้อมูลจากที่อื่นมาให้เราดูก็ได้ เช่นกรณีนี้ “dresses.php” เป็นโปรแกรมภาษา PHP ที่จะส่งข้อมูลที่เราขอกลับมาให้

แล้วตัวโปรแกรมที่ว่า มันจะรู้ได้ยังไง ว่าเราอยากดูอะไร ก็คือส่วนที่อยู่ข้างหลัง “?” ครับ ข้างหลังทั้งหมดนี้เรียกรวมว่าพารามิเตอร์ รูปแบบก็จะเป็น key=value แล้วคั่นด้วยเครื่องหมาย “&” ต่อกันไปเรื่อยๆ เช่นกรณีนี้ก็คือ บอกว่า sessionid คือ 34567 นะ, source มาจาก google.com, และเอา color เป็น red

url จำนวนนึงที่มันยาวๆ ก็เพราะไอ้ข้างหลังเครื่องหมาย ? นี่แหละครับ มี key=value&key=value&key=value&key=value&key=value&key=value อะไรไม่รู้เต็มไปหมด ซึ่งเราสามารถทดลองตัดมันไปทีละชุดได้ครับ แล้วดูว่าผลลัพธ์ยังเป็นแบบที่ต้องการอยู่รึเปล่า