20 เคล็ดลับสำหรับการออกแบบเวบ[ตอนที่ 4]

20 เคล็ดลับสำหรับการออกแบบเวบ[ตอนที่ 4]
โดย: Jason Arber ที่มา: netmag.co.uk

16. เปลี่ยนแปลงอักษรตัวใหญ่โดยใช้ CSS : ถ้าคุณต้องการเขียนบางอย่างด้วยตัวอักษรที่ใหญ่ เช่นใน Headline ค่อนข้างจะดีกว่าการคัดลอกเขียนใหม ให้ CSS ทำงานตรงนี้ดีกว่า รหัสต่อไปนี้จะเปลี่ยนแปลงรูปแบบอักษรทั้งหมดด้วยคุณสมบัติ h1 ไปสู่อักษรใหญ่ทั้งหมด

h1 { text-transform: uppercase; }

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

<img src=”image.jpg” align=”left”>

18. ตั้งค่าตัวอักษรสากล : การตั้งค่าตัวอักษรคือส่วนของความสำคัญของการกำหนดหน้าเวบเพจแต่การตั้งค่าอักษรค่อนข้างจะเป็นส่วนที่เข้าใจได้น้อยที่สุดการตั้งค่าตัวอักษรจะกำหนดไว้ในส่วนหัวของเวบเพจที่จะไม่แสดงผลจะเป็นตัวบอกบราวเซอร์ว่าวิธีการที่จะใช้ในการเข้ารหัสตัวอักษร ชุดอักษร ISO Latin 1 (เป็นเช่นเดียวกับ ISO 8859-1) จะแปลรหัสที่ถูกพบว่ามีการใช้พื้นฐานของชาวตะวันตก แต่ชุดอักษรของ Shift JIS จะพยายามแสดงผลอักษรที่พบเช๋นญี่ปุ่น

ด้วยการตั้งค่าตัวอักษรที่มากมาย ปัญหาจะถูกแสดงโดยเฉพาะเมื่อมีการใช้ชุดอักษรของ MS Windows (ซึ่งจะบรรจุตัวอักษรที่อาจจะแทนที่ด้วยช่องว่างในระบบปฎิบัติการอื่น) หรือหลายภาษาจำเป็นต้องแสดงในหน้าเวบเพจเวบเดียว

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

<meta http-equiv=”content-type” content=”text/ html;charset=utf-8” />

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

<link rel=”stylesheet” type”text/css” href=”print.css” media=”print”>

หรือ

<style type=”text/css” media=”print”> @import url(print.css); </style>

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

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