CSS เป็นเทคโนโลยีที่น่าทึ่ง เมื่อฉันใช้ครั้งแรก ฉันคิดว่ามันเป็นสิ่งที่ฉันไม่เคยฝันถึง ด้วยการแนะนำ CSS3 เทคโนโลยีต่างๆ เช่น มุมโค้งมน เงา การหมุน ฯลฯ ได้นำ CSS ไปสู่ความสูงที่ไม่เคยมีมาก่อน อย่างไรก็ตาม เกี่ยวกับ CSS เราไปไกลเกินไปแล้วหรือยัง บทความนี้ให้แนวคิดใหม่แก่แอปพลิเคชันทดลองของ CSS จากมุมมองของนักออกแบบเว็บไซต์
การทดลองที่ล้ำสมัยด้วย CSS
การทดลองแต่ละครั้งใช้วิธีการที่แตกต่างกัน การทดลองบางอย่าง เช่น การวาดเส้น CSS สามารถค้นหาการใช้งานจริงได้ การทดลองอื่นๆ เช่น การวาดภาพ Twitter Fail Whale ที่ดำเนินการโดย CSS เป็นเพียงการทดลองเท่านั้น แสดงให้เห็นว่า CSS ทำอะไรได้บ้าง ไม่ได้หมายความว่าควรทำในลักษณะนี้
มาปฏิบัติกันเถอะ
รูปภาพด้านบนเป็นโลโก้เครือข่ายโซเชียลมีเดียที่ใช้ CSS ล้วนๆ น่าทึ่งมากใช่ไหม
ฉันเพิ่งอ่านบทความของ Faruk Ateş เรื่อง Pure CSS Icons: Make The Madness Stop ซึ่งตั้งคำถามถึงแนวทางนี้ ผู้เขียนกล่าวว่าบางคนเริ่มลองใช้ CSS เป็นเครื่องมือออกแบบและกระตุ้นให้มีผู้ลอกเลียนแบบจำนวนมากอย่างรวดเร็ว เข้าถึงได้เป็นแนวทางหรือไม่? ไม่ใช่เรื่องง่ายที่จะรวมเข้ากับการออกแบบและการพัฒนาของคุณ และไม่ใช่เรื่องง่ายที่จะปรับเปลี่ยน
เช่นเดียวกับโลโก้โซเชียลเน็ตเวิร์กด้านบนซึ่งมีพื้นฐานมาจาก CSS โดยสิ้นเชิง มันไม่มีอะไรมากไปกว่าการผสมผสานเส้นต่างๆ เข้าด้วยกัน มันน่าประทับใจและสร้างสรรค์ แต่ใช้งานไม่ได้จริงเพราะการสร้างโลโก้ดังกล่าวอาจต้องใช้เวลาหลายชั่วโมง การทำงานการวาดภาพเดียวกันใน Photoshop โดยไม่ต้องใช้ความพยายามใด ๆ เลยและเอฟเฟกต์ก็ดีกว่า (มีรายละเอียดมากขึ้น)
Ateş เชื่อว่าการบำรุงรักษาไอคอนที่สร้างขึ้นด้วยวิธีนี้ก็เป็นปัญหาเช่นกัน เดิมทีการปรับไอคอนจำเป็นต้องปรับพิกเซลเท่านั้น แต่ตอนนี้คุณต้องแก้ไขคำจำกัดความ CSS ในเวลาเดียวกัน โลโก้ CSS ยังบอกด้วยว่าการทำสิ่งนี้ CSS นั้นไม่เหมาะที่สุด
ลดคำขอ HTTP หรือไม่
ไอคอนในภาพด้านบนทั้งหมดสร้างขึ้นด้วย CSS และผู้เขียนขายมัน โดยขาย 40 ไอคอนในราคา $25 ฉันต้องยอมรับว่าไอคอนเหล่านี้ได้รับการออกแบบอย่างสวยงามมาก ความตั้งใจเดิมของผู้เขียนในการออกแบบ CSS เหล่านี้คือการลดจำนวนคำขอ HTTP สำหรับเว็บไซต์เหล่านั้น เนื่องจากไอคอนเหล่านี้ไม่ต้องการคำขอไฟล์รูปภาพเพิ่มเติม อย่างไรก็ตาม คำขอ HTTP ที่มาจากไฟล์ไอคอนขนาดเล็กนั้นคุ้มค่าแก่การกล่าวถึงหรือไม่ นอกจากนี้ ด้วยการใช้เทคโนโลยี CSS Sprite ไอคอนเหล่านี้สามารถวางลงในรูปภาพเดียวกันและแสดงโดยการวางตำแหน่ง CSS ได้ ด้วยวิธีนี้ คำขอ HTTP เดียวเท่านั้นที่จำเป็น ขอก็พอแล้ว ยิ่งไปกว่านั้น ฉันสงสัยจริงๆ ว่าไอคอนเวอร์ชัน CSS เหล่านี้สามารถลดแบนด์วิธได้มากเพียงใด
ในจิตวิญญาณแห่งความหมาย
ฉันต้องยอมรับว่าบางครั้งฉันใช้แท็กเพิ่มเติม เช่น DIV หรือ SPAN เพื่อให้บรรลุความต้องการด้านภาพบางอย่าง ซึ่งไม่มีความหมายมากนัก อย่างไรก็ตาม การวาด CSS นั้นมีความหมายน้อยกว่า ภารกิจที่แท้จริงของ CSS คือการแก้ไขเนื้อหาในหน้าเว็บ ไม่ใช่การสร้างเนื้อหาเอง กราฟิกในหน้าเว็บนั้นอยู่ในหมวดหมู่ของเนื้อหาและไม่ควรสร้างด้วย CSS
แหล่งที่มาดั้งเดิมของบทความนี้: blog.echoenduring.com เรากำลังใช้ CSS มากเกินไปหรือเปล่า? (ผู้เขียนต้นฉบับ: แมตต์ วอร์ด)
แหล่งที่มาของข้อความที่ตัดตอนมาจากภาษาจีน: เว็บไซต์อย่างเป็นทางการ ของระบบจัดการเนื้อหาเว็บไซต์ Ruishang Enterprise CMS