ຄອບຄົວຕົວອັກສອນທົ່ວໄປໃນ CSS ແມ່ນຫຍັງ?

ການຈັດປະເພດແບບອັກສອນໂດຍທົ່ວໄປທີ່ມີຢູ່ໃນເວັບໄຊທ໌ຂອງທ່ານ

ໃນເວລາທີ່ການອອກແບບເວັບໄຊທ໌ຫນຶ່ງ, ຫນຶ່ງໃນອົງປະກອບທີ່ສໍາຄັນຂອງຫນ້າທີ່ທ່ານຈະເຮັດວຽກແມ່ນເນື້ອໃນຂໍ້ຄວາມ. ດັ່ງນັ້ນ, ເມື່ອທ່ານສ້າງຫນ້າເວັບແລະແບບມັນດ້ວຍ CSS, ສ່ວນໃຫຍ່ຂອງຄວາມພະຍາຍາມນັ້ນຈະຖືກຈຸດສູນກາງຂອງ typography ຂອງເວັບໄຊທ໌.

ການອອກແບບປະເພດພິມມີບົດບາດສໍາຄັນໃນການອອກແບບເວັບໄຊທ໌. ການວາງແຜນທີ່ດີແລະຮູບແບບທີ່ເປັນຮູບແບບຊ່ວຍໃຫ້ເວັບໄຊທີ່ມີປະສົບຜົນສໍາເລັດຫຼາຍຂຶ້ນໂດຍການສ້າງປະສົບການການອ່ານທີ່ມີຄວາມສຸກແລະງ່າຍຕໍ່ການບໍລິໂພກ. ສ່ວນຫນຶ່ງຂອງຄວາມພະຍາຍາມຂອງທ່ານໃນການເຮັດວຽກຮ່ວມກັບປະເພດຈະເລືອກ ໂປແກຼມທີ່ຖືກຕ້ອງສໍາລັບການອອກແບບຂອງທ່ານ ແລະຫຼັງຈາກນັ້ນໃຫ້ໃຊ້ CSS ເພື່ອເພີ່ມຕົວອັກສອນແລະຄໍເຕົ້າໄຂ່ສະແດງແບບອັກສອນຂອງຫນ້າຈໍ. ນີ້ແມ່ນເຮັດໄດ້ໂດຍໃຊ້ສິ່ງທີ່ເອີ້ນວ່າ " font-stack "

Font-Stacks

ໃນເວລາທີ່ທ່ານ ກໍານົດຕົວອັກສອນ ເພື່ອນໍາໃຊ້ໃນຫນ້າເວັບ, ມັນແມ່ນການປະຕິບັດທີ່ດີທີ່ສຸດທີ່ຈະປະກອບມີທາງເລືອກໃນການປ່ຽນແປງໃນກໍລະນີທາງເລືອກແບບອັກສອນຂອງທ່ານບໍ່ສາມາດພົບໄດ້. ທາງເລືອກທີ່ fallback ເຫຼົ່ານີ້ຖືກນໍາສະເຫນີໃນ "font stack." ຖ້າຕົວທ່ອງເວັບບໍ່ສາມາດຊອກຫາຕົວອັກສອນທໍາອິດທີ່ສະແດງໄວ້ໃນ stack, ມັນຈະຍ້າຍໄປອີກຕໍ່ໄປ. ມັນຍັງສືບຕໍ່ຂະບວນການນີ້ຈົນກ່ວາມັນພົບວ່າຕົວອັກສອນທີ່ມັນສາມາດນໍາໃຊ້ໄດ້, ຫຼືມັນຈະບໍ່ມີຕົວເລືອກ (ໃນກໍລະນີທີ່ມັນເລືອກເອົາລະບົບທີ່ມັນຕ້ອງການ). ນີ້ແມ່ນຕົວຢ່າງຂອງວິທີການ font-stack ຈະເບິ່ງໃນ CSS ເມື່ອນໍາໃຊ້ກັບອົງປະກອບ "ຮ່າງກາຍ":

body {font-family: Georgia, "Times New Roman", serif }

