ย้อนดู 30+ หลายปีของการออกแบบเว็บไซต์อินเทอร์เน็ต

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

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

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

ต้นปี 1990: สมัยโบราณ

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

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

ประเด็นสำคัญสำหรับเว็บไซต์อินเทอร์เน็ตสมัยใหม่:

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

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

กลางปี ​​1990: ยุคกลาง

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

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

ประเด็นสำคัญสำหรับเว็บไซต์วันนี้:

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

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

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

ปลายทศวรรษ 1990: ยุคฟื้นฟูศิลปวิทยา

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

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

Flash เป็นจุดเริ่มต้นของรูปแบบและการออกแบบที่เน้นลูกค้าเป็นหลัก — การก่อสร้างและการนำทางกลายเป็นเกณฑ์สำคัญ และนักออกแบบเริ่มฝึกฝนในรูปลักษณ์และความสามารถในการใช้งานมากกว่าบทความบริสุทธิ์

ประเด็นสำคัญสำหรับเว็บไซต์อินเทอร์เน็ตในปัจจุบัน:

Flash เป็นตัวเปลี่ยนเกม แต่มันจะไม่ยึดติดอยู่กับทุกส่วนอย่างถาวร Flash แทบจะไม่เคยใช้เลยในตอนนี้ และถือว่าเป็นหนึ่งในบาปด้านการปรับแต่งเว็บที่ใหญ่ที่สุดตลอดกาล ทุกวันนี้ เป็นบรรทัดฐานในการตัดสินใจเลือกใช้โซลูชันอื่น เช่น แอนิเมชั่น CSS และ JavaScript เพื่อให้ได้ผลลัพธ์ที่เท่าเทียมกัน หรือเพื่อฝังภาพยนตร์จากเว็บไซต์โฮสต์วิดีโอคลิปวิดีโอ

ต้นยุค 2000: การตรัสรู้

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

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

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

ประเด็นสำคัญสำหรับเว็บไซต์อินเทอร์เน็ตในปัจจุบัน:

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

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

กลางถึงปลายทศวรรษ 2000: การปฏิวัติอุตสาหกรรม

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

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

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

ประเด็นสำคัญสำหรับเว็บไซต์อินเทอร์เน็ตในปัจจุบัน:

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

Seo ต้องการเนื้อหาที่เป็นลายลักษณ์อักษร และเนื้อหาที่เป็นลายลักษณ์อักษรส่วนใหญ่จึงกลายเป็นจุดเน้นของรูปแบบและการออกแบบเว็บไซต์ในช่วงเวลานี้ การเพิ่มประสิทธิภาพคำหลัก การเชื่อมโยงขาเข้าและขาออก การเขียน การแท็ก และความรู้ในการเผยแพร่ เนื่องจาก RSS กลายเป็นองค์ประกอบเลย์เอาต์ที่แท้จริง ในขณะที่การส่งสแปม url และข้อความค้นหาติดขัดใช้ประโยชน์จากวิธีการเหล่านี้อย่างรวดเร็ว ขั้นตอนเหล่านี้ไม่ได้ผลเป็นระยะเวลานาน และ (ฉันหวังว่า) ส่วนใหญ่จะมลายไป

2010 ถึงปัจจุบัน: ยุคแห่งแฟชั่น

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

ในสภาวะของสุนทรียศาสตร์ร่วมสมัย เราได้เห็นการแพร่กระจายของศิลปะแบบมินิมอลลิสต์: บทความแบบเบาบาง กราฟิกแบบแบน (ปุ่ม 3 มิติที่ยาวมาก!) จานสีที่ง่ายกว่า และภาพที่ใหญ่และชัดเจน นอกจากนี้ UX ยังอยู่ในขั้นกลาง ซึ่งช่วยให้มีตัวเลือกเลย์เอาต์เหล่านี้ เช่น การเลื่อนแบบไม่สิ้นสุด การออกแบบและสไตล์เว็บเพจเดี่ยว

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

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

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

เว็บไซต์อินเทอร์เน็ตจะไปที่ใดในภายหลัง

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

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

บรรณาธิการโปรดทราบ: ภาพนี้ถูกโพสต์ครั้งแรกในเดือนกรกฎาคม 2556 และเป็นปัจจุบันเพื่อความครอบคลุม