เว็บไซต์ทำงานอย่างไร: เรียนรู้ว่ามีอะไรซ่อนอยู่

เทคโนโลยีจำนวนมากเข้าสู่การสร้างเว็บไซต์ ระบบ การจัดการเนื้อหา(Content management systems)เฟรมเวิ(frameworks)ร์กภาษาสคริปต์และภาษาโปรแกรมต่างๆ(different scripting and programming languages) ระบบ การชำระเงิน(payment systems) ... ทุกประเภท!

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

ดูรหัสของเว็บไซต์

หากคุณไม่ใช่นักพัฒนาหรือเพิ่งเริ่มต้น คุณกำลังเรียนรู้เคล็ดลับในการเขียนโปรแกรมให้ดีขึ้น ดูรหัสของคนอื่น เราได้แสดงให้คุณเห็นถึงวิธีการใช้เครื่องมือสำหรับนักพัฒนาซอฟต์แวร์ของ Chrome(how to use Chrome’s Developer Tools)เพื่อดำเนินการดังกล่าว 

ChromeDevToolsจะช่วยคุณดูโค้ด HTML(HTML) , JavaScriptและCSS ของไซต์ ค้นหาแหล่งที่มาที่อาจใช้ ตลอดจนวิธีตรวจสอบประสิทธิภาพการโหลดของไซต์ในเบราว์เซอร์ เว็บเบราว์เซอร์หลักๆ ทั้งหมดมีเครื่องมือสำหรับนักพัฒนาเวอร์ชันบางเวอร์ชัน

สร้างด้วย(BuiltWith)

BuiltWith.comเป็นแหล่งข้อมูลระดับมืออาชีพที่เจาะลึกเข้าไปในไซต์เพื่อดูเทคโนโลยีทั้งหมดที่พวกเขาใช้ ปัจจุบันครอบคลุมกว่า 673 ล้านเว็บไซต์และเพิ่มขึ้นเรื่อยๆ แนวคิดหลักเบื้องหลังไซต์คือการช่วยสร้างโอกาสในการขายให้กับผู้คนในการขายซอฟต์แวร์

คุณลักษณะขั้นสูงมีให้เฉพาะผ่านการสมัครแบบชำระเงิน แต่ทุกคนสามารถไปที่BuiltWith.comป้อนที่อยู่เว็บไซต์ ชื่อเทคโนโลยี หรือคำหลัก และรับโปรไฟล์เทคโนโลยีโดยละเอียด ลงชื่อ(Sign)สมัครใช้บัญชีฟรีและค้นหารายละเอียดได้ห้ารายการต่อวัน

รายงานไซต์ Netcraft(Netcraft Site Report)

Netcraft เป็นแหล่งข้อมูลสำหรับนักพัฒนาเว็บมาตั้งแต่ปี 1995 ความเชี่ยวชาญของพวกเขากว่า 25 ปีแสดงให้เห็นในเครื่องมือรายงานเว็บไซต์ ฟรีของ Netcraft (Site Report)โดยจะรวมรายงานเทคโนโลยีเข้ากับรายงานเบื้องหลัง " ใครเป็นเจ้าของไซต์(who owns the site) " เพื่อให้คุณเข้าใจภาพรวมของไซต์อย่างถี่ถ้วน คุณจะรู้ว่าโฮสต์อยู่ที่ไหน และใครเป็นเจ้าของ รวมถึงประวัติโดเมนบางส่วน

Netcraft Site Reportอนุญาตให้ค้นหาได้ไม่จำกัด ยังคงใช้เฉพาะเมื่อคุณต้องการจริงๆ เป็นทรัพยากรฟรีและชุมชนนักพัฒนาต้องการเห็นเป็นอย่างนั้น

ข้อมูลไซต์ของ W3Techs(W3Techs’ Sites Info)

เครื่องมือข้อมูลไซต์ของ W3Techs ทำงานแตกต่างจากเครื่องมืออื่นๆ เล็กน้อย พวกเขาเก็บฐานข้อมูล(database)ของข้อมูลไว้ แต่เฉพาะในไซต์ที่มีการค้นหาผ่านเครื่องมือแล้วเท่านั้น หากคุณกำลังตรวจสอบเว็บไซต์ที่ยังไม่เคยตรวจสอบมาก่อน เว็บไซต์จะรวบรวมข้อมูลเว็บไซต์ทันที 

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

Wappalyzer

