{"id":25216,"date":"2026-06-26T13:05:19","date_gmt":"2026-06-26T07:35:19","guid":{"rendered":"https:\/\/lollypop.design\/?p=25216"},"modified":"2026-06-26T15:37:11","modified_gmt":"2026-06-26T10:07:11","slug":"typography-la-gi","status":"publish","type":"post","link":"https:\/\/lollypop.design\/blog\/2026\/june\/typography-la-gi\/","title":{"rendered":"Typography l\u00e0 g\u00ec? Nguy\u00ean t\u1eafc, Ph\u00e2n lo\u1ea1i &#038; \u1ee8ng d\u1ee5ng Trong Thi\u1ebft K\u1ebf"},"content":{"rendered":"<p>B\u1ea1n c\u00f3 th\u1ec3 \u0111\u1ecdc m\u1ed9t b\u00e0i b\u00e1o d\u00e0i 2.000 t\u1eeb m\u00e0 kh\u00f4ng c\u1ea3m th\u1ea5y m\u1ec7t. Nh\u01b0ng c\u0169ng c\u00f3 th\u1ec3 b\u1ecf cu\u1ed9c ch\u1ec9 sau v\u00e0i d\u00f2ng d\u00f9 n\u1ed9i dung ho\u00e0n to\u00e0n gi\u1ed1ng nhau.<\/p>\n<p>S\u1ef1 kh\u00e1c bi\u1ec7t th\u01b0\u1eddng kh\u00f4ng n\u1eb1m \u1edf n\u1ed9i dung. N\u00f3 n\u1eb1m \u1edf c\u00e1ch n\u1ed9i dung \u0111\u01b0\u1ee3c tr\u00ecnh b\u00e0y.<\/p>\n<p>Kho\u1ea3ng c\u00e1ch gi\u1eefa c\u00e1c d\u00f2ng, k\u00edch th\u01b0\u1edbc ti\u00eau \u0111\u1ec1, \u0111\u1ed9 t\u01b0\u01a1ng ph\u1ea3n gi\u1eefa c\u00e1c \u0111o\u1ea1n v\u0103n, hay \u0111\u01a1n gi\u1ea3n l\u00e0 l\u1ef1a ch\u1ecdn font ch\u1eef ph\u00f9 h\u1ee3p c\u00f3 th\u1ec3 quy\u1ebft \u0111\u1ecbnh ng\u01b0\u1eddi d\u00f9ng ti\u1ebfp t\u1ee5c \u0111\u1ecdc hay r\u1eddi \u0111i. \u0110\u00e2y ch\u00ednh l\u00e0 vai tr\u00f2 c\u1ee7a typography, m\u1ed9t trong nh\u1eefng y\u1ebfu t\u1ed1 \u1ea3nh h\u01b0\u1edfng m\u1ea1nh m\u1ebd nh\u1ea5t \u0111\u1ebfn tr\u1ea3i nghi\u1ec7m ng\u01b0\u1eddi d\u00f9ng nh\u01b0ng l\u1ea1i th\u01b0\u1eddng b\u1ecb \u0111\u00e1nh gi\u00e1 th\u1ea5p trong qu\u00e1 tr\u00ecnh thi\u1ebft k\u1ebf.<\/p>\n<p>Trong b\u00e0i vi\u1ebft n\u00e0y, ch\u00fang ta s\u1ebd kh\u00e1m ph\u00e1 <a href=\"https:\/\/lollypop.design\/blog\/2026\/june\/typography-la-gi\/\"><strong>typography l\u00e0 g\u00ec<\/strong><\/a>, c\u00e1ch n\u00f3 ph\u00e1t tri\u1ec3n t\u1eeb ng\u00e0nh in \u1ea5n \u0111\u1ebfn k\u1ef7 nguy\u00ean s\u1ed1, nh\u1eefng nguy\u00ean t\u1eafc c\u1ed1t l\u00f5i m\u00e0 m\u1ecdi designer c\u1ea7n hi\u1ec3u, v\u00e0 c\u00e1ch s\u1eed d\u1ee5ng typography \u0111\u1ec3 t\u1ea1o ra nh\u1eefng tr\u1ea3i nghi\u1ec7m tr\u1ef1c quan, d\u1ec5 \u0111\u1ecdc v\u00e0 hi\u1ec7u qu\u1ea3 h\u01a1n.<\/p>\n<h2><strong>T\u00f3m t\u1eaft n\u1ed9i dung ch\u00ednh<\/strong><\/h2>\n<ul>\n<li>Typography l\u00e0 ngh\u1ec7 thu\u1eadt v\u00e0 k\u1ef9 thu\u1eadt s\u1eafp x\u1ebfp ch\u1eef \u0111\u1ec3 n\u1ed9i dung d\u1ec5 \u0111\u1ecdc, d\u1ec5 hi\u1ec3u v\u00e0 c\u00f3 t\u00ednh th\u1ea9m m\u1ef9 cao h\u01a1n.<\/li>\n<li>Typography kh\u00f4ng ch\u1ec9 l\u00e0 ch\u1ecdn font ch\u1eef m\u00e0 c\u00f2n bao g\u1ed3m hierarchy, spacing, alignment v\u00e0 kh\u1ea3 n\u0103ng \u0111\u1ecdc c\u1ee7a n\u1ed9i dung.<\/li>\n<li>Typeface v\u00e0 font kh\u00f4ng ho\u00e0n to\u00e0n gi\u1ed1ng nhau, \u0111\u00e2y l\u00e0 hai kh\u00e1i ni\u1ec7m th\u01b0\u1eddng b\u1ecb nh\u1ea7m l\u1eabn trong thi\u1ebft k\u1ebf.<\/li>\n<li>Serif, Sans-serif, Script v\u00e0 Display l\u00e0 nh\u1eefng nh\u00f3m font ch\u1eef ph\u1ed5 bi\u1ebfn nh\u1ea5t hi\u1ec7n nay.<\/li>\n<li>C\u00e1c nguy\u00ean t\u1eafc nh\u01b0 kerning, leading, hierarchy v\u00e0 font pairing c\u00f3 \u1ea3nh h\u01b0\u1edfng tr\u1ef1c ti\u1ebfp \u0111\u1ebfn tr\u1ea3i nghi\u1ec7m ng\u01b0\u1eddi d\u00f9ng.<\/li>\n<li>Typography l\u00e0 m\u1ed9t trong nh\u1eefng n\u1ec1n t\u1ea3ng quan tr\u1ecdng c\u1ee7a graphic design, branding v\u00e0 UI\/UX design.<\/li>\n<\/ul>\n<h2><strong>Typography L\u00e0 G\u00ec? \u0110\u1ecbnh Ngh\u0129a Chu\u1ea9n V\u00e0 Ngu\u1ed3n G\u1ed1c Thu\u1eadt Ng\u1eef<\/strong><\/h2>\n<p>Typography l\u00e0 ngh\u1ec7 thu\u1eadt v\u00e0 k\u1ef9 thu\u1eadt s\u1eafp x\u1ebfp ch\u1eef \u0111\u1ec3 n\u1ed9i dung tr\u1edf n\u00ean d\u1ec5 \u0111\u1ecdc, d\u1ec5 hi\u1ec3u v\u00e0 h\u1ea5p d\u1eabn h\u01a1n v\u1ec1 m\u1eb7t th\u1ecb gi\u00e1c. Typography kh\u00f4ng ch\u1ec9 li\u00ean quan \u0111\u1ebfn vi\u1ec7c ch\u1ecdn font ch\u1eef m\u00e0 c\u00f2n bao g\u1ed3m c\u00e1ch t\u1ed5 ch\u1ee9c, c\u0103n ch\u1ec9nh v\u00e0 tr\u00ecnh b\u00e0y v\u0103n b\u1ea3n \u0111\u1ec3 truy\u1ec1n t\u1ea3i th\u00f4ng \u0111i\u1ec7p hi\u1ec7u qu\u1ea3.<\/p>\n<p>Ng\u00e0y nay, typography \u0111\u01b0\u1ee3c \u1ee9ng d\u1ee5ng r\u1ed9ng r\u00e3i trong thi\u1ebft k\u1ebf \u0111\u1ed3 h\u1ecda, x\u00e2y d\u1ef1ng th\u01b0\u01a1ng hi\u1ec7u, website, \u1ee9ng d\u1ee5ng v\u00e0 h\u1ea7u h\u1ebft c\u00e1c s\u1ea3n ph\u1ea9m truy\u1ec1n th\u00f4ng s\u1ed1.<\/p>\n<h3><strong>Ngu\u1ed3n G\u1ed1c C\u1ee7a Thu\u1eadt Ng\u1eef Typography<\/strong><\/h3>\n<p>Thu\u1eadt ng\u1eef <em>typography<\/em> b\u1eaft ngu\u1ed3n t\u1eeb ti\u1ebfng Hy L\u1ea1p, trong \u0111\u00f3 <em>typos<\/em> c\u00f3 ngh\u0129a l\u00e0 \u201cd\u1ea5u \u1ea5n\u201d ho\u1eb7c \u201ch\u00ecnh th\u1ee9c\u201d, c\u00f2n <em>graphein<\/em> c\u00f3 ngh\u0129a l\u00e0 \u201cvi\u1ebft\u201d.<\/p>\n<p>Ban \u0111\u1ea7u, typography \u0111\u01b0\u1ee3c d\u00f9ng \u0111\u1ec3 m\u00f4 t\u1ea3 k\u1ef9 thu\u1eadt s\u1eafp ch\u1eef trong ng\u00e0nh in \u1ea5n. Khi thi\u1ebft k\u1ebf chuy\u1ec3n d\u1ecbch sang m\u00f4i tr\u01b0\u1eddng s\u1ed1, kh\u00e1i ni\u1ec7m n\u00e0y c\u0169ng m\u1edf r\u1ed9ng v\u00e0 tr\u1edf th\u00e0nh m\u1ed9t ph\u1ea7n quan tr\u1ecdng c\u1ee7a thi\u1ebft k\u1ebf \u0111\u1ed3 h\u1ecda, x\u00e2y d\u1ef1ng th\u01b0\u01a1ng hi\u1ec7u v\u00e0 <strong><a href=\"https:\/\/lollypop.design\/blog\/2024\/january\/ui-ux-design-la-gi-khai-niem-va-quy-trinh-thiet-ke-ux-ui-linh-hoat\/\">thi\u1ebft k\u1ebf UI\/UX<\/a><\/strong>.<\/p>\n<h3><strong>Typography D\u00f9ng \u0110\u1ec3 L\u00e0m G\u00ec?<\/strong><\/h3>\n<p>Typography gi\u00fap n\u1ed9i dung kh\u00f4ng ch\u1ec9 d\u1ec5 \u0111\u1ecdc m\u00e0 c\u00f2n d\u1ec5 hi\u1ec3u v\u00e0 d\u1ec5 ghi nh\u1edb h\u01a1n. Trong thi\u1ebft k\u1ebf, typography th\u01b0\u1eddng \u0111\u01b0\u1ee3c s\u1eed d\u1ee5ng \u0111\u1ec3:<\/p>\n<ul>\n<li><strong>T\u1ed5 ch\u1ee9c th\u00f4ng tin<\/strong> theo m\u1ee9c \u0111\u1ed9 \u01b0u ti\u00ean, gi\u00fap ng\u01b0\u1eddi \u0111\u1ecdc bi\u1ebft \u0111\u00e2u l\u00e0 n\u1ed9i dung quan tr\u1ecdng nh\u1ea5t.<\/li>\n<li><strong>C\u1ea3i thi\u1ec7n kh\u1ea3 n\u0103ng \u0111\u1ecdc (readability)<\/strong> th\u00f4ng qua vi\u1ec7c t\u1ed1i \u01b0u k\u00edch th\u01b0\u1edbc ch\u1eef, kho\u1ea3ng c\u00e1ch v\u00e0 b\u1ed1 c\u1ee5c.<\/li>\n<li><strong>D\u1eabn d\u1eaft s\u1ef1 ch\u00fa \u00fd<\/strong> \u0111\u1ebfn c\u00e1c ti\u00eau \u0111\u1ec1, CTA ho\u1eb7c th\u00f4ng \u0111i\u1ec7p ch\u00ednh.<\/li>\n<li><strong>Truy\u1ec1n t\u1ea3i c\u00e1 t\u00ednh th\u01b0\u01a1ng hi\u1ec7u<\/strong> th\u00f4ng qua phong c\u00e1ch ch\u1eef v\u00e0 c\u00e1ch tr\u00ecnh b\u00e0y n\u1ed9i dung.<\/li>\n<li><strong>T\u1ea1o tr\u1ea3i nghi\u1ec7m th\u1ecb gi\u00e1c nh\u1ea5t qu\u00e1n<\/strong> tr\u00ean website, \u1ee9ng d\u1ee5ng, \u1ea5n ph\u1ea9m marketing v\u00e0 c\u00e1c s\u1ea3n ph\u1ea9m thi\u1ebft k\u1ebf kh\u00e1c.<\/li>\n<\/ul>\n<h2><strong>Ph\u00e2n Lo\u1ea1i Typeface: 5 Nh\u00f3m Ch\u1eef C\u01a1 B\u1ea3n Designer C\u1ea7n Bi\u1ebft<\/strong><\/h2>\n<p>Kh\u00f4ng ph\u1ea3i t\u1ea5t c\u1ea3 c\u00e1c ki\u1ec3u ch\u1eef \u0111\u1ec1u \u0111\u01b0\u1ee3c t\u1ea1o ra cho c\u00f9ng m\u1ed9t m\u1ee5c \u0111\u00edch. M\u1ed7i typeface s\u1edf h\u1eefu nh\u1eefng \u0111\u1eb7c \u0111i\u1ec3m th\u1ecb gi\u00e1c ri\u00eang, t\u1eeb \u0111\u00f3 t\u1ea1o n\u00ean nh\u1eefng c\u1ea3m x\u00fac v\u00e0 tr\u1ea3i nghi\u1ec7m kh\u00e1c nhau cho ng\u01b0\u1eddi \u0111\u1ecdc.<\/p>\n<p>Vi\u1ec7c hi\u1ec3u c\u00e1c nh\u00f3m typeface c\u01a1 b\u1ea3n s\u1ebd gi\u00fap designer l\u1ef1a ch\u1ecdn ki\u1ec3u ch\u1eef ph\u00f9 h\u1ee3p v\u1edbi th\u01b0\u01a1ng hi\u1ec7u, n\u1ed9i dung v\u00e0 \u0111\u1ed1i t\u01b0\u1ee3ng ng\u01b0\u1eddi d\u00f9ng, thay v\u00ec ch\u1ec9 ch\u1ecdn font d\u1ef1a tr\u00ean c\u1ea3m t\u00ednh.<\/p>\n<h3><strong>1. Serif<\/strong><\/h3>\n<p><img decoding=\"async\" class=\"aligncenter\" src=\"https:\/\/storage.googleapis.com\/websiteasset\/uploads\/bc252b35-serif.webp\" alt=\"serif\" width=\"1440\" height=\"682\" style=\"aspect-ratio:1440\/682;\"><\/p>\n<p>Serif l\u00e0 nh\u00f3m typeface c\u00f3 c\u00e1c n\u00e9t g\u1ea1ch nh\u1ecf \u1edf \u0111\u1ea7u ho\u1eb7c cu\u1ed1i k\u00fd t\u1ef1. \u0110\u00e2y l\u00e0 m\u1ed9t trong nh\u1eefng nh\u00f3m ch\u1eef l\u00e2u \u0111\u1eddi nh\u1ea5t, g\u1eafn li\u1ec1n v\u1edbi l\u1ecbch s\u1eed in \u1ea5n v\u00e0 xu\u1ea5t b\u1ea3n truy\u1ec1n th\u1ed1ng.<\/p>\n<p>Nh\u1edd c\u1ea5u tr\u00fac \u0111\u1eb7c tr\u01b0ng n\u00e0y, Serif th\u01b0\u1eddng mang l\u1ea1i c\u1ea3m gi\u00e1c trang tr\u1ecdng, \u0111\u00e1ng tin c\u1eady v\u00e0 chuy\u00ean nghi\u1ec7p. Nhi\u1ec1u t\u1ed5 ch\u1ee9c gi\u00e1o d\u1ee5c, doanh nghi\u1ec7p l\u00e2u \u0111\u1eddi v\u00e0 th\u01b0\u01a1ng hi\u1ec7u cao c\u1ea5p s\u1eed d\u1ee5ng Serif \u0111\u1ec3 x\u00e2y d\u1ef1ng h\u00ecnh \u1ea3nh uy t\u00edn v\u00e0 b\u1ec1n v\u1eefng.<\/p>\n<p>Trong th\u1ef1c t\u1ebf, Serif th\u01b0\u1eddng xu\u1ea5t hi\u1ec7n trong s\u00e1ch, b\u00e1o, t\u1ea1p ch\u00ed v\u00e0 c\u00e1c t\u00e0i li\u1ec7u c\u00f3 l\u01b0\u1ee3ng n\u1ed9i dung l\u1edbn nh\u1edd kh\u1ea3 n\u0103ng h\u1ed7 tr\u1ee3 vi\u1ec7c \u0111\u1ecdc trong th\u1eddi gian d\u00e0i.<\/p>\n<h3><strong>2. Sans-Serif<\/strong><\/h3>\n<p><img decoding=\"async\" class=\"aligncenter\" src=\"https:\/\/storage.googleapis.com\/websiteasset\/uploads\/f01c7e2c-sans-serif.webp\" alt=\"sans-serif\" width=\"1440\" height=\"682\" style=\"aspect-ratio:1440\/682;\"><br>\nSans-serif l\u00e0 nh\u00f3m ch\u1eef kh\u00f4ng c\u00f3 c\u00e1c n\u00e9t g\u1ea1ch trang tr\u00ed \u1edf \u0111\u1ea7u ho\u1eb7c cu\u1ed1i k\u00fd t\u1ef1. T\u00ean g\u1ecdi \u201csans\u201d trong ti\u1ebfng Ph\u00e1p c\u00f3 ngh\u0129a l\u00e0 \u201ckh\u00f4ng c\u00f3\u201d, v\u00ec v\u1eady Sans-serif c\u00f3 th\u1ec3 hi\u1ec3u \u0111\u01a1n gi\u1ea3n l\u00e0 nh\u00f3m ch\u1eef kh\u00f4ng ch\u00e2n.<\/p>\n<p>So v\u1edbi Serif, Sans-serif mang l\u1ea1i c\u1ea3m gi\u00e1c hi\u1ec7n \u0111\u1ea1i, t\u1ed1i gi\u1ea3n v\u00e0 th\u00e2n thi\u1ec7n h\u01a1n. C\u00e1c k\u00fd t\u1ef1 th\u01b0\u1eddng c\u00f3 h\u00ecnh d\u00e1ng g\u1ecdn g\u00e0ng, r\u00f5 r\u00e0ng v\u00e0 d\u1ec5 hi\u1ec3n th\u1ecb tr\u00ean m\u00e0n h\u00ecnh k\u1ef9 thu\u1eadt s\u1ed1.<\/p>\n<p>\u0110\u00e2y l\u00e0 nh\u00f3m typeface \u0111\u01b0\u1ee3c s\u1eed d\u1ee5ng r\u1ed9ng r\u00e3i trong thi\u1ebft k\u1ebf website, \u1ee9ng d\u1ee5ng v\u00e0 s\u1ea3n ph\u1ea9m c\u00f4ng ngh\u1ec7. Nhi\u1ec1u th\u01b0\u01a1ng hi\u1ec7u hi\u1ec7n \u0111\u1ea1i l\u1ef1a ch\u1ecdn Sans-serif \u0111\u1ec3 th\u1ec3 hi\u1ec7n s\u1ef1 \u0111\u1ed5i m\u1edbi, linh ho\u1ea1t v\u00e0 d\u1ec5 ti\u1ebfp c\u1eadn.<\/p>\n<h3><strong>3. Slab Serif<\/strong><\/h3>\n<p><img decoding=\"async\" class=\"aligncenter\" src=\"https:\/\/storage.googleapis.com\/websiteasset\/uploads\/594aa671-slab-serif.webp\" alt=\"slab-serif\" width=\"1440\" height=\"682\" style=\"aspect-ratio:1440\/682;\"><br>\nSlab Serif l\u00e0 m\u1ed9t bi\u1ebfn th\u1ec3 c\u1ee7a Serif nh\u01b0ng c\u00f3 ph\u1ea7n ch\u00e2n ch\u1eef d\u00e0y v\u00e0 vu\u00f4ng v\u1ee9c h\u01a1n. Nh\u1edd nh\u1eefng \u0111\u01b0\u1eddng n\u00e9t m\u1ea1nh m\u1ebd n\u00e0y, Slab Serif t\u1ea1o c\u1ea3m gi\u00e1c ch\u1eafc ch\u1eafn, t\u1ef1 tin v\u00e0 c\u00f3 s\u1ee9c n\u1eb7ng th\u1ecb gi\u00e1c cao h\u01a1n so v\u1edbi Serif truy\u1ec1n th\u1ed1ng.<\/p>\n<p>Lo\u1ea1i ch\u1eef n\u00e0y th\u01b0\u1eddng \u0111\u01b0\u1ee3c s\u1eed d\u1ee5ng cho ti\u00eau \u0111\u1ec1, poster ho\u1eb7c c\u00e1c thi\u1ebft k\u1ebf c\u1ea7n t\u1ea1o \u0111i\u1ec3m nh\u1ea5n m\u1ea1nh. Trong m\u1ed9t s\u1ed1 tr\u01b0\u1eddng h\u1ee3p, Slab Serif c\u00f2n gi\u00fap th\u01b0\u01a1ng hi\u1ec7u th\u1ec3 hi\u1ec7n s\u1ef1 b\u1ec1n b\u1ec9, \u0111\u00e1ng tin c\u1eady v\u00e0 c\u00e1 t\u00ednh.<\/p>\n<p>S\u1ef1 k\u1ebft h\u1ee3p gi\u1eefa t\u00ednh truy\u1ec1n th\u1ed1ng c\u1ee7a Serif v\u00e0 v\u1ebb m\u1ea1nh m\u1ebd c\u1ee7a c\u00e1c h\u00ecnh kh\u1ed1i hi\u1ec7n \u0111\u1ea1i khi\u1ebfn Slab Serif tr\u1edf th\u00e0nh l\u1ef1a ch\u1ecdn ph\u1ed5 bi\u1ebfn trong branding v\u00e0 qu\u1ea3ng c\u00e1o.<\/p>\n<h3><strong>4. Script<\/strong><\/h3>\n<p><img decoding=\"async\" class=\"aligncenter\" src=\"https:\/\/storage.googleapis.com\/websiteasset\/uploads\/c273f7ff-script.webp\" alt=\"script\" width=\"1440\" height=\"682\" style=\"aspect-ratio:1440\/682;\"><br>\nScript l\u00e0 nh\u00f3m typeface l\u1ea5y c\u1ea3m h\u1ee9ng t\u1eeb ch\u1eef vi\u1ebft tay ho\u1eb7c th\u01b0 ph\u00e1p. C\u00e1c k\u00fd t\u1ef1 th\u01b0\u1eddng c\u00f3 n\u00e9t m\u1ec1m m\u1ea1i, uy\u1ec3n chuy\u1ec3n v\u00e0 mang t\u00ednh c\u00e1 nh\u00e2n cao.<\/p>\n<p>Kh\u00e1c v\u1edbi c\u00e1c nh\u00f3m ch\u1eef \u0111\u01b0\u1ee3c thi\u1ebft k\u1ebf \u0111\u1ec3 t\u1ed1i \u01b0u kh\u1ea3 n\u0103ng \u0111\u1ecdc, Script t\u1eadp trung nhi\u1ec1u h\u01a1n v\u00e0o c\u1ea3m x\u00fac v\u00e0 phong c\u00e1ch. T\u00f9y v\u00e0o thi\u1ebft k\u1ebf c\u1ee5 th\u1ec3, Script c\u00f3 th\u1ec3 truy\u1ec1n t\u1ea3i s\u1ef1 sang tr\u1ecdng, l\u00e3ng m\u1ea1n, ngh\u1ec7 thu\u1eadt ho\u1eb7c th\u1ee7 c\u00f4ng.<\/p>\n<p>Tuy nhi\u00ean, v\u00ec \u0111\u1ed9 ph\u1ee9c t\u1ea1p c\u1ee7a c\u00e1c k\u00fd t\u1ef1 kh\u00e1 cao n\u00ean Script th\u01b0\u1eddng ch\u1ec9 ph\u00f9 h\u1ee3p v\u1edbi logo, ti\u00eau \u0111\u1ec1 ho\u1eb7c nh\u1eefng \u0111o\u1ea1n n\u1ed9i dung ng\u1eafn. N\u1ebfu s\u1eed d\u1ee5ng cho c\u00e1c \u0111o\u1ea1n v\u0103n d\u00e0i, kh\u1ea3 n\u0103ng \u0111\u1ecdc c\u00f3 th\u1ec3 b\u1ecb \u1ea3nh h\u01b0\u1edfng \u0111\u00e1ng k\u1ec3.<\/p>\n<h3><strong>5. Monospace<\/strong><\/h3>\n<p><img decoding=\"async\" class=\"aligncenter\" src=\"https:\/\/storage.googleapis.com\/websiteasset\/uploads\/639c124b-monospace.webp\" alt=\"monospace\" width=\"1440\" height=\"682\" style=\"aspect-ratio:1440\/682;\"><br>\nMonospace l\u00e0 nh\u00f3m typeface m\u00e0 m\u1ecdi k\u00fd t\u1ef1 \u0111\u1ec1u c\u00f3 c\u00f9ng \u0111\u1ed9 r\u1ed9ng. \u0110i\u1ec1u n\u00e0y c\u00f3 ngh\u0129a l\u00e0 ch\u1eef \u201ci\u201d v\u00e0 ch\u1eef \u201cw\u201d s\u1ebd chi\u1ebfm c\u00f9ng m\u1ed9t kho\u1ea3ng kh\u00f4ng gian, kh\u00e1c v\u1edbi h\u1ea7u h\u1ebft c\u00e1c ki\u1ec3u ch\u1eef th\u00f4ng th\u01b0\u1eddng.<\/p>\n<p>Nh\u1edd \u0111\u1eb7c \u0111i\u1ec3m n\u00e0y, Monospace t\u1ea1o c\u1ea3m gi\u00e1c k\u1ef9 thu\u1eadt, ch\u00ednh x\u00e1c v\u00e0 c\u00f3 ph\u1ea7n g\u1ee3i nh\u1edb \u0111\u1ebfn c\u00e1c m\u00e1y \u0111\u00e1nh ch\u1eef ho\u1eb7c m\u00e0n h\u00ecnh l\u1eadp tr\u00ecnh c\u1ed5 \u0111i\u1ec3n.<\/p>\n<p>Ng\u00e0y nay, Monospace \u0111\u01b0\u1ee3c s\u1eed d\u1ee5ng ph\u1ed5 bi\u1ebfn trong m\u00f4i tr\u01b0\u1eddng c\u00f4ng ngh\u1ec7, l\u1eadp tr\u00ecnh v\u00e0 c\u00e1c giao di\u1ec7n c\u1ea7n hi\u1ec3n th\u1ecb d\u1eef li\u1ec7u c\u00f3 c\u1ea5u tr\u00fac. D\u00f9 kh\u00f4ng ph\u1ea3i l\u00e0 l\u1ef1a ch\u1ecdn l\u00fd t\u01b0\u1edfng cho n\u1ed9i dung d\u00e0i, \u0111\u00e2y v\u1eabn l\u00e0 nh\u00f3m ch\u1eef quan tr\u1ecdng trong thi\u1ebft k\u1ebf s\u1ea3n ph\u1ea9m s\u1ed1.<\/p>\n<h2><strong>Anatomy of Typography: C\u00e1c Th\u00e0nh Ph\u1ea7n C\u1ea5u T\u1ea1o C\u1ee7a Ch\u1eef<\/strong><\/h2>\n<p>\u0110\u1ec3 s\u1eed d\u1ee5ng typography hi\u1ec7u qu\u1ea3, designer kh\u00f4ng ch\u1ec9 c\u1ea7n bi\u1ebft l\u1ef1a ch\u1ecdn typeface ph\u00f9 h\u1ee3p m\u00e0 c\u00f2n c\u1ea7n hi\u1ec3u c\u1ea5u tr\u00fac b\u00ean trong c\u1ee7a t\u1eebng k\u00fd t\u1ef1. Nh\u1eefng th\u00e0nh ph\u1ea7n n\u00e0y \u0111\u01b0\u1ee3c g\u1ecdi l\u00e0 <strong>typography anatomy<\/strong> (c\u1ea5u tr\u00fac ch\u1eef) ho\u1eb7c <strong>letterform anatomy<\/strong> (c\u1ea5u tr\u00fac k\u00fd t\u1ef1).<\/p>\n<p>Vi\u1ec7c hi\u1ec3u anatomy c\u1ee7a ch\u1eef gi\u00fap designer \u0111\u00e1nh gi\u00e1 kh\u1ea3 n\u0103ng \u0111\u1ecdc, nh\u1eadn di\u1ec7n \u0111\u1eb7c \u0111i\u1ec3m c\u1ee7a t\u1eebng typeface v\u00e0 \u0111\u01b0a ra quy\u1ebft \u0111\u1ecbnh thi\u1ebft k\u1ebf ph\u00f9 h\u1ee3p h\u01a1n trong t\u1eebng ng\u1eef c\u1ea3nh s\u1eed d\u1ee5ng.<br>\n<img decoding=\"async\" class=\"aligncenter\" src=\"https:\/\/storage.googleapis.com\/websiteasset\/uploads\/73fc9036-cac-thanh-phan-cau-tao-cua-chu.webp\" alt=\"C\u00e1c Th\u00e0nh Ph\u1ea7n C\u1ea5u T\u1ea1o C\u1ee7a Ch\u1eef\" width=\"1440\" height=\"590\" style=\"aspect-ratio:1440\/590;\"><\/p>\n<h3><strong>1. X-Height<\/strong><\/h3>\n<p>X-height th\u1ec3 hi\u1ec7n chi\u1ec1u cao ph\u1ea7n th\u00e2n ch\u00ednh c\u1ee7a ch\u1eef th\u01b0\u1eddng. \u0110\u00e2y l\u00e0 m\u1ed9t trong nh\u1eefng y\u1ebfu t\u1ed1 \u1ea3nh h\u01b0\u1edfng m\u1ea1nh nh\u1ea5t \u0111\u1ebfn kh\u1ea3 n\u0103ng \u0111\u1ecdc. Nh\u1eefng typeface c\u00f3 x-height l\u1edbn th\u01b0\u1eddng hi\u1ec3n th\u1ecb r\u00f5 r\u00e0ng h\u01a1n \u1edf k\u00edch th\u01b0\u1edbc nh\u1ecf, trong khi x-height th\u1ea5p th\u01b0\u1eddng mang l\u1ea1i c\u1ea3m gi\u00e1c thanh l\u1ecbch v\u00e0 c\u1ed5 \u0111i\u1ec3n h\u01a1n.<\/p>\n<h3><strong>2. Cap Height<\/strong><\/h3>\n<p>Cap Height l\u00e0 chi\u1ec1u cao c\u1ee7a c\u00e1c k\u00fd t\u1ef1 in hoa, \u0111\u01b0\u1ee3c \u0111o t\u1eeb baseline \u0111\u1ebfn \u0111\u1ec9nh k\u00fd t\u1ef1. Th\u00f4ng s\u1ed1 n\u00e0y \u1ea3nh h\u01b0\u1edfng \u0111\u1ebfn c\u1ea3m nh\u1eadn th\u1ecb gi\u00e1c v\u1ec1 k\u00edch th\u01b0\u1edbc c\u1ee7a typeface. Hai font c\u00f3 c\u00f9ng c\u1ee1 ch\u1eef nh\u01b0ng cap height kh\u00e1c nhau v\u1eabn c\u00f3 th\u1ec3 t\u1ea1o c\u1ea3m gi\u00e1c l\u1edbn ho\u1eb7c nh\u1ecf h\u01a1n khi hi\u1ec3n th\u1ecb tr\u00ean m\u00e0n h\u00ecnh.<\/p>\n<h3><strong>3. Arm<\/strong><\/h3>\n<p>Arm l\u00e0 ph\u1ea7n n\u00e9t v\u01b0\u01a1n ra kh\u1ecfi th\u00e2n ch\u00ednh c\u1ee7a k\u00fd t\u1ef1 nh\u01b0ng kh\u00f4ng k\u1ebft n\u1ed1i v\u1edbi m\u1ed9t n\u00e9t kh\u00e1c. Trong h\u00ecnh minh h\u1ecda, ph\u1ea7n \u0111\u1ea7u c\u1ee7a ch\u1eef T l\u00e0 v\u00ed d\u1ee5 d\u1ec5 nh\u1eadn bi\u1ebft nh\u1ea5t c\u1ee7a arm. D\u00f9 kh\u00e1 nh\u1ecf, chi ti\u1ebft n\u00e0y g\u00f3p ph\u1ea7n t\u1ea1o n\u00ean h\u00ecnh d\u00e1ng v\u00e0 t\u1ef7 l\u1ec7 \u0111\u1eb7c tr\u01b0ng c\u1ee7a t\u1eebng typeface.<\/p>\n<h3><strong>4. Stem<\/strong><\/h3>\n<p>Stem l\u00e0 n\u00e9t ch\u00ednh t\u1ea1o n\u00ean c\u1ea5u tr\u00fac c\u1ee7a k\u00fd t\u1ef1 v\u00e0 th\u01b0\u1eddng \u0111\u01b0\u1ee3c xem l\u00e0 \u201ckhung x\u01b0\u01a1ng\u201d c\u1ee7a m\u1ed9t ki\u1ec3u ch\u1eef. \u0110\u1ed9 d\u00e0y c\u1ee7a stem \u1ea3nh h\u01b0\u1edfng tr\u1ef1c ti\u1ebfp \u0111\u1ebfn \u0111\u1ed9 \u0111\u1eadm nh\u1ea1t c\u1ee7a typeface. Khi stem thay \u0111\u1ed5i, c\u1ea3m gi\u00e1c v\u1ec1 s\u1ef1 m\u1ea1nh m\u1ebd, thanh tho\u00e1t ho\u1eb7c hi\u1ec7n \u0111\u1ea1i c\u1ee7a ki\u1ec3u ch\u1eef c\u0169ng thay \u0111\u1ed5i theo.<\/p>\n<h3><strong>5. Stroke<\/strong><\/h3>\n<p>Stroke l\u00e0 c\u00e1c n\u00e9t t\u1ea1o n\u00ean h\u00ecnh d\u1ea1ng ho\u00e0n ch\u1ec9nh c\u1ee7a k\u00fd t\u1ef1. C\u00e1ch x\u1eed l\u00fd stroke, t\u1eeb \u0111\u1ed9 d\u00e0y, \u0111\u1ed9 cong cho \u0111\u1ebfn \u0111\u1ed9 t\u01b0\u01a1ng ph\u1ea3n gi\u1eefa c\u00e1c n\u00e9t, l\u00e0 m\u1ed9t trong nh\u1eefng y\u1ebfu t\u1ed1 t\u1ea1o n\u00ean c\u00e1 t\u00ednh ri\u00eang c\u1ee7a m\u1ed7i typeface.<\/p>\n<h3><strong>6. Counter<\/strong><\/h3>\n<p>Counter l\u00e0 ph\u1ea7n kho\u1ea3ng tr\u1ed1ng n\u1eb1m b\u00ean trong k\u00fd t\u1ef1. M\u1eb7c d\u00f9 l\u00e0 kh\u00f4ng gian \u00e2m (negative space), counter l\u1ea1i \u1ea3nh h\u01b0\u1edfng tr\u1ef1c ti\u1ebfp \u0111\u1ebfn kh\u1ea3 n\u0103ng \u0111\u1ecdc c\u1ee7a typeface. Counter c\u00e0ng r\u00f5 r\u00e0ng, k\u00fd t\u1ef1 th\u01b0\u1eddng c\u00e0ng d\u1ec5 nh\u1eadn di\u1ec7n \u1edf nhi\u1ec1u k\u00edch th\u01b0\u1edbc kh\u00e1c nhau.<\/p>\n<h3><strong>7. Leg<\/strong><\/h3>\n<p>Leg l\u00e0 n\u00e9t k\u00e9o xu\u1ed1ng theo h\u01b0\u1edbng ch\u00e9o t\u1eeb th\u00e2n ch\u00ednh c\u1ee7a k\u00fd t\u1ef1. So v\u1edbi stem, leg th\u01b0\u1eddng t\u1ea1o c\u1ea3m gi\u00e1c chuy\u1ec3n \u0111\u1ed9ng v\u00e0 gi\u00fap k\u00fd t\u1ef1 tr\u1edf n\u00ean linh ho\u1ea1t h\u01a1n v\u1ec1 m\u1eb7t h\u00ecnh d\u00e1ng. \u0110\u00e2y c\u0169ng l\u00e0 m\u1ed9t trong nh\u1eefng chi ti\u1ebft t\u1ea1o n\u00ean s\u1ef1 kh\u00e1c bi\u1ec7t gi\u1eefa c\u00e1c typeface.<\/p>\n<h3><strong>8. Serif<\/strong><\/h3>\n<p>Serif l\u00e0 nh\u1eefng chi ti\u1ebft nh\u1ecf xu\u1ea5t hi\u1ec7n \u1edf \u0111\u1ea7u ho\u1eb7c cu\u1ed1i n\u00e9t ch\u1eef. \u0110\u00e2y l\u00e0 \u0111\u1eb7c \u0111i\u1ec3m nh\u1eadn di\u1ec7n n\u1ed5i b\u1eadt nh\u1ea5t c\u1ee7a nh\u00f3m ch\u1eef Serif. Trong th\u1ef1c t\u1ebf, serif kh\u00f4ng ch\u1ec9 \u1ea3nh h\u01b0\u1edfng \u0111\u1ebfn phong c\u00e1ch th\u1ecb gi\u00e1c m\u00e0 c\u00f2n g\u00f3p ph\u1ea7n t\u1ea1o n\u00ean c\u1ea3m gi\u00e1c trang tr\u1ecdng, truy\u1ec1n th\u1ed1ng ho\u1eb7c chuy\u00ean nghi\u1ec7p cho ki\u1ec3u ch\u1eef.<\/p>\n<h3><strong>9. Bowl<\/strong><\/h3>\n<p>Bowl l\u00e0 ph\u1ea7n n\u00e9t cong bao quanh kho\u1ea3ng tr\u1ed1ng b\u00ean trong k\u00fd t\u1ef1. \u0110\u00e2y l\u00e0 th\u00e0nh ph\u1ea7n xu\u1ea5t hi\u1ec7n trong nhi\u1ec1u ch\u1eef c\u00e1i v\u00e0 c\u00f3 \u1ea3nh h\u01b0\u1edfng l\u1edbn \u0111\u1ebfn c\u1ea3m gi\u00e1c th\u1ecb gi\u00e1c c\u0169ng nh\u01b0 kh\u1ea3 n\u0103ng nh\u1eadn di\u1ec7n c\u1ee7a typeface. Bowl c\u00e0ng r\u1ed9ng, k\u00fd t\u1ef1 th\u01b0\u1eddng c\u00e0ng tho\u00e1ng v\u00e0 d\u1ec5 \u0111\u1ecdc h\u01a1n.<\/p>\n<h3><strong>10. Terminal<\/strong><\/h3>\n<p>Terminal l\u00e0 \u0111i\u1ec3m k\u1ebft th\u00fac c\u1ee7a m\u1ed9t n\u00e9t ch\u1eef khi kh\u00f4ng c\u00f3 serif \u0111i k\u00e8m. H\u00ecnh d\u1ea1ng c\u1ee7a terminal c\u00f3 th\u1ec3 tr\u00f2n, vu\u00f4ng, nh\u1ecdn ho\u1eb7c bo cong. \u0110\u00e2y l\u00e0 m\u1ed9t chi ti\u1ebft nh\u1ecf nh\u01b0ng th\u01b0\u1eddng \u0111\u01b0\u1ee3c c\u00e1c type designer s\u1eed d\u1ee5ng \u0111\u1ec3 t\u1ea1o n\u00ean c\u00e1 t\u00ednh ri\u00eang cho m\u1ed9t typeface.<\/p>\n<h3><strong>11. Ascender v\u00e0 Descender\u00a0<\/strong><\/h3>\n<p>Ascender l\u00e0 ph\u1ea7n k\u00fd t\u1ef1 v\u01b0\u01a1n l\u00ean ph\u00eda tr\u00ean th\u00e2n ch\u1eef th\u01b0\u1eddng, c\u00f2n Descender l\u00e0 ph\u1ea7n k\u00e9o d\u00e0i xu\u1ed1ng d\u01b0\u1edbi d\u00f2ng ch\u1eef. Hai th\u00e0nh ph\u1ea7n n\u00e0y t\u1ea1o n\u00ean nh\u1ecbp \u0111i\u1ec7u v\u00e0 \u0111\u1eb7c tr\u01b0ng th\u1ecb gi\u00e1c c\u1ee7a typography. Ch\u00fang c\u0169ng \u1ea3nh h\u01b0\u1edfng tr\u1ef1c ti\u1ebfp \u0111\u1ebfn kho\u1ea3ng c\u00e1ch d\u00f2ng (leading), \u0111\u1eb7c bi\u1ec7t khi hi\u1ec3n th\u1ecb c\u00e1c \u0111o\u1ea1n v\u0103n d\u00e0i.<\/p>\n<h3><strong>12. Baseline<\/strong><\/h3>\n<p>Baseline l\u00e0 \u0111\u01b0\u1eddng tham chi\u1ebfu m\u00e0 h\u1ea7u h\u1ebft c\u00e1c k\u00fd t\u1ef1 \u0111\u01b0\u1ee3c s\u1eafp x\u1ebfp theo khi t\u1ea1o th\u00e0nh m\u1ed9t d\u00f2ng v\u0103n b\u1ea3n. D\u00f9 kh\u00f4ng nh\u00ecn th\u1ea5y tr\u1ef1c ti\u1ebfp, baseline \u0111\u00f3ng vai tr\u00f2 quan tr\u1ecdng trong vi\u1ec7c c\u0103n ch\u1ec9nh typography v\u00e0 x\u00e2y d\u1ef1ng b\u1ed1 c\u1ee5c nh\u1ea5t qu\u00e1n. Khi nhi\u1ec1u d\u00f2ng ch\u1eef ho\u1eb7c nhi\u1ec1u th\u00e0nh ph\u1ea7n giao di\u1ec7n \u0111\u01b0\u1ee3c \u0111\u1eb7t c\u1ea1nh nhau, baseline gi\u00fap to\u00e0n b\u1ed9 n\u1ed9i dung tr\u00f4ng g\u1ecdn g\u00e0ng v\u00e0 d\u1ec5 \u0111\u1ecdc h\u01a1n.<\/p>\n<h2><strong>C\u00e1c Thu\u1ed9c T\u00ednh Typography Designer C\u1ea7n N\u1eafm V\u1eefng<\/strong><\/h2>\n<p>M\u1ed9t h\u1ec7 th\u1ed1ng typography hi\u1ec7u qu\u1ea3 kh\u00f4ng ch\u1ec9 ph\u1ee5 thu\u1ed9c v\u00e0o typeface m\u00e0 c\u00f2n n\u1eb1m \u1edf c\u00e1ch designer \u0111i\u1ec1u ch\u1ec9nh c\u00e1c thu\u1ed9c t\u00ednh c\u1ee7a ch\u1eef. \u0110\u00e2y l\u00e0 nh\u1eefng y\u1ebfu t\u1ed1 \u1ea3nh h\u01b0\u1edfng tr\u1ef1c ti\u1ebfp \u0111\u1ebfn kh\u1ea3 n\u0103ng \u0111\u1ecdc, th\u1ee9 b\u1eadc th\u00f4ng tin v\u00e0 tr\u1ea3i nghi\u1ec7m th\u1ecb gi\u00e1c c\u1ee7a ng\u01b0\u1eddi d\u00f9ng.<\/p>\n<h3><strong>1. Weight (\u0110\u1ed9 \u0110\u1eadm C\u1ee7a Ch\u1eef)<\/strong><\/h3>\n<p>Weight th\u1ec3 hi\u1ec7n \u0111\u1ed9 d\u00e0y c\u1ee7a n\u00e9t ch\u1eef. M\u1ed9t typeface th\u01b0\u1eddng c\u00f3 nhi\u1ec1u m\u1ee9c weight kh\u00e1c nhau nh\u01b0 Light, Regular, Medium, SemiBold ho\u1eb7c Bold.<\/p>\n<p>Thay v\u00ec s\u1eed d\u1ee5ng qu\u00e1 nhi\u1ec1u font kh\u00e1c nhau, designer th\u01b0\u1eddng t\u1eadn d\u1ee5ng weight \u0111\u1ec3 t\u1ea1o s\u1ef1 ph\u00e2n c\u1ea5p gi\u1eefa ti\u00eau \u0111\u1ec1, ti\u00eau \u0111\u1ec1 ph\u1ee5 v\u00e0 n\u1ed9i dung ch\u00ednh. \u0110i\u1ec1u n\u00e0y gi\u00fap giao di\u1ec7n nh\u1ea5t qu\u00e1n h\u01a1n nh\u01b0ng v\u1eabn \u0111\u1ee7 s\u1ef1 t\u01b0\u01a1ng ph\u1ea3n \u0111\u1ec3 h\u01b0\u1edbng s\u1ef1 ch\u00fa \u00fd c\u1ee7a ng\u01b0\u1eddi d\u00f9ng.<\/p>\n<h3><strong>2. Leading (Kho\u1ea3ng C\u00e1ch D\u00f2ng)<\/strong><\/h3>\n<p>Leading l\u00e0 kho\u1ea3ng c\u00e1ch gi\u1eefa hai d\u00f2ng v\u0103n b\u1ea3n li\u00ean ti\u1ebfp. Kho\u1ea3ng c\u00e1ch d\u00f2ng qu\u00e1 h\u1eb9p c\u00f3 th\u1ec3 khi\u1ebfn n\u1ed9i dung tr\u1edf n\u00ean ng\u1ed9t ng\u1ea1t v\u00e0 kh\u00f3 \u0111\u1ecdc. Ng\u01b0\u1ee3c l\u1ea1i, leading qu\u00e1 r\u1ed9ng s\u1ebd l\u00e0m ng\u01b0\u1eddi \u0111\u1ecdc m\u1ea5t k\u1ebft n\u1ed1i gi\u1eefa c\u00e1c d\u00f2ng v\u00e0 gi\u1ea3m nh\u1ecbp \u0111\u1ecdc t\u1ef1 nhi\u00ean.<\/p>\n<p>\u0110\u1ed1i v\u1edbi c\u00e1c \u0111o\u1ea1n v\u0103n d\u00e0i tr\u00ean website ho\u1eb7c \u1ee9ng d\u1ee5ng, leading th\u01b0\u1eddng l\u00e0 m\u1ed9t trong nh\u1eefng y\u1ebfu t\u1ed1 \u1ea3nh h\u01b0\u1edfng l\u1edbn nh\u1ea5t \u0111\u1ebfn tr\u1ea3i nghi\u1ec7m \u0111\u1ecdc.<\/p>\n<h3><strong>3. Kerning (Kho\u1ea3ng C\u00e1ch Gi\u1eefa Hai K\u00fd T\u1ef1)<\/strong><\/h3>\n<p>Kerning l\u00e0 vi\u1ec7c \u0111i\u1ec1u ch\u1ec9nh kho\u1ea3ng c\u00e1ch gi\u1eefa hai k\u00fd t\u1ef1 c\u1ee5 th\u1ec3 \u0111\u1ec3 t\u1ea1o s\u1ef1 c\u00e2n b\u1eb1ng v\u1ec1 m\u1eb7t th\u1ecb gi\u00e1c.<\/p>\n<p>M\u1ed9t s\u1ed1 c\u1eb7p ch\u1eef nh\u01b0 \u201cAV\u201d, \u201cWA\u201d ho\u1eb7c \u201cTo\u201d th\u01b0\u1eddng t\u1ea1o ra nh\u1eefng kho\u1ea3ng tr\u1ed1ng kh\u00f4ng \u0111\u1ed3ng \u0111\u1ec1u khi \u0111\u1eb7t c\u1ea1nh nhau. Kerning gi\u00fap x\u1eed l\u00fd v\u1ea5n \u0111\u1ec1 n\u00e0y \u0111\u1ec3 t\u1eeb ng\u1eef tr\u00f4ng h\u00e0i h\u00f2a v\u00e0 chuy\u00ean nghi\u1ec7p h\u01a1n. Kerning \u0111\u1eb7c bi\u1ec7t quan tr\u1ecdng trong thi\u1ebft k\u1ebf logo, ti\u00eau \u0111\u1ec1 ho\u1eb7c c\u00e1c s\u1ea3n ph\u1ea9m branding.<\/p>\n<h3><strong>4. Tracking (Kho\u1ea3ng C\u00e1ch Ch\u1eef)<\/strong><\/h3>\n<p>Tracking l\u00e0 vi\u1ec7c \u0111i\u1ec1u ch\u1ec9nh kho\u1ea3ng c\u00e1ch \u0111\u1ed3ng \u0111\u1ec1u gi\u1eefa t\u1ea5t c\u1ea3 c\u00e1c k\u00fd t\u1ef1 trong m\u1ed9t t\u1eeb ho\u1eb7c m\u1ed9t \u0111o\u1ea1n v\u0103n b\u1ea3n. N\u1ebfu kerning t\u00e1c \u0111\u1ed9ng \u0111\u1ebfn t\u1eebng c\u1eb7p ch\u1eef ri\u00eang l\u1ebb th\u00ec tracking \u1ea3nh h\u01b0\u1edfng \u0111\u1ebfn to\u00e0n b\u1ed9 nh\u00f3m k\u00fd t\u1ef1 c\u00f9ng l\u00fac.<\/p>\n<p>Designer th\u01b0\u1eddng t\u0103ng tracking cho ch\u1eef in hoa ho\u1eb7c ti\u00eau \u0111\u1ec1 \u0111\u1ec3 t\u1ea1o c\u1ea3m gi\u00e1c tho\u00e1ng v\u00e0 cao c\u1ea5p h\u01a1n. Ng\u01b0\u1ee3c l\u1ea1i, gi\u1ea3m tracking c\u00f3 th\u1ec3 gi\u00fap ch\u1eef tr\u1edf n\u00ean c\u00f4 \u0111\u1ecdng v\u00e0 m\u1ea1nh m\u1ebd h\u01a1n.<\/p>\n<h3><strong>5. Hierarchy (Th\u1ee9 B\u1eadc Th\u00f4ng Tin)<\/strong><\/h3>\n<p>Hierarchy l\u00e0 c\u00e1ch t\u1ed5 ch\u1ee9c n\u1ed9i dung theo m\u1ee9c \u0111\u1ed9 quan tr\u1ecdng. Th\u00f4ng qua s\u1ef1 kh\u00e1c bi\u1ec7t v\u1ec1 k\u00edch th\u01b0\u1edbc, weight, m\u00e0u s\u1eafc ho\u1eb7c kho\u1ea3ng c\u00e1ch, designer c\u00f3 th\u1ec3 h\u01b0\u1edbng d\u1eabn ng\u01b0\u1eddi d\u00f9ng bi\u1ebft n\u00ean \u0111\u1ecdc n\u1ed9i dung n\u00e0o tr\u01b0\u1edbc v\u00e0 n\u1ed9i dung n\u00e0o sau.<\/p>\n<p>M\u1ed9t h\u1ec7 th\u1ed1ng hierarchy r\u00f5 r\u00e0ng gi\u00fap ng\u01b0\u1eddi d\u00f9ng qu\u00e9t n\u1ed9i dung nhanh h\u01a1n v\u00e0 ti\u1ebfp c\u1eadn th\u00f4ng tin hi\u1ec7u qu\u1ea3 h\u01a1n.<\/p>\n<h3><strong>6. Font Pairing (K\u1ebft H\u1ee3p Font Ch\u1eef)<\/strong><\/h3>\n<p>Font Pairing l\u00e0 ngh\u1ec7 thu\u1eadt k\u1ebft h\u1ee3p nhi\u1ec1u typeface trong c\u00f9ng m\u1ed9t thi\u1ebft k\u1ebf. M\u1ee5c ti\u00eau kh\u00f4ng ph\u1ea3i l\u00e0 s\u1eed d\u1ee5ng th\u1eadt nhi\u1ec1u font m\u00e0 l\u00e0 t\u1ea1o ra s\u1ef1 t\u01b0\u01a1ng ph\u1ea3n v\u1eeba \u0111\u1ee7 trong khi v\u1eabn duy tr\u00ec t\u00ednh nh\u1ea5t qu\u00e1n.<\/p>\n<p>M\u1ed9t c\u00e1ch k\u1ebft h\u1ee3p ph\u1ed5 bi\u1ebfn l\u00e0 s\u1eed d\u1ee5ng Serif cho ti\u00eau \u0111\u1ec1 v\u00e0 Sans-serif cho n\u1ed9i dung, ho\u1eb7c k\u1ebft h\u1ee3p m\u1ed9t Display Typeface v\u1edbi m\u1ed9t Sans-serif trung t\u00ednh \u0111\u1ec3 t\u1ea1o \u0111i\u1ec3m nh\u1ea5n th\u1ecb gi\u00e1c.<\/p>\n<h2><strong>Typography Trong Thi\u1ebft K\u1ebf \u0110\u1ed3 H\u1ecda: Branding, Poster &amp; Editorial<\/strong><\/h2>\n<p>Typography kh\u00f4ng ch\u1ec9 l\u00e0 vi\u1ec7c l\u1ef1a ch\u1ecdn font ch\u1eef \u0111\u1eb9p. Trong th\u1ef1c t\u1ebf, c\u00e1ch typography \u0111\u01b0\u1ee3c s\u1eed d\u1ee5ng s\u1ebd thay \u0111\u1ed5i t\u00f9y theo m\u1ee5c ti\u00eau c\u1ee7a t\u1eebng lo\u1ea1i thi\u1ebft k\u1ebf.<\/p>\n<p>M\u1ed9t h\u1ec7 th\u1ed1ng ch\u1eef cho th\u01b0\u01a1ng hi\u1ec7u c\u1ea7n th\u1ec3 hi\u1ec7n c\u00e1 t\u00ednh v\u00e0 kh\u1ea3 n\u0103ng nh\u1eadn di\u1ec7n l\u00e2u d\u00e0i. Typography tr\u00ean poster c\u1ea7n thu h\u00fat s\u1ef1 ch\u00fa \u00fd ch\u1ec9 trong v\u00e0i gi\u00e2y. Trong khi \u0111\u00f3, typography cho s\u00e1ch, t\u1ea1p ch\u00ed ho\u1eb7c b\u00e0i vi\u1ebft d\u00e0i l\u1ea1i \u01b0u ti\u00ean kh\u1ea3 n\u0103ng \u0111\u1ecdc v\u00e0 tr\u1ea3i nghi\u1ec7m n\u1ed9i dung.<\/p>\n<p>\u0110\u00f3 l\u00e0 l\u00fd do c\u00f9ng m\u1ed9t typeface c\u00f3 th\u1ec3 ho\u1ea1t \u0111\u1ed9ng r\u1ea5t t\u1ed1t trong m\u1ed9t ng\u1eef c\u1ea3nh nh\u01b0ng kh\u00f4ng ph\u00f9 h\u1ee3p \u1edf ng\u1eef c\u1ea3nh kh\u00e1c.<\/p>\n<h3><strong>1. Typography Trong Thi\u1ebft K\u1ebf Th\u01b0\u01a1ng Hi\u1ec7u (Branding)<\/strong><\/h3>\n<p>Typography l\u00e0 m\u1ed9t ph\u1ea7n quan tr\u1ecdng c\u1ee7a h\u1ec7 th\u1ed1ng nh\u1eadn di\u1ec7n th\u01b0\u01a1ng hi\u1ec7u, b\u00ean c\u1ea1nh logo, m\u00e0u s\u1eafc v\u00e0 h\u00ecnh \u1ea3nh.<\/p>\n<p>Nhi\u1ec1u th\u01b0\u01a1ng hi\u1ec7u c\u00f3 th\u1ec3 \u0111\u01b0\u1ee3c nh\u1eadn ra ch\u1ec9 nh\u1edd c\u00e1ch s\u1eed d\u1ee5ng ch\u1eef nh\u1ea5t qu\u00e1n. T\u1eeb logo, website, bao b\u00ec s\u1ea3n ph\u1ea9m cho \u0111\u1ebfn c\u00e1c t\u00e0i li\u1ec7u truy\u1ec1n th\u00f4ng, typography g\u00f3p ph\u1ea7n t\u1ea1o n\u00ean c\u00e1 t\u00ednh ri\u00eang v\u00e0 c\u1ea3m x\u00fac m\u00e0 th\u01b0\u01a1ng hi\u1ec7u mu\u1ed1n truy\u1ec1n t\u1ea3i.<\/p>\n<p>V\u00ed d\u1ee5:<\/p>\n<ul>\n<li>Serif th\u01b0\u1eddng \u0111\u01b0\u1ee3c s\u1eed d\u1ee5ng \u0111\u1ec3 t\u1ea1o c\u1ea3m gi\u00e1c cao c\u1ea5p, truy\u1ec1n th\u1ed1ng ho\u1eb7c \u0111\u00e1ng tin c\u1eady.<\/li>\n<li>Sans-serif mang \u0111\u1ebfn c\u1ea3m gi\u00e1c hi\u1ec7n \u0111\u1ea1i, t\u1ed1i gi\u1ea3n v\u00e0 d\u1ec5 ti\u1ebfp c\u1eadn.<\/li>\n<li>Display Typeface th\u01b0\u1eddng \u0111\u01b0\u1ee3c d\u00f9ng khi th\u01b0\u01a1ng hi\u1ec7u mu\u1ed1n t\u1ea1o d\u1ea5u \u1ea5n th\u1ecb gi\u00e1c m\u1ea1nh m\u1ebd.<\/li>\n<\/ul>\n<h3><strong>2. Typography Trong Thi\u1ebft K\u1ebf Poster<\/strong><\/h3>\n<p>Kh\u00e1c v\u1edbi branding, typography trong poster c\u00f3 nhi\u1ec7m v\u1ee5 thu h\u00fat s\u1ef1 ch\u00fa \u00fd trong th\u1eddi gian r\u1ea5t ng\u1eafn.<\/p>\n<p>Ng\u01b0\u1eddi xem th\u01b0\u1eddng ch\u1ec9 d\u00e0nh v\u00e0i gi\u00e2y \u0111\u1ec3 qu\u00e9t qua m\u1ed9t poster. V\u00ec v\u1eady, typography c\u1ea7n t\u1ea1o ra th\u1ee9 b\u1eadc th\u00f4ng tin r\u00f5 r\u00e0ng \u0111\u1ec3 ng\u01b0\u1eddi xem bi\u1ebft \u0111\u00e2u l\u00e0 ti\u00eau \u0111\u1ec1 ch\u00ednh, \u0111\u00e2u l\u00e0 th\u00f4ng tin h\u1ed7 tr\u1ee3 v\u00e0 \u0111\u00e2u l\u00e0 l\u1eddi k\u00eau g\u1ecdi h\u00e0nh \u0111\u1ed9ng.<\/p>\n<p>Trong thi\u1ebft k\u1ebf poster, designer th\u01b0\u1eddng s\u1eed d\u1ee5ng:<\/p>\n<ul>\n<li>K\u00edch th\u01b0\u1edbc ch\u1eef l\u1edbn \u0111\u1ec3 t\u1ea1o \u0111i\u1ec3m nh\u1ea5n.<\/li>\n<li>T\u01b0\u01a1ng ph\u1ea3n m\u1ea1nh gi\u1eefa ti\u00eau \u0111\u1ec1 v\u00e0 n\u1ed9i dung ph\u1ee5.<\/li>\n<li>Nhi\u1ec1u kho\u1ea3ng tr\u1eafng (white space) \u0111\u1ec3 t\u0103ng kh\u1ea3 n\u0103ng t\u1eadp trung.<\/li>\n<li>Typography mang t\u00ednh bi\u1ec3u c\u1ea3m nh\u1eb1m t\u1ea1o c\u1ea3m x\u00fac ho\u1eb7c thu h\u00fat s\u1ef1 ch\u00fa \u00fd.<\/li>\n<\/ul>\n<h3><strong>3. Typography Trong Thi\u1ebft K\u1ebf Editorial<\/strong><\/h3>\n<p>Editorial Design l\u00e0 l\u0129nh v\u1ef1c thi\u1ebft k\u1ebf cho s\u00e1ch, b\u00e1o, t\u1ea1p ch\u00ed, ebook ho\u1eb7c c\u00e1c b\u00e0i vi\u1ebft d\u00e0i.<\/p>\n<p>N\u1ebfu poster \u01b0u ti\u00ean thu h\u00fat s\u1ef1 ch\u00fa \u00fd th\u00ec editorial l\u1ea1i \u01b0u ti\u00ean tr\u1ea3i nghi\u1ec7m \u0111\u1ecdc trong th\u1eddi gian d\u00e0i. M\u1ed9t h\u1ec7 th\u1ed1ng typography t\u1ed1t gi\u00fap ng\u01b0\u1eddi \u0111\u1ecdc ti\u1ebfp nh\u1eadn n\u1ed9i dung d\u1ec5 d\u00e0ng m\u00e0 g\u1ea7n nh\u01b0 kh\u00f4ng nh\u1eadn ra s\u1ef1 t\u1ed3n t\u1ea1i c\u1ee7a n\u00f3.<\/p>\n<p>Khi thi\u1ebft k\u1ebf editorial, designer th\u01b0\u1eddng t\u1eadp trung v\u00e0o:<\/p>\n<ul>\n<li>C\u1ea5u tr\u00fac heading v\u00e0 subheading r\u00f5 r\u00e0ng.<\/li>\n<li>K\u00edch th\u01b0\u1edbc ch\u1eef ph\u00f9 h\u1ee3p v\u1edbi n\u1ed9i dung d\u00e0i.<\/li>\n<li>Leading v\u00e0 kho\u1ea3ng c\u00e1ch \u0111o\u1ea1n h\u1ee3p l\u00fd.<\/li>\n<li>\u0110\u1ed9 d\u00e0i d\u00f2ng \u0111\u1ecdc tho\u1ea3i m\u00e1i.<\/li>\n<li>S\u1ef1 nh\u1ea5t qu\u00e1n xuy\u00ean su\u1ed1t to\u00e0n b\u1ed9 \u1ea5n ph\u1ea9m.<\/li>\n<\/ul>\n<h2><strong>L\u1ed9 Tr\u00ecnh H\u1ecdc Typography Cho Ng\u01b0\u1eddi M\u1edbi: T\u1eeb T\u01b0 Duy \u0110\u1ebfn Th\u1ef1c Chi\u1ebfn\u00a0<\/strong><\/h2>\n<p>Kh\u00f4ng gi\u1ed1ng nh\u01b0 nhi\u1ec1u k\u1ef9 n\u0103ng thi\u1ebft k\u1ebf kh\u00e1c, typography kh\u00f4ng ph\u1ea3i l\u00e0 m\u1ed9t b\u1ed9 m\u00f4n thu\u1ea7n l\u00fd thuy\u1ebft. B\u1ea1n c\u00f3 th\u1ec3 thu\u1ed9c l\u00e0u c\u00e1c kh\u00e1i ni\u1ec7m nh\u01b0 <em>hierarchy, leading<\/em> hay <em>kerning<\/em> ch\u1ec9 trong v\u00e0i gi\u1edd, nh\u01b0ng \u0111\u1ec3 bi\u1ebft c\u00e1ch \u201cth\u1ed5i h\u1ed3n\u201d v\u00e0 s\u1eed d\u1ee5ng ch\u00fang \u0111\u00fang l\u00fac l\u1ea1i l\u00e0 c\u00e2u chuy\u1ec7n c\u1ee7a s\u1ef1 quan s\u00e1t v\u00e0 th\u1ef1c h\u00e0nh b\u1ec1n b\u1ec9.<\/p>\n<p>Thay v\u00ec t\u1ef1 l\u00e0m ng\u1ee3p b\u1ea3n th\u00e2n b\u1eb1ng vi\u1ec7c t\u1ea3i h\u00e0ng tr\u0103m font ch\u1eef hay nh\u1ed3i nh\u00e9t thu\u1eadt ng\u1eef, h\u00e3y b\u1eaft \u0111\u1ea7u x\u00e2y d\u1ef1ng t\u01b0 duy v\u1eefng ch\u1eafc theo l\u1ed9 tr\u00ecnh 4 giai \u0111o\u1ea1n d\u01b0\u1edbi \u0111\u00e2y.<br>\n<img decoding=\"async\" class=\"aligncenter\" src=\"https:\/\/storage.googleapis.com\/websiteasset\/uploads\/ef27ef78-trinh-hoc-typography-cho-nguoi-moi.webp\" alt=\"L\u1ed9 Tr\u00ecnh H\u1ecdc Typography Cho Ng\u01b0\u1eddi M\u1edbi\" width=\"1440\" height=\"590\" style=\"aspect-ratio:1440\/590;\"><\/p>\n<h3><strong>Giai \u0110o\u1ea1n 1: X\u00e2y D\u1ef1ng T\u01b0 Duy N\u1ec1n T\u1ea3ng (Foundational Knowledge)<\/strong><\/h3>\n<p>\u1ede giai \u0111o\u1ea1n b\u1eaft \u0111\u1ea7u, m\u1ee5c ti\u00eau kh\u00f4ng ph\u1ea3i l\u00e0 t\u1ea1o ra c\u00e1c layout ph\u1ee9c t\u1ea1p, m\u00e0 l\u00e0 ki\u1ec3m so\u00e1t \u0111\u01b0\u1ee3c kh\u1ea3 n\u0103ng \u0111\u1ecdc (readability) v\u00e0 c\u1ea5u tr\u00fac t\u1ed5 ch\u1ee9c th\u00f4ng tin. \u0110\u00e2y l\u00e0 ph\u1ea7n c\u1ed1t l\u00f5i \u00e1p d\u1ee5ng cho m\u1ecdi \u0111\u1ecbnh h\u01b0\u1edbng thi\u1ebft k\u1ebf, t\u1eeb Branding, Editorial cho \u0111\u1ebfn UI\/UX.<\/p>\n<p><strong>C\u00e1c kh\u00e1i ni\u1ec7m k\u1ef9 thu\u1eadt c\u1ea7n l\u00e0m ch\u1ee7:<\/strong><\/p>\n<ul>\n<li><strong>Typeface vs Font:<\/strong> Ph\u00e2n bi\u1ec7t gi\u1eefa <strong>Typeface<\/strong> (\u0111\u1ecbnh d\u1ea1ng thi\u1ebft k\u1ebf\/visual style) v\u00e0 <strong>Font<\/strong> (file asset v\u1eadt l\u00fd \u0111\u01b0\u1ee3c s\u1eed d\u1ee5ng khi code ho\u1eb7c thi\u1ebft k\u1ebf).<\/li>\n<li><strong>C\u00e1c nh\u00f3m ch\u1eef ph\u1ed5 bi\u1ebfn (Classification):<\/strong> Hi\u1ec3u r\u00f5 \u0111\u1eb7c t\u00ednh v\u00e0 m\u1ee5c \u0111\u00edch s\u1eed d\u1ee5ng c\u1ee7a Serif, Sans-serif, Display, Script v\u00e0 Monospace.<\/li>\n<li><strong>Hierarchy (Th\u1ee9 b\u1eadc th\u00f4ng tin):<\/strong> K\u1ef9 thu\u1eadt \u0111i\u1ec1u h\u01b0\u1edbng th\u1ecb gi\u00e1c, gi\u00fap ng\u01b0\u1eddi d\u00f9ng nh\u1eadn bi\u1ebft th\u00f4ng tin ch\u00ednh \u2013 ph\u1ee5 trong v\u00e0i gi\u00e2y.<\/li>\n<li><strong>C\u00e1c th\u00f4ng s\u1ed1 kho\u1ea3ng c\u00e1ch (Spacing):<\/strong> * Leading: Kho\u1ea3ng c\u00e1ch d\u00f2ng (Line height).\n<ul>\n<li>Kerning: Kho\u1ea3ng c\u00e1ch gi\u1eefa hai k\u00fd t\u1ef1 \u0111\u01a1n l\u1ebb.<\/li>\n<li>Tracking: Kho\u1ea3ng c\u00e1ch t\u1ed5ng th\u1ec3 c\u1ee7a m\u1ed9t \u0111o\u1ea1n v\u0103n b\u1ea3n (Letter-spacing).<\/li>\n<\/ul>\n<\/li>\n<li><strong>White Space (Kho\u1ea3ng tr\u1eafng):<\/strong> C\u00e1ch t\u1ed1i \u01b0u kh\u00f4ng gian tr\u1ed1ng \u0111\u1ec3 t\u1ed1i \u01b0u h\u00f3a tr\u1ea3i nghi\u1ec7m \u0111\u1ecdc v\u00e0 gi\u1ea3m t\u1ea3i nh\u1eadn th\u1ee9c (cognitive load).<\/li>\n<\/ul>\n<h3><strong>Giai \u0110o\u1ea1n 2: Ph\u00e2n T\u00edch Th\u1ef1c T\u1ebf (Deconstruct Layouts)<\/strong><\/h3>\n<p>Typography l\u00e0 k\u1ef9 n\u0103ng \u0111\u01b0\u1ee3c r\u00e8n luy\u1ec7n d\u1ef1a tr\u00ean t\u01b0 duy quan s\u00e1t v\u00e0 ph\u00e2n t\u00edch nhi\u1ec1u h\u01a1n l\u00e0 c\u00f4ng c\u1ee5.<\/p>\n<p>M\u1ed9t designer c\u00f3 kinh nghi\u1ec7m lu\u00f4n nh\u1eadn ra m\u1ed9t layout \u201cb\u1ea5t \u1ed5n\u201d d\u1ef1a v\u00e0o c\u1ea3m quan kh\u00f4ng gian tr\u01b0\u1edbc khi ph\u00e2n t\u00edch b\u1eb1ng l\u00fd thuy\u1ebft. Khi l\u01b0\u1edbt web, tr\u1ea3i nghi\u1ec7m \u1ee9ng d\u1ee5ng ho\u1eb7c xem poster, h\u00e3y ch\u1ee7 \u0111\u1ed9ng b\u00f3c t\u00e1ch (deconstruct) c\u00e1ch ch\u1eef v\u1eadn h\u00e0nh qua c\u00e1c c\u00e2u h\u1ecfi:<\/p>\n<ul>\n<li><em><em>T\u1ea1i sao typeface n\u00e0y l\u1ea1i \u0111\u01b0\u1ee3c l\u1ef1a ch\u1ecdn cho d\u1ef1 \u00e1n\/ng\u00e0nh h\u00e0ng n\u00e0y?<\/em><\/em><\/li>\n<\/ul>\n<ul>\n<li><em>Y\u1ebfu t\u1ed1 n\u00e0o (Size, Weight, Color) \u0111ang gi\u00fap ti\u00eau \u0111\u1ec1 n\u1ed5i b\u1eadt v\u00e0 ph\u00e2n c\u1ea5p r\u00f5 r\u00e0ng?<\/em><\/li>\n<\/ul>\n<ul>\n<li><em>T\u1ef7 l\u1ec7 kho\u1ea3ng c\u00e1ch d\u00f2ng (Leading) \u0111\u00e3 t\u1ed1i \u01b0u cho tr\u1ea3i nghi\u1ec7m \u0111\u1ecdc tr\u00ean m\u00e0n h\u00ecnh ch\u01b0a?<\/em><\/li>\n<\/ul>\n<ul>\n<li><em>B\u1ed9 ch\u1eef n\u00e0y \u0111ang truy\u1ec1n t\u1ea3i \u0111\u00fang t\u00ednh c\u00e1ch v\u00e0 \u0111\u1ecbnh v\u1ecb c\u1ee7a th\u01b0\u01a1ng hi\u1ec7u kh\u00f4ng?<\/em><\/li>\n<\/ul>\n<h3><strong>Giai \u0110o\u1ea1n 3: Th\u1ef1c H\u00e0nh V\u1edbi D\u1ef1 \u00c1n Th\u1ef1c T\u1ebf<\/strong><\/h3>\n<p>L\u00fd thuy\u1ebft v\u1ec1 <em>hierarchy<\/em>, <em>spacing<\/em> hay <em>font pairing<\/em> c\u00f3 th\u1ec3 r\u1ea5t d\u1ec5 hi\u1ec3u, nh\u01b0ng ch\u1ec9 khi tr\u1ef1c ti\u1ebfp b\u1eaft tay v\u00e0o d\u1ef1 \u00e1n, b\u1ea1n m\u1edbi th\u1ef1c s\u1ef1 hi\u1ec3u c\u00e1ch v\u1eadn h\u00e0nh c\u1ee7a ch\u00fang. Thay v\u00ec ch\u1edd \u0111\u1ebfn khi \u201ch\u1ecdc \u0111\u1ee7\u201d, h\u00e3y b\u1eaft \u0111\u1ea7u b\u1eb1ng nh\u1eefng th\u1eed nghi\u1ec7m nh\u1ecf \u0111\u1ec3 r\u00e8n luy\u1ec7n t\u01b0 duy ra quy\u1ebft \u0111\u1ecbnh (decision-making).<\/p>\n<p><strong>\u0110\u1ec3 t\u1ed1i \u01b0u h\u00f3a qu\u00e1 tr\u00ecnh n\u00e0y, b\u1ea1n n\u00ean k\u1ebft h\u1ee3p c\u00e1c c\u00f4ng c\u1ee5 h\u1ed7 tr\u1ee3 tr\u1ef1c quan sau:<\/strong><\/p>\n<ul>\n<li><strong>Typescale.com (Type scale calculator):<\/strong> C\u00f4ng c\u1ee5 t\u1ef1 \u0111\u1ed9ng t\u00ednh to\u00e1n t\u1ef7 l\u1ec7 v\u00e0 k\u00edch th\u01b0\u1edbc chu\u1ea9n gi\u1eefa Headline, Subheadline v\u00e0 Body text. Tr\u1ee3 th\u1ee7 \u0111\u1eafc l\u1ef1c gi\u00fap b\u1ea1n x\u00e2y d\u1ef1ng m\u1ed9t <strong>Typography Scale<\/strong> logic cho website thay v\u00ec \u01b0\u1edbc l\u01b0\u1ee3ng theo c\u1ea3m t\u00ednh.<\/li>\n<li><strong>WhatFont (Chrome extension):<\/strong> Ti\u1ec7n \u00edch m\u1edf r\u1ed9ng gi\u00fap b\u1ea1n inspect (ki\u1ec3m tra) v\u00e0 nh\u1eadn di\u1ec7n ngay l\u1eadp t\u1ee9c font ch\u1eef, size, <em>leading<\/em> c\u1ee7a b\u1ea5t k\u1ef3 s\u1ea3n ph\u1ea9m n\u00e0o tr\u00ean m\u00f4i tr\u01b0\u1eddng s\u1ed1 \u0111\u1ec3 t\u00ecm c\u1ea3m h\u1ee9ng khi thi\u1ebft k\u1ebf landing page.<\/li>\n<\/ul>\n<p><strong>C\u00e1c b\u00e0i t\u1eadp th\u1ef1c h\u00e0nh ph\u00f9 h\u1ee3p cho ng\u01b0\u1eddi m\u1edbi:<\/strong><\/p>\n<ul>\n<li><strong>Typographic Poster:<\/strong> Thi\u1ebft k\u1ebf b\u1ed1 c\u1ee5c layout \u0111\u1ec9nh cao <em>ch\u1ec9 s\u1eed d\u1ee5ng ch\u1eef<\/em>, kh\u00f4ng ph\u1ee5 thu\u1ed9c v\u00e0o h\u00ecnh \u1ea3nh.<\/li>\n<li><strong>Editorial Design:<\/strong> Th\u1eed s\u1ee9c v\u1edbi vi\u1ec7c d\u00e0n trang cho b\u00eca s\u00e1ch ho\u1eb7c t\u1ea1p ch\u00ed \u0111\u1ec3 hi\u1ec3u v\u1ec1 l\u01b0\u1edbi (grid system).<\/li>\n<li><strong>Landing Page:<\/strong> Thi\u1ebft k\u1ebf m\u1ed9t trang \u0111\u00edch \u0111\u01a1n gi\u1ea3n, t\u1eadp trung t\u1ed1i \u0111a v\u00e0o tr\u1ea3i nghi\u1ec7m \u0111\u1ecdc v\u00e0 lu\u1ed3ng th\u00f4ng tin c\u1ee7a ng\u01b0\u1eddi d\u00f9ng.<\/li>\n<\/ul>\n<h3><strong>Giai \u0110o\u1ea1n 4: T\u01b0 Duy Ph\u1ed1i H\u1ee3p Font Ch\u1eef (Font Pairing)<\/strong><\/h3>\n<p>Khi \u0111\u00e3 l\u00e0m ch\u1ee7 \u0111\u01b0\u1ee3c kh\u00f4ng gian v\u00e0 th\u1ee9 b\u1eadc th\u00f4ng tin, b\u01b0\u1edbc ti\u1ebfp theo l\u00e0 t\u1ea1o t\u00ednh nh\u1ea5t qu\u00e1n b\u1eb1ng c\u00e1ch k\u1ebft h\u1ee3p c\u00e1c typeface. Sai l\u1ea7m ph\u1ed5 bi\u1ebfn c\u1ee7a ng\u01b0\u1eddi m\u1edbi l\u00e0 l\u1ea1m d\u1ee5ng qu\u00e1 nhi\u1ec1u font ch\u1eef trong m\u1ed9t layout v\u1edbi mong mu\u1ed1n t\u1ea1o s\u1ef1 kh\u00e1c bi\u1ec7t.<\/p>\n<p>Tr\u00ean th\u1ef1c t\u1ebf, c\u00e1c h\u1ec7 th\u1ed1ng thi\u1ebft k\u1ebf (Design Systems) chuy\u00ean nghi\u1ec7p th\u01b0\u1eddng ch\u1ec9 s\u1eed d\u1ee5ng t\u1eeb 1 \u0111\u1ebfn 2 typeface. Ch\u00eca kh\u00f3a c\u1ee7a m\u1ed9t layout \u0111\u1eb9p n\u1eb1m \u1edf s\u1ef1 t\u01b0\u01a1ng ph\u1ea3n v\u00e0 t\u00ednh \u0111\u1ed3ng b\u1ed9.<\/p>\n<p><strong>N\u1ebfu ch\u01b0a bi\u1ebft b\u1eaft \u0111\u1ea7u t\u1eeb \u0111\u00e2u, b\u1ea1n c\u00f3 th\u1ec3 tham kh\u1ea3o 2 t\u00e0i nguy\u00ean mi\u1ec5n ph\u00ed n\u00e0y:<\/strong><\/p>\n<ul>\n<li><strong>Google Fonts (Font library):<\/strong> Th\u01b0 vi\u1ec7n font ch\u1eef m\u00e3 ngu\u1ed3n m\u1edf kh\u1ed5ng l\u1ed3, h\u1ed7 tr\u1ee3 ti\u1ebfng Vi\u1ec7t t\u1ed1t (nh\u01b0 <em>Roboto, Montserrat, Manrope<\/em>), t\u1ed1i \u01b0u hi\u1ec3n th\u1ecb tr\u00ean c\u00e1c thi\u1ebft b\u1ecb v\u00e0 n\u1ec1n t\u1ea3ng s\u1ed1.<\/li>\n<li><strong>FontPair.co (Font pairing ideas):<\/strong> Trang web chuy\u00ean g\u1ee3i \u00fd c\u00e1c c\u00f4ng th\u1ee9c k\u1ebft h\u1ee3p ph\u00f4ng ch\u1eef t\u1ed1i \u01b0u, gi\u00fap b\u1ea1n gi\u1ea3i b\u00e0i to\u00e1n ph\u1ed1i h\u1ee3p ph\u00f4ng ch\u1eef nhanh ch\u00f3ng khi c\u1ea7n th\u00eam \u00fd t\u01b0\u1edfng.<\/li>\n<\/ul>\n<p><strong>M\u1ed9t s\u1ed1 c\u00f4ng th\u1ee9c k\u1ebft h\u1ee3p font kinh \u0111i\u1ec3n:<\/strong><\/p>\n<ul>\n<li><strong>C\u1eb7p b\u00e0i tr\u00f9ng:<\/strong> <em>Serif<\/em> cho ti\u00eau \u0111\u1ec1 (t\u1ea1o \u0111i\u1ec3m nh\u1ea5n, chi\u1ec1u s\u00e2u) + <em>Sans-serif<\/em> cho n\u1ed9i dung (hi\u1ec7n \u0111\u1ea1i, t\u1ed1i \u01b0u kh\u1ea3 n\u0103ng \u0111\u1ecdc).<\/li>\n<li><strong>T\u1ea1o \u0111i\u1ec3m nh\u1ea5n:<\/strong> S\u1eed d\u1ee5ng m\u1ed9t <em>Display Typeface<\/em> c\u00e1 t\u00ednh cho c\u00e1c t\u1eeb kh\u00f3a ch\u00ednh + <em>Sans-serif<\/em> tinh gi\u1ea3n cho to\u00e0n b\u1ed9 ph\u1ea7n c\u00f2n l\u1ea1i.<\/li>\n<li><strong>H\u1ec7 th\u1ed1ng t\u1ed1i gi\u1ea3n (Single Typeface):<\/strong> Ch\u1ec9 s\u1eed d\u1ee5ng duy nh\u1ea5t m\u1ed9t typeface nh\u01b0ng linh ho\u1ea1t khai th\u00e1c c\u00e1c \u0111\u1ecbnh d\u1ea1ng <em>Weight<\/em> (Light, Regular, Medium, Bold) \u0111\u1ec3 t\u1ea1o \u0111\u1ed9 t\u01b0\u01a1ng ph\u1ea3n r\u00f5 r\u1ec7t cho layout.<\/li>\n<\/ul>\n<h2><strong>T\u1ea1m K\u1ebft<\/strong><\/h2>\n<p>Typography xu\u1ea5t hi\u1ec7n \u1edf h\u1ea7u h\u1ebft m\u1ecdi s\u1ea3n ph\u1ea9m thi\u1ebft k\u1ebf m\u00e0 ch\u00fang ta nh\u00ecn th\u1ea5y m\u1ed7i ng\u00e0y, t\u1eeb logo, bao b\u00ec s\u1ea3n ph\u1ea9m, poster qu\u1ea3ng c\u00e1o cho \u0111\u1ebfn website v\u00e0 \u1ee9ng d\u1ee5ng di \u0111\u1ed9ng. Tuy nhi\u00ean, typography kh\u00f4ng \u0111\u01a1n thu\u1ea7n l\u00e0 vi\u1ec7c l\u1ef1a ch\u1ecdn m\u1ed9t font ch\u1eef \u0111\u1eb9p. \u0110\u00f3 l\u00e0 qu\u00e1 tr\u00ecnh t\u1ed5 ch\u1ee9c, s\u1eafp x\u1ebfp v\u00e0 tr\u00ecnh b\u00e0y n\u1ed9i dung sao cho ng\u01b0\u1eddi \u0111\u1ecdc c\u00f3 th\u1ec3 ti\u1ebfp nh\u1eadn th\u00f4ng tin m\u1ed9t c\u00e1ch r\u00f5 r\u00e0ng, hi\u1ec7u qu\u1ea3 v\u00e0 nh\u1ea5t qu\u00e1n.<\/p>\n<p>Vi\u1ec7c hi\u1ec3u c\u00e1c nh\u00f3m typeface, c\u1ea5u tr\u00fac ch\u1eef, nh\u1eefng nguy\u00ean t\u1eafc c\u01a1 b\u1ea3n v\u1ec1 kho\u1ea3ng c\u00e1ch v\u00e0 th\u1ee9 b\u1eadc th\u00f4ng tin s\u1ebd gi\u00fap designer \u0111\u01b0a ra c\u00e1c quy\u1ebft \u0111\u1ecbnh thi\u1ebft k\u1ebf ch\u00ednh x\u00e1c h\u01a1n. D\u00f9 b\u1ea1n \u0111ang l\u00e0m graphic design, branding, editorial hay UI\/UX design, typography v\u1eabn l\u00e0 m\u1ed9t trong nh\u1eefng k\u1ef9 n\u0103ng n\u1ec1n t\u1ea3ng quan tr\u1ecdng nh\u1ea5t c\u1ea7n \u0111\u01b0\u1ee3c \u0111\u1ea7u t\u01b0 v\u00e0 r\u00e8n luy\u1ec7n l\u00e2u d\u00e0i.<\/p>\n<p>Cu\u1ed1i c\u00f9ng, <strong>typography<\/strong> kh\u00f4ng ph\u1ea3i l\u00e0 th\u1ee9 khi\u1ebfn ng\u01b0\u1eddi d\u00f9ng ch\u00fa \u00fd \u0111\u1ea7u ti\u00ean, nh\u01b0ng l\u1ea1i l\u00e0 y\u1ebfu t\u1ed1 quy\u1ebft \u0111\u1ecbnh h\u1ecd c\u00f3 mu\u1ed1n ti\u1ebfp t\u1ee5c \u0111\u1ecdc, kh\u00e1m ph\u00e1 v\u00e0 t\u01b0\u01a1ng t\u00e1c v\u1edbi n\u1ed9i dung hay kh\u00f4ng.<\/p>\n<p>Trong thi\u1ebft k\u1ebf s\u1ea3n ph\u1ea9m s\u1ed1, typography c\u00f2n \u0111\u00f3ng vai tr\u00f2 quan tr\u1ecdng trong vi\u1ec7c x\u00e2y d\u1ef1ng tr\u1ea3i nghi\u1ec7m ng\u01b0\u1eddi d\u00f9ng. M\u1ed9t h\u1ec7 th\u1ed1ng ch\u1eef \u0111\u01b0\u1ee3c thi\u1ebft k\u1ebf t\u1ed1t gi\u00fap n\u1ed9i dung d\u1ec5 ti\u1ebfp c\u1eadn h\u01a1n, c\u1ea3i thi\u1ec7n kh\u1ea3 n\u0103ng \u0111\u1ecdc v\u00e0 t\u1ea1o s\u1ef1 nh\u1ea5t qu\u00e1n tr\u00ean to\u00e0n b\u1ed9 giao di\u1ec7n. \u0110\u00f3 c\u0169ng l\u00e0 l\u00fd do typography lu\u00f4n l\u00e0 m\u1ed9t ph\u1ea7n kh\u00f4ng th\u1ec3 thi\u1ebfu trong quy tr\u00ecnh thi\u1ebft k\u1ebf UI\/UX hi\u1ec7n \u0111\u1ea1i.<\/p>\n<p>N\u1ebfu b\u1ea1n mu\u1ed1n x\u00e2y d\u1ef1ng nh\u1eefng tr\u1ea3i nghi\u1ec7m s\u1ed1 v\u1eeba th\u1ea9m m\u1ef9 v\u1eeba t\u1ed1i \u01b0u kh\u1ea3 n\u0103ng s\u1eed d\u1ee5ng, \u0111\u1ed9i ng\u0169 thi\u1ebft k\u1ebf t\u1ea1i <a href=\"https:\/\/lollypop.design\/ui-ux-design-agency-vietnam-vie\/\" target=\"_blank\" rel=\"noopener\"><strong>Lollypop<\/strong><\/a> c\u00f3 th\u1ec3 gi\u00fap b\u1ea1n thi\u1ebft k\u1ebf c\u00e1c h\u1ec7 th\u1ed1ng giao di\u1ec7n, design system v\u00e0 s\u1ea3n ph\u1ea9m s\u1ed1 l\u1ea5y ng\u01b0\u1eddi d\u00f9ng l\u00e0m trung t\u00e2m. <a href=\"https:\/\/lollypop.design\/project-enquiry\/\" target=\"_blank\" rel=\"noopener\"><strong>H\u00e3y li\u00ean h\u1ec7 v\u1edbi ch\u00fang t\u00f4i<\/strong><\/a> \u0111\u1ec3 kh\u00e1m ph\u00e1 c\u00e1ch thi\u1ebft k\u1ebf c\u00f3 th\u1ec3 t\u1ea1o ra nh\u1eefng tr\u1ea3i nghi\u1ec7m t\u1ed1t h\u01a1n cho kh\u00e1ch h\u00e0ng v\u00e0 mang l\u1ea1i gi\u00e1 tr\u1ecb l\u00e2u d\u00e0i cho doanh nghi\u1ec7p.<\/p>\n<h1><strong>C\u00e1c c\u00e2u h\u1ecfi th\u01b0\u1eddng g\u1eb7p (FAQs)<\/strong><\/h1>\n<h3><strong>1. Typography l\u00e0 g\u00ec trong thi\u1ebft k\u1ebf \u0111\u1ed3 h\u1ecda?<\/strong><\/h3>\n<p>Typography l\u00e0 ngh\u1ec7 thu\u1eadt v\u00e0 k\u1ef9 thu\u1eadt s\u1eafp x\u1ebfp ch\u1eef nh\u1eb1m truy\u1ec1n t\u1ea3i th\u00f4ng tin m\u1ed9t c\u00e1ch r\u00f5 r\u00e0ng, d\u1ec5 \u0111\u1ecdc v\u00e0 c\u00f3 t\u00ednh th\u1ea9m m\u1ef9. Typography kh\u00f4ng ch\u1ec9 bao g\u1ed3m vi\u1ec7c l\u1ef1a ch\u1ecdn typeface m\u00e0 c\u00f2n li\u00ean quan \u0111\u1ebfn k\u00edch th\u01b0\u1edbc ch\u1eef, kho\u1ea3ng c\u00e1ch d\u00f2ng, kho\u1ea3ng c\u00e1ch k\u00fd t\u1ef1, m\u00e0u s\u1eafc v\u00e0 c\u00e1ch x\u00e2y d\u1ef1ng th\u1ee9 b\u1eadc th\u00f4ng tin trong thi\u1ebft k\u1ebf.<\/p>\n<h3><strong>2. Typeface v\u00e0 Font kh\u00e1c nhau nh\u01b0 th\u1ebf n\u00e0o?<\/strong><\/h3>\n<p>Typeface l\u00e0 thi\u1ebft k\u1ebf t\u1ed5ng th\u1ec3 c\u1ee7a m\u1ed9t h\u1ecd ch\u1eef, ch\u1eb3ng h\u1ea1n nh\u01b0 Helvetica, Inter ho\u1eb7c Garamond. Trong khi \u0111\u00f3, font l\u00e0 m\u1ed9t bi\u1ebfn th\u1ec3 c\u1ee5 th\u1ec3 c\u1ee7a typeface, bao g\u1ed3m c\u00e1c thu\u1ed9c t\u00ednh nh\u01b0 \u0111\u1ed9 \u0111\u1eadm ho\u1eb7c ki\u1ec3u ch\u1eef.<\/p>\n<p><strong>V\u00ed d\u1ee5:<\/strong> Inter l\u00e0 m\u1ed9t typeface, c\u00f2n Inter Bold ho\u1eb7c Inter Light l\u00e0 c\u00e1c font thu\u1ed9c typeface \u0111\u00f3. Trong th\u1ef1c t\u1ebf, hai thu\u1eadt ng\u1eef n\u00e0y th\u01b0\u1eddng \u0111\u01b0\u1ee3c s\u1eed d\u1ee5ng thay th\u1ebf cho nhau, nh\u01b0ng trong l\u0129nh v\u1ef1c typography ch\u00fang mang \u00fd ngh\u0129a kh\u00e1c nhau.<\/p>\n<h3><strong>3. Serif v\u00e0 Sans-serif kh\u00e1c nhau nh\u01b0 th\u1ebf n\u00e0o?<\/strong><\/h3>\n<p>Serif l\u00e0 nh\u00f3m ch\u1eef c\u00f3 c\u00e1c n\u00e9t nh\u1ecf \u1edf \u0111\u1ea7u ho\u1eb7c cu\u1ed1i k\u00fd t\u1ef1, th\u01b0\u1eddng mang l\u1ea1i c\u1ea3m gi\u00e1c truy\u1ec1n th\u1ed1ng, trang tr\u1ecdng v\u00e0 \u0111\u00e1ng tin c\u1eady. Ng\u01b0\u1ee3c l\u1ea1i, Sans-serif kh\u00f4ng c\u00f3 c\u00e1c chi ti\u1ebft n\u00e0y, t\u1ea1o c\u1ea3m gi\u00e1c hi\u1ec7n \u0111\u1ea1i, t\u1ed1i gi\u1ea3n v\u00e0 d\u1ec5 \u0111\u1ecdc tr\u00ean m\u00e0n h\u00ecnh k\u1ef9 thu\u1eadt s\u1ed1.<\/p>\n<p>Kh\u00f4ng c\u00f3 nh\u00f3m n\u00e0o t\u1ed1t h\u01a1n tuy\u1ec7t \u0111\u1ed1i. Vi\u1ec7c l\u1ef1a ch\u1ecdn Serif hay Sans-serif ph\u1ee5 thu\u1ed9c v\u00e0o m\u1ee5c ti\u00eau thi\u1ebft k\u1ebf, t\u00ednh c\u00e1ch th\u01b0\u01a1ng hi\u1ec7u v\u00e0 m\u00f4i tr\u01b0\u1eddng hi\u1ec3n th\u1ecb c\u1ee7a s\u1ea3n ph\u1ea9m.<\/p>\n<h3><strong>4. Kerning v\u00e0 Tracking kh\u00e1c nhau nh\u01b0 th\u1ebf n\u00e0o?<\/strong><\/h3>\n<p>Kerning l\u00e0 vi\u1ec7c \u0111i\u1ec1u ch\u1ec9nh kho\u1ea3ng c\u00e1ch gi\u1eefa hai k\u00fd t\u1ef1 c\u1ee5 th\u1ec3 \u0111\u1ec3 t\u1ea1o c\u1ea3m gi\u00e1c c\u00e2n \u0111\u1ed1i h\u01a1n v\u1ec1 m\u1eb7t th\u1ecb gi\u00e1c. Trong khi \u0111\u00f3, Tracking l\u00e0 \u0111i\u1ec1u ch\u1ec9nh kho\u1ea3ng c\u00e1ch \u0111\u1ed3ng \u0111\u1ec1u gi\u1eefa t\u1ea5t c\u1ea3 c\u00e1c k\u00fd t\u1ef1 trong m\u1ed9t t\u1eeb, m\u1ed9t c\u00e2u ho\u1eb7c m\u1ed9t \u0111o\u1ea1n v\u0103n b\u1ea3n.<\/p>\n<p>C\u00f3 th\u1ec3 hi\u1ec3u \u0111\u01a1n gi\u1ea3n: <strong>Kerning t\u00e1c \u0111\u1ed9ng \u0111\u1ebfn t\u1eebng c\u1eb7p ch\u1eef<\/strong>, c\u00f2n <strong>Tracking t\u00e1c \u0111\u1ed9ng \u0111\u1ebfn to\u00e0n b\u1ed9 nh\u00f3m ch\u1eef<\/strong>. \u0110\u00e2y l\u00e0 hai k\u1ef9 thu\u1eadt quan tr\u1ecdng gi\u00fap typography tr\u1edf n\u00ean d\u1ec5 \u0111\u1ecdc v\u00e0 chuy\u00ean nghi\u1ec7p h\u01a1n.<\/p>\n<h3><strong>5. H\u1ecdc Typography n\u00ean b\u1eaft \u0111\u1ea7u t\u1eeb \u0111\u00e2u?<\/strong><\/h3>\n<p>Ng\u01b0\u1eddi m\u1edbi n\u00ean b\u1eaft \u0111\u1ea7u b\u1eb1ng vi\u1ec7c hi\u1ec3u c\u00e1c kh\u00e1i ni\u1ec7m n\u1ec1n t\u1ea3ng nh\u01b0 typeface, font, hierarchy, leading, kerning v\u00e0 tracking. Sau \u0111\u00f3, h\u00e3y quan s\u00e1t c\u00e1ch typography \u0111\u01b0\u1ee3c s\u1eed d\u1ee5ng trong website, \u1ee9ng d\u1ee5ng, poster ho\u1eb7c c\u00e1c s\u1ea3n ph\u1ea9m th\u01b0\u01a1ng hi\u1ec7u \u0111\u1ec3 r\u00e8n luy\u1ec7n kh\u1ea3 n\u0103ng nh\u1eadn bi\u1ebft v\u00e0 \u0111\u00e1nh gi\u00e1.<\/p>\n<p>B\u00ean c\u1ea1nh vi\u1ec7c h\u1ecdc l\u00fd thuy\u1ebft, th\u1ef1c h\u00e0nh v\u1edbi c\u00e1c d\u1ef1 \u00e1n th\u1ef1c t\u1ebf nh\u01b0 thi\u1ebft k\u1ebf poster, landing page ho\u1eb7c h\u1ec7 th\u1ed1ng typography cho website s\u1ebd gi\u00fap b\u1ea1n ti\u1ebfn b\u1ed9 nhanh h\u01a1n. Typography l\u00e0 k\u1ef9 n\u0103ng c\u1ea7n \u0111\u01b0\u1ee3c r\u00e8n luy\u1ec7n li\u00ean t\u1ee5c th\u00f4ng qua quan s\u00e1t v\u00e0 tr\u1ea3i nghi\u1ec7m th\u1ef1c t\u1ebf thay v\u00ec ch\u1ec9 h\u1ecdc qua s\u00e1ch v\u1edf.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>B\u1ea1n c\u00f3 th\u1ec3 \u0111\u1ecdc m\u1ed9t b\u00e0i b\u00e1o d\u00e0i 2.000 t\u1eeb m\u00e0 kh\u00f4ng c\u1ea3m th\u1ea5y m\u1ec7t. Nh\u01b0ng c\u0169ng c\u00f3 th\u1ec3 b\u1ecf cu\u1ed9c ch\u1ec9 sau v\u00e0i d\u00f2ng d\u00f9 n\u1ed9i dung ho\u00e0n to\u00e0n gi\u1ed1ng nhau. S\u1ef1 kh\u00e1c bi\u1ec7t th\u01b0\u1eddng kh\u00f4ng n\u1eb1m \u1edf n\u1ed9i dung. N\u00f3 n\u1eb1m \u1edf c\u00e1ch n\u1ed9i dung \u0111\u01b0\u1ee3c tr\u00ecnh b\u00e0y. Kho\u1ea3ng c\u00e1ch gi\u1eefa c\u00e1c d\u00f2ng, [&hellip;]<\/p>\n","protected":false},"author":24,"featured_media":25217,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[5,18],"tags":[],"blogs_category":[26,27,25],"class_list":["post-25216","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-blogs","category-june","blogs_category-banner-blog","blogs_category-blogs","blogs_category-top-blogs"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v25.9 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Typography L\u00e0 G\u00ec? Nguy\u00ean T\u1eafc, Thu\u1eadt Ng\u1eef &amp; C\u00e1ch \u1ee8ng D\u1ee5ng - Lollypop<\/title>\n<meta name=\"description\" content=\"Typography l\u00e0 g\u00ec? T\u00ecm hi\u1ec3u c\u00e1c nguy\u00ean t\u1eafc typography, typeface, font, hierarchy, kerning, leading v\u00e0 c\u00e1ch \u1ee9ng d\u1ee5ng trong UI\/UX, branding, graphic design.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/lollypop.design\/blog\/2026\/june\/typography-la-gi\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Typography L\u00e0 G\u00ec? Nguy\u00ean T\u1eafc, Thu\u1eadt Ng\u1eef &amp; C\u00e1ch \u1ee8ng D\u1ee5ng - Lollypop\" \/>\n<meta property=\"og:description\" content=\"Typography l\u00e0 g\u00ec? T\u00ecm hi\u1ec3u c\u00e1c nguy\u00ean t\u1eafc typography, typeface, font, hierarchy, kerning, leading v\u00e0 c\u00e1ch \u1ee9ng d\u1ee5ng trong UI\/UX, branding, graphic design.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/lollypop.design\/blog\/2026\/june\/typography-la-gi\/\" \/>\n<meta property=\"og:site_name\" content=\"Lollypop\" \/>\n<meta property=\"article:published_time\" content=\"2026-06-26T07:35:19+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2026-06-26T10:07:11+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/storage.googleapis.com\/websiteasset\/uploads\/b74a49c8-typography-la-gi.webp\" \/>\n\t<meta property=\"og:image:width\" content=\"1461\" \/>\n\t<meta property=\"og:image:height\" content=\"942\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/webp\" \/>\n<meta name=\"author\" content=\"David pham\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"David pham\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"24 minutes\" \/>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Typography L\u00e0 G\u00ec? Nguy\u00ean T\u1eafc, Thu\u1eadt Ng\u1eef & C\u00e1ch \u1ee8ng D\u1ee5ng - Lollypop","description":"Typography l\u00e0 g\u00ec? T\u00ecm hi\u1ec3u c\u00e1c nguy\u00ean t\u1eafc typography, typeface, font, hierarchy, kerning, leading v\u00e0 c\u00e1ch \u1ee9ng d\u1ee5ng trong UI\/UX, branding, graphic design.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/lollypop.design\/blog\/2026\/june\/typography-la-gi\/","og_locale":"en_US","og_type":"article","og_title":"Typography L\u00e0 G\u00ec? Nguy\u00ean T\u1eafc, Thu\u1eadt Ng\u1eef & C\u00e1ch \u1ee8ng D\u1ee5ng - Lollypop","og_description":"Typography l\u00e0 g\u00ec? T\u00ecm hi\u1ec3u c\u00e1c nguy\u00ean t\u1eafc typography, typeface, font, hierarchy, kerning, leading v\u00e0 c\u00e1ch \u1ee9ng d\u1ee5ng trong UI\/UX, branding, graphic design.","og_url":"https:\/\/lollypop.design\/blog\/2026\/june\/typography-la-gi\/","og_site_name":"Lollypop","article_published_time":"2026-06-26T07:35:19+00:00","article_modified_time":"2026-06-26T10:07:11+00:00","og_image":[{"width":1461,"height":942,"url":"https:\/\/storage.googleapis.com\/websiteasset\/uploads\/b74a49c8-typography-la-gi.webp","type":"image\/webp"}],"author":"David pham","twitter_card":"summary_large_image","twitter_misc":{"Written by":"David pham","Est. reading time":"24 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/lollypop.design\/blog\/2026\/june\/typography-la-gi\/#article","isPartOf":{"@id":"https:\/\/lollypop.design\/blog\/2026\/june\/typography-la-gi\/"},"author":{"name":"David pham","@id":"https:\/\/lollypop.design\/#\/schema\/person\/44bf300bf3fdcd7283147642786e1dc2"},"headline":"Typography l\u00e0 g\u00ec? Nguy\u00ean t\u1eafc, Ph\u00e2n lo\u1ea1i &#038; \u1ee8ng d\u1ee5ng Trong Thi\u1ebft K\u1ebf","datePublished":"2026-06-26T07:35:19+00:00","dateModified":"2026-06-26T10:07:11+00:00","mainEntityOfPage":{"@id":"https:\/\/lollypop.design\/blog\/2026\/june\/typography-la-gi\/"},"wordCount":7358,"publisher":{"@id":"https:\/\/lollypop.design\/#organization"},"image":{"@id":"https:\/\/lollypop.design\/blog\/2026\/june\/typography-la-gi\/#primaryimage"},"thumbnailUrl":"https:\/\/storage.googleapis.com\/websiteasset\/uploads\/b74a49c8-typography-la-gi.webp","articleSection":["blogs","june"],"inLanguage":"en-US"},{"@type":"WebPage","@id":"https:\/\/lollypop.design\/blog\/2026\/june\/typography-la-gi\/","url":"https:\/\/lollypop.design\/blog\/2026\/june\/typography-la-gi\/","name":"Typography L\u00e0 G\u00ec? Nguy\u00ean T\u1eafc, Thu\u1eadt Ng\u1eef & C\u00e1ch \u1ee8ng D\u1ee5ng - Lollypop","isPartOf":{"@id":"https:\/\/lollypop.design\/#website"},"primaryImageOfPage":{"@id":"https:\/\/lollypop.design\/blog\/2026\/june\/typography-la-gi\/#primaryimage"},"image":{"@id":"https:\/\/lollypop.design\/blog\/2026\/june\/typography-la-gi\/#primaryimage"},"thumbnailUrl":"https:\/\/storage.googleapis.com\/websiteasset\/uploads\/b74a49c8-typography-la-gi.webp","datePublished":"2026-06-26T07:35:19+00:00","dateModified":"2026-06-26T10:07:11+00:00","description":"Typography l\u00e0 g\u00ec? T\u00ecm hi\u1ec3u c\u00e1c nguy\u00ean t\u1eafc typography, typeface, font, hierarchy, kerning, leading v\u00e0 c\u00e1ch \u1ee9ng d\u1ee5ng trong UI\/UX, branding, graphic design.","breadcrumb":{"@id":"https:\/\/lollypop.design\/blog\/2026\/june\/typography-la-gi\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/lollypop.design\/blog\/2026\/june\/typography-la-gi\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/lollypop.design\/blog\/2026\/june\/typography-la-gi\/#primaryimage","url":"https:\/\/storage.googleapis.com\/websiteasset\/uploads\/b74a49c8-typography-la-gi.webp","contentUrl":"https:\/\/storage.googleapis.com\/websiteasset\/uploads\/b74a49c8-typography-la-gi.webp","width":1461,"height":942,"caption":"Typography l\u00e0 g\u00ec"},{"@type":"BreadcrumbList","@id":"https:\/\/lollypop.design\/blog\/2026\/june\/typography-la-gi\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/lollypop.design\/"},{"@type":"ListItem","position":2,"name":"Typography l\u00e0 g\u00ec? Nguy\u00ean t\u1eafc, Ph\u00e2n lo\u1ea1i &#038; \u1ee8ng d\u1ee5ng Trong Thi\u1ebft K\u1ebf"}]},{"@type":"WebSite","@id":"https:\/\/lollypop.design\/#website","url":"https:\/\/lollypop.design\/","name":"Lollypop","description":"Designing Human-Centered Digital Experiences.","publisher":{"@id":"https:\/\/lollypop.design\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/lollypop.design\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/lollypop.design\/#organization","name":"lollypop","url":"https:\/\/lollypop.design\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/lollypop.design\/#\/schema\/logo\/image\/","url":"https:\/\/storage.googleapis.com\/websiteasset\/uploads\/2022\/01\/lollypop-new-logo-2.jpg","contentUrl":"https:\/\/storage.googleapis.com\/websiteasset\/uploads\/2022\/01\/lollypop-new-logo-2.jpg","width":350,"height":226,"caption":"lollypop"},"image":{"@id":"https:\/\/lollypop.design\/#\/schema\/logo\/image\/"}},{"@type":"Person","@id":"https:\/\/lollypop.design\/#\/schema\/person\/44bf300bf3fdcd7283147642786e1dc2","name":"David pham","url":"https:\/\/lollypop.design\/author\/david\/"}]}},"_links":{"self":[{"href":"https:\/\/lollypop.design\/wp-json\/wp\/v2\/posts\/25216","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/lollypop.design\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/lollypop.design\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/lollypop.design\/wp-json\/wp\/v2\/users\/24"}],"replies":[{"embeddable":true,"href":"https:\/\/lollypop.design\/wp-json\/wp\/v2\/comments?post=25216"}],"version-history":[{"count":0,"href":"https:\/\/lollypop.design\/wp-json\/wp\/v2\/posts\/25216\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/lollypop.design\/wp-json\/wp\/v2\/media\/25217"}],"wp:attachment":[{"href":"https:\/\/lollypop.design\/wp-json\/wp\/v2\/media?parent=25216"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/lollypop.design\/wp-json\/wp\/v2\/categories?post=25216"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/lollypop.design\/wp-json\/wp\/v2\/tags?post=25216"},{"taxonomy":"blogs_category","embeddable":true,"href":"https:\/\/lollypop.design\/wp-json\/wp\/v2\/blogs_category?post=25216"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}