ສັງເກດເຫັນວ່າພວກເຮົາກໍານົດຈໍ້າສອງເມັດທໍາອິດ. ໂດຍຄ່າເລີ່ມຕົ້ນ, ນີ້ແມ່ນສິ່ງທີ່ຫນ້າເວັບຈະໃຊ້, ແຕ່ຖ້າວ່າຕົວອັກສອນທີ່ບໍ່ສາມາດໃຊ້ໄດ້ສໍາລັບບາງເຫດຜົນ, ຫນ້າຈະກັບຄືນສູ່ Times New Roman. ພວກເຮົາສະເຫນີຊື່ຂອງຕົວອັກສອນໃນວົງຢືມຄູ່ເພາະວ່າມັນເປັນຊື່ຫຼາຍຄໍາ. ຊື່ແບບອັກສອນດຽວ, ເຊັ່ນຈໍເຈຍຫຼື Arial, ບໍ່ຈໍາເປັນຕ້ອງມີວົງຢືມ, ແຕ່ຊື່ໂປຣແກຣມຫຼາຍຄໍາຕ້ອງໃຫ້ພວກນັ້ນຕົວທ່ອງເວັບຮູ້ວ່າຄໍາທັງຫມົດເຫຼົ່ານັ້ນກໍ່ຄືຊື່ຂອງຕົວອັກສອນ.

ຖ້າທ່ານເບິ່ງສິ້ນສຸດຂອງຕົວອັກສອນ, ທ່ານຄວນສັງເກດວ່າພວກເຮົາຈົບລົງດ້ວຍຄໍາວ່າ "serif". ນັ້ນແມ່ນຊື່ຄອບຄົວຕົວອັກສອນໂດຍທົ່ວໄປ. ໃນກໍລະນີທີ່ບໍ່ສາມາດທີ່ຄົນທີ່ບໍ່ມີຈໍເຈຍຫຼື Times New Roman ໃນຄອມພິວເຕີຂອງພວກເຂົາ, ເວັບໄຊທ໌ຈະໃຊ້ແບບອັກສອນ serif ໃດກໍ່ຕາມ. ນີ້ແມ່ນເຫມາະສົມທີ່ຈະເຮັດໃຫ້ເວັບໄຊທ໌ກັບຄືນໄປບ່ອນໃດກໍ່ຕາມທີ່ມັນຕ້ອງການ, ເພາະວ່າທ່ານສາມາດບອກໄດ້ວ່າປະເພດໃດທີ່ຕ້ອງໃຊ້ເພື່ອວ່າຮູບແບບແລະຮູບແບບທົ່ວໄປຂອງການອອກແບບຂອງເວັບໄຊທ໌ຈະເປັນທີ່ສຸດເທົ່າທີ່ເປັນໄປໄດ້. ແມ່ນ, ຕົວທ່ອງເວັບຈະເລືອກເອົາຕົວອັກສອນສໍາລັບທ່ານ, ແຕ່ຢ່າງຫນ້ອຍທ່ານກໍາລັງໃຫ້ຄໍາແນະນໍາເພື່ອໃຫ້ຮູ້ວ່າປະເພດໃດທີ່ເຮັດວຽກດີທີ່ສຸດໃນການອອກແບບ.

Generic Font Families

ຊື່ແບບທົ່ວໄປທີ່ມີຢູ່ໃນ CSS ແມ່ນ:

ໃນຂະນະທີ່ມີການຈໍາແນກແບບອັກສອນອື່ນໆທີ່ມີຢູ່ໃນການອອກແບບເວັບໄຊທ໌ແລະ typography, ລວມທັງ slab-serif, blackletter, ສະແດງ, grunge, ແລະອື່ນໆ, ເຫຼົ່ານີ້ 5 ຕົວອັກສອນທົ່ວໄປທີ່ກໍານົດໄວ້ຊື່ທົ່ວໄປແມ່ນສິ່ງທີ່ທ່ານຈະນໍາໃຊ້ໃນ font-stack ໃນ CSS. ຄວາມແຕກຕ່າງໃນການຈັດປະເພດແບບອັກສອນເຫຼົ່ານີ້ແມ່ນຫຍັງ? ຂໍໃຫ້ເບິ່ງ!

ຕົວອັກສອນ Cursive ມັກຈະມີຕົວອັກສອນບາງຢ່າງທີ່ມີຮູບຮ່າງງາມ, ເຊິ່ງຫມາຍຄວາມວ່າຈະຕ້ອງ replicate ຂໍ້ຄວາມທີ່ຂຽນດ້ວຍມືຖື. ຕົວອັກສອນເຫຼົ່ານີ້, ເນື່ອງຈາກວ່າຕົວອັກສອນບາງໆຂອງພວກເຂົາ, ບໍ່ມີຄວາມເຫມາະສົມສໍາລັບເນື້ອຫາຂະຫນາດໃຫຍ່ເຊັ່ນ: ຮ່າງກາຍ. ຕົວອັກສອນ Cursive ຖືກນໍາໃຊ້ໂດຍທົ່ວໄປສໍາລັບຫົວຂໍ້ແລະຄວາມຕ້ອງການຂໍ້ຄວາມສັ້ນທີ່ສາມາດສະແດງໃນຂະຫນາດຕົວອັກສອນທີ່ໃຫຍ່ກວ່າ.