หากคุณต้องการมีปลั๊กอินของเบราว์เซอร์เพื่อตรวจสอบเทคโนโลยีของไซต์Wappalyzer มี(Wappalyzer)ปลั๊กอินสำหรับFirefox , ChromeและEdge ปลั๊กอินฟรี ใช้งานง่าย และมีการจัดวางในรูปแบบที่อ่านง่าย การคลิกที่เทคโนโลยีใดๆ ในรายงานจะนำคุณไปสู่คำอธิบาย ซึ่งดีมากหากพบสิ่งที่คุณไม่เคยเห็นมาก่อน 

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

แต่คุณจะได้รับ 50 เครดิตฟรีทุกเดือน และการแจ้งเตือนมีค่าใช้จ่ายเพียง 10 เครดิตต่อทุกๆ 30 วัน ดังนั้นการแจ้งเตือนของ Wappalyzer นั้นฟรีโดยพื้นฐาน หากคุณกำลังตรวจสอบไซต์ 5 แห่งหรือน้อยกว่า

เว็บสปอตเตอร์(Webspotter)

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

คุณลักษณะที่น่าสนใจยิ่งกว่านั้นคือความสามารถของ Webspotter ในการดึงรายชื่อติดต่อทางอีเมล ลิงก์โซเชียลมีเดียการวิเคราะห์ SEO(SEO analytics)และข้อมูลบริษัทอื่นๆ ออกจากเว็บไซต์ แม้ว่าจะไม่ได้บอกคุณเกี่ยวกับวิธีการสร้างเว็บไซต์ แต่ก็อาจมีประโยชน์สำหรับวัตถุประสงค์ทางการตลาดออนไลน์หรือแม้แต่การหางาน

WordPress Theme Detector

บางทีคุณอาจไม่ได้สนใจในการพัฒนาเว็บไซต์มากนัก แต่คุณกำลังรวบรวม เว็บไซต์ WordPressและต้องการรวมคุณสมบัติที่คุณเคยเห็นที่อื่น ดาวน์โหลดปลั๊กอิน WordPress Theme Detector ของเบ รา  ว์เซอร์ Chrome(Download the WordPress Theme Detector Chrome browser plugin)

WordPress Theme Detectorไม่เพียงแต่บอกคุณว่า ไซต์ใช้ ธีม WordPress(WordPress theme) อะไร แต่ยังบอกคุณด้วยว่าใช้ปลั๊กอิน WordPress อะไร (WordPress plugins)นอกจากนี้ยังแสดงให้คุณเห็นว่าใครเป็นคนสร้างธีมหรือปลั๊กอินและให้ลิงก์ไปยังที่ที่คุณสามารถหาได้ ทำให้ง่ายต่อการรวมองค์ประกอบต่างๆ ลงใน ไซต์ WordPress ของคุณ ซึ่งคุณชื่นชมในไซต์อื่นๆ

เรียนรู้วิธีการทำงานของเว็บไซต์

ใช่ มันง่ายมากที่จะเจาะลึกเข้าไปในเว็บไซต์ใด ๆ บนอินเทอร์เน็ต(Internet)และดูว่ามันทำมาจากอะไร ลองใช้เครื่องมือเหล่านี้ตั้งแต่สองอย่างขึ้นไป เนื่องจากบางเครื่องมืออาจหยิบของที่เครื่องมืออื่นๆ ไม่ใช้ได้ สิ่งที่คุณเห็นส่วนใหญ่ในไซต์แสดงผลบนคอมพิวเตอร์ของคุณจริงๆ นั่นคือสิ่งที่ทำให้ง่ายต่อการดู นอกจากนี้ยังเป็นเหตุผลที่คุณต้องการทำให้เว็บไซต์ของคุณมีความปลอดภัยมาก(make your website as secure as possible)ที่สุด เพลิดเพลินไปกับการดำน้ำลึกของคุณและแจ้งให้เราทราบสิ่งที่คุณพบหรือสร้าง



About the author

ฉันเป็นวิศวกรซอฟต์แวร์และบล็อกเกอร์ที่มีประสบการณ์เกือบ 10 ปีในสาขานี้ ฉันเชี่ยวชาญในการสร้างบทวิจารณ์เครื่องมือและบทช่วยสอนสำหรับแพลตฟอร์ม Mac และ Windows รวมถึงการให้ความเห็นจากผู้เชี่ยวชาญในหัวข้อการพัฒนาซอฟต์แวร์ ฉันยังเป็นวิทยากรและผู้สอนมืออาชีพ โดยได้นำเสนอผลงานในการประชุมเทคโนโลยีทั่วโลก



Related posts