ຕົວແບບ Fantasy ແມ່ນຕົວອັກສອນ Crazy ທີ່ຮ່ອງຮອຍທີ່ບໍ່ໄດ້ຕົກລົງໃນປະເພດອື່ນໆ. ຕົວອັກສອນທີ່ເຮັດແບບຟອມທີ່ຮູ້ຈັກກັນດີເຊັ່ນຫນັງສືອັກສອນຈາກ Harry Potter ຫຼືກັບຄືນໄປບ່ອນຮູບເງົາໃນອະນາຄົດຈະຕົກຢູ່ໃນຫມວດນີ້. ອີກເທື່ອຫນຶ່ງ, ໂປແກມເຫຼົ່ານີ້ບໍ່ເຫມາະສົມສໍາລັບເນື້ອໃນຂອງຮ່າງກາຍເນື່ອງຈາກວ່າພວກເຂົາມັກຈະສະໄຕທີ່ວ່າການອ່ານຂໍ້ຄວາມທີ່ຍາວກວ່າຂອງຂໍ້ຄວາມທີ່ຂຽນໄວ້ໃນໂປແກມເຫຼົ່ານີ້ແມ່ນມີຫຼາຍເກີນໄປທີ່ຈະເຮັດ.

ຕົວອັກສອນ Monospace ແມ່ນບ່ອນທີ່ຫນັງສືອັກສອນທັງຫມົດແມ່ນມີຂະຫນາດແລະເທົ່າທຽມກັນເທົ່າທຽມກັນ, ຄືກັບວ່າທ່ານຈະພົບກັບເຄື່ອງພິມເກົ່າເກົ່າ. ນອກເຫນືອຈາກຕົວອັກສອນອື່ນໆທີ່ມີຄວາມກວ້າງຂອງຕົວແປສໍາລັບຕົວອັກສອນຂຶ້ນຢູ່ກັບຂະຫນາດຂອງພວກເຂົາ (ຕົວຢ່າງເຊັ່ນທຶນ "W" ຈະໃຊ້ເວລາຫຼາຍກວ່າຫ້ອງ "i"), fonts monospace ແມ່ນຄວາມຍາວຄົງທີ່ສໍາລັບຕົວອັກສອນທັງຫມົດ. ຕົວອັກສອນເຫຼົ່ານີ້ມັກຖືກນໍາໃຊ້ເມື່ອລະຫັດຖືກສະແດງໃນຫນ້າເວັບເນື່ອງຈາກພວກເຂົາເບິ່ງແຕກຕ່າງກັນກ່ວາຂໍ້ຄວາມອື່ນໃນຫນ້ານັ້ນ.

ຕົວອັກສອນ Serif ແມ່ນຫນຶ່ງໃນປະເພດທີ່ນິຍົມຫຼາຍ. ເຫຼົ່ານີ້ແມ່ນຕົວອັກສອນທີ່ມີສາຍພັນພິເສດນ້ອຍໆຢູ່ໃນຕົວອັກສອນ. ເຫຼົ່ານີ້ຕ່ອນພິເສດແມ່ນເອີ້ນວ່າ "serifs". ຕົວອັກສອນ serif ທົ່ວໄປແມ່ນຈໍເຈຍແລະ Times New Roman. ຕົວອັກສອນ Serif ສາມາດຖືກນໍາໃຊ້ສໍາລັບຂໍ້ຄວາມຂະຫນາດໃຫຍ່ເຊັ່ນ: ຫົວຂໍ້ເຊັ່ນດຽວກັນກັບຂໍ້ຄວາມຍາວຂອງຂໍ້ຄວາມແລະຮ່າງກາຍສໍາເນົາ.

Sans-serif ແມ່ນການຈັດປະເພດຂັ້ນສຸດທ້າຍທີ່ພວກເຮົາຈະເບິ່ງ. ເຫຼົ່ານີ້ແມ່ນຕົວອັກສອນທີ່ບໍ່ມີສາຍພັນທີ່ກ່າວມານັ້ນ. ຊື່ຫມາຍຄວາມວ່າ "ບໍ່ມີ serifs". ຕົວອັກສອນທີ່ນິຍົມໃນປະເພດນີ້ຈະເປັນ Arial ຫຼື Helvetica. ຄ້າຍຄືກັບ serifs, ອັກສອນ sans-serif ສາມາດນໍາໃຊ້ໄດ້ດີໃນຫົວຂໍ້ແລະເນື້ອຫາຂອງຮ່າງກາຍ.

ບົດສະບັບຕົ້ນໂດຍ Jennifer Krynin. ແກ້ໄຂໂດຍ Jeremy Girard ວັນທີ 10/16/17