Phông chữ ttf khác với phông chữ otf như thế nào? Tệp otf là gì và làm cách nào để mở tệp otf? Thông tin kỹ thuật về file OTF

Xin chào, Habr!

Hàng núi bài viết đã được viết mô tả các khía cạnh khác nhau khi làm việc với phông chữ web, nhiều ví dụ hoạt động đã được thu thập, nhưng hàng ngày chúng ta vẫn tiếp tục phải đối mặt với sự hiểu lầm cơ bản về phông chữ web là gì. Không phải ai cũng có thời gian tìm kiếm tài liệu trên Google về chủ đề này, vì vậy tôi đã cố gắng đưa ra câu trả lời cho các câu hỏi thường gặp. Tài liệu này sẽ được quan tâm chủ yếu bởi những người chưa đi sâu vào sự phức tạp của công nghệ phông chữ.

01. Tại sao chúng ta lại cần phông chữ web mà không phải phông chữ tiêu chuẩn?

Điều đầu tiên bạn nghĩ đến là các phông chữ tiêu chuẩn cực kỳ nhàm chán và thật khó để làm điều gì đó nguyên bản với sự trợ giúp của chúng. Theo quy định, hầu hết chúng đều mang đến sự u sầu và chán nản không chỉ cho người dùng mà còn cho cả những người thiết kế web. Trong trường hợp này, các phông chữ không chuẩn có tính biểu cảm cao hơn và ngoài ra, chúng có nhiều mức độ lớn hơn nên có rất nhiều lựa chọn. Hơn nữa, phông chữ là một phần không thể thiếu của thương hiệu, vì vậy mọi công ty đều cố gắng sử dụng nó một cách tích cực hơn vì cơ hội kỹ thuật như vậy đã xuất hiện.

Và người ta hoàn toàn có thể từ bỏ các phông chữ tiêu chuẩn, đặc biệt là vì nhiều hệ điều hành di động không hỗ trợ chúng (ví dụ: Arial, Taһoma, Verdana và Georgia). Tuy nhiên, thật không may, ngành công nghiệp, trong nhiều năm đã được điều chỉnh thành 96 màn hình dpi và Georgia verdans, vẫn chưa hoàn toàn sẵn sàng cho những thay đổi nhanh chóng và trên các hệ điều hành Windows cũ hơn vẫn có vấn đề với việc hiển thị phông chữ không chuẩn do đặc thù của cơ chế rasterization

02. Làm thế nào để chọn được font chữ web tốt?

Phông chữ không chỉ là một tập hợp các chữ cái được số hóa được tạo bằng bút vẽ trên giấy hoặc trong Illustrator, nó còn được tinh chỉnh và đánh bóng 98%, gợi ý và thử nghiệm trên nhiều phương tiện khác nhau và ở các kích cỡ khác nhau. Phông chữ này trông đẹp, kiểu dáng bóng bẩy, sẽ không có vấn đề gì với nó dù trên máy in hay trên màn hình, nó toát lên chất lượng tốt.

Tuy nhiên, khi chọn phông chữ, điều này thậm chí không phải là điều quan trọng hơn nhiều mà là sự phù hợp và tuân thủ của phông chữ với phương pháp sử dụng và nhiệm vụ được giao cho nó. Nếu bạn làm việc với phông chữ, bạn cần hiểu mọi thứ hoạt động như thế nào những công nghệ nào được sử dụng. Điều này sẽ giúp bạn không ghi nhớ trong đầu một loạt các quy tắc ghi nhớ khó hiểu, được ghi lại một cách phù hợp và bắt đầu. Ví dụ, mọi nhà in có lòng tự trọng đều biết lý do tại sao không nên sử dụng phông chữ TrueType để in offset, phông chữ nào có thể được sử dụng làm phông chữ văn bản và phông chữ nào - chỉ dành cho tiêu đề hoặc chỉ mục. Nếu anh ta không biết điều này, thì anh ta sẽ phải in lại một lượng lớn bản in, và những bất ngờ và vấn đề liên tục sẽ chờ đợi anh ta tại nơi làm việc. Thật ngạc nhiên là tại sao không ai đưa ra bất kỳ yêu cầu nào đối với các nhà thiết kế web.

03. Trình duyệt hiển thị phông chữ như thế nào?

Tôi thường nghe nói rằng các trình duyệt tự vẽ phông chữ nên chúng trông khác nhau ở mọi nơi. Nhưng trên thực tế, một hệ thống con đồ họa đặc biệt của HĐH tham gia vào việc hiển thị phông chữ: trong Windows, điều này GDI hoặc Viết trực tiếp và trên OS X và iOS - Văn bản lõi(và trước đây là QuickDraw). Có 3 cơ chế rasterization (render) phông chữ phổ biến: pixel hai màu (đen và trắng), pixel đơn sắc (thường được gọi là khử răng cưa hoặc khử răng cưa thông thường) và pixel phụ. Subpixel sử dụng tính năng của màn hình LCD và plasma, trong đó mỗi pixel được chia thành 3 phần (đỏ, lục và lam), nhằm tăng độ phân giải ngang của hình ảnh được hiển thị và cải thiện độ rõ nét.

Tuy nhiên, các trình duyệt chọn phương thức hiển thị của riêng chúng từ các phương thức do HĐH cung cấp. Ví dụ: GDI có 3 tùy chọn hiển thị: đen trắng, khử răng cưa thông thường và subpixel Loại rõ ràng. Điểm đặc biệt của cái sau là việc làm mịn chỉ xảy ra theo chiều ngang, phù hợp với vị trí của các pixel phụ. Đây chính là lý do tại sao chúng ta thường thấy hiện tượng răng cưa khủng khiếp ở các nét ngang và chéo của phông chữ khi sử dụng. May mắn thay, Microsoft bắt đầu dần dần cải thiện cơ chế này và GDI đã được thay thế bằng công nghệ DirectWrite, công nghệ này đã đưa ra tính năng khử răng cưa dọc. So sánh:

04. TTF hay OTF?

TrueType và PostScript ban đầu là các định dạng phông chữ khác nhau. TrueType sử dụng đường cong Bezier bậc hai, trong khi PostScript sử dụng đường cong bậc ba, vốn quen thuộc với các nhà thiết kế làm việc trong Illustrator và Photoshop. Ngày nay, cả hai phương pháp mô tả đường cong đều được sử dụng như một phần của cùng một định dạng OpenType, với điểm khác biệt duy nhất là tệp TrueType có phần mở rộng TTF và tệp PostScript có phần mở rộng OTF. Mỗi công nghệ đều có những tính năng gợi ý riêng và ứng dụng cụ thể.

Nhìn vào bức tranh. Nếu phông chữ TrueType dễ đọc hơn nhiều ở kích thước nhỏ, nhưng ở kích thước lớn, chúng ta thấy những nét đặc trưng, ​​thì đối với phông chữ PostScript, mọi thứ hoàn toàn ngược lại. Điều này là do các trình duyệt chọn các phương pháp rasterization khác nhau cho PS và TT. Đối với PS, trình duyệt áp dụng khử răng cưa đơn sắc thông thường và TT được xử lý bằng ClearType. Vì vậy, hóa ra TrueType sẽ thích hợp hơn cho phông chữ văn bản và PostScript tốt hơn cho các tiêu đề và dòng chữ lớn.

Chúng tôi cũng thấy rằng không phải tất cả các trình duyệt đều sử dụng DirectWrite. Vì vậy, nó vẫn không có trong Google Chrome.

05. Điều gì khác ảnh hưởng đến màn hình?

Đôi khi tốt hơn là đặt phương pháp rasterization theo cách thủ công. Ví dụ: trong các trình duyệt có công cụ Webkit, bạn có thể sử dụng thuộc tính CSS - làm mịn phông chữ webkit và kích hoạt khử răng cưa thông thường theo cách thủ công thay vì khử răng cưa pixel phụ và ngược lại. Ngoài ra còn có những cách không hề tầm thường để khiến trình duyệt thay đổi phương pháp rasterization; nó đã từng được đề xuất trên Habré.

Chúng ta không được quên về cỡ chữ (font-size). Hình dạng đường viền, độ tương phản nét vẽ và khả năng đọc có thể khác nhau rất nhiều giữa các kích thước phông chữ. Đặt trình chỉnh sửa đồ họa xuống và xem phông chữ web trông như thế nào trong trình duyệt, trong chiến đấu.

Một cách khác để giảm thiểu những thiếu sót của khử răng cưa là thông qua quản lý màu sắc và độ tương phản. Để giảm hiệu ứng của đường viền màu (khi sử dụng ClearType, các đường viền màu vàng và đỏ tươi xuất hiện xung quanh các cạnh), bạn có thể thử giảm độ tương phản tông màu bằng cách làm cho màu nền gần với màu văn bản hơn. Đừng quá lo lắng, hãy nhớ đến những người dùng có thị lực kém.

06. Phông chữ web có cần gợi ý không?

Gợi ý là các hướng dẫn đặc biệt liên kết chặt chẽ các đường cong trừu tượng của phông chữ với các pixel trên màn hình. Phần lớn các phông chữ (bao gồm cả phông chữ thương mại) không được gợi ý vì đây là một thủ tục khá tốn công và phức tạp. Gợi ý được thực hiện khác nhau đối với TrueType và PostScript. Nếu bạn lấy phông chữ rẻ tiền, định dạng OTF sẽ an toàn hơn, vì trong TT quy trình vẫn không thay đổi kể từ thời rasterization đen trắng và không hoàn toàn đầy đủ, nhưng đối với PS, quy trình đơn giản hơn và tác giả có cơ hội để làm gợi ý tự động.

Phông chữ không có gợi ý sẽ bị mờ khi rasterized và chiều cao của các chữ cái có thể tăng vọt.

Một mặt, phông chữ có gợi ý khá rõ ràng, tương phản và đồng nhất, nhưng mặt khác, hình dạng chữ bị biến dạng tùy theo kích thước và khoảng cách có thể khác so với thực tế. Các chữ cái hoàn toàn phụ thuộc vào pixel.

Trong HĐH Windows, có lẽ chúng ta thấy cách tiếp cận triệt để nhất: các phông chữ phổ biến như Tahoma, Verdana, Arial và Georgia được gợi ý cụ thể cho GDI ClearType và khi DirectWrite xuất hiện, các phông chữ chính có trong HĐH phải được gợi ý lại và cập nhật.

Không giống như Microsoft, Apple có cách tiếp cận ngược lại, vì vậy hệ điều hành của họ sử dụng các thuật toán cho phép bất kỳ phông chữ nào được hiển thị ít nhiều hiệu quả và gợi ý hoàn toàn không được tính đến.

Để trả lời câu hỏi: kỷ nguyên của màn hình 300DPI đang nhanh chóng đến gần và một số lượng lớn thiết bị di động đã có độ phân giải này và sẽ sớm không cần gợi ý nữa. Nhưng vì Windows vẫn phụ thuộc vào gợi ý và tập trung vào màn hình có độ phân giải thấp, hãy cố gắng chọn phông chữ tiêu chuẩn hoặc gợi ý chất lượng cao cho văn bản, nếu không văn bản sẽ khó đọc và khó hiểu.

07. @font-face hay Cufon?

Dù nghe có vẻ lạ lùng đến đâu thì vẫn có người tự hỏi mình câu hỏi này. Có vẻ như sau khi các trình duyệt bắt đầu hỗ trợ thuộc tính @font-face, tất cả các công nghệ nhúng phông chữ khác (Cufon, sIFR, Flash) dường như trở nên không còn phù hợp. Nhưng một số ý nghĩa vẫn còn tồn tại, chẳng hạn như cách thay thế phông chữ bằng hình ảnh, khi không hiển thị các đường cong vector trên trang web mà chỉ hiển thị một bản in, chẳng hạn như máy in in nó trên một tờ giấy hoặc Photoshop xuất ra JPG không thể chỉnh sửa. Điều này được nhiều giấy phép phông chữ (máy tính để bàn) thông thường cho phép. Một số nhà sản xuất phông chữ (ví dụ: Adobe) cho phép nhúng phông chữ trên máy tính để bàn (trong các chương trình và trên máy chủ), miễn là nó vẫn được bảo vệ và không thể tải xuống. Nếu bạn không thể mua giấy phép web riêng thì bạn có thể sử dụng sIFR thích hợp khi phông chữ được nhúng bằng đối tượng Flash. Điểm bất lợi là nó sử dụng Flash, không phải tất cả các thiết bị đều hỗ trợ. Bạn cũng có thể sử dụng công nghệ Cufon (Canvas được sử dụng) nếu giấy phép cho phép. Tất nhiên, trong trường hợp này, tập lệnh sẽ cồng kềnh và việc chọn văn bản sẽ không hiệu quả, nhưng trong tình huống tuyệt vọng thì nó sẽ có tác dụng.

Nhưng tốt nhất nên sử dụng @font-face, nó vừa tiên tiến hơn về mặt công nghệ, vừa tiện lợi hơn, hơn nữa đã tích lũy đủ kinh nghiệm để làm việc với nó. Nó chỉ có một nhược điểm: không phải tất cả các nhà sản xuất đều cho phép sử dụng phông chữ của họ trên web.

08. Tệp phông chữ nên ở định dạng nào?

Ngày nay, phông chữ được chuẩn bị để triển khai (@font-face) trên trang web phải có nhiều định dạng:

TTF hoặc OTF- một tệp phông chữ quen thuộc với chúng tôi nhưng được tải từ máy chủ khi xem trang web;
WOFF- kho lưu trữ nguồn không được bảo vệ OTF hoặc TTF có lẽ là định dạng quan trọng nhất được hầu hết các trình duyệt phổ biến hỗ trợ và các tệp trong WOFF thường nhẹ hơn 2–2,5 lần so với tệp gốc;
EOT- cần có một kho lưu trữ do TT OpenType triển khai, có cơ chế bảo vệ, để hỗ trợ các trình duyệt Internet Explorer cũ hơn (bắt đầu từ IE8, ngoài các đường cong TrueType, PostScript cũng được hỗ trợ);
SVG- để hỗ trợ trình duyệt Safari.

09. Phông chữ web có thể chuyển đổi được không?


Bất kể mọi người có nói gì với bạn, bạn không thể đơn giản chuyển đổi một tệp và giữ nguyên chất lượng ban đầu của phông chữ, đặc biệt nếu ban đầu nó ở định dạng OpenType. Trong quá trình này, có khả năng mất một số dữ liệu được nhúng trong tệp phông chữ (hướng dẫn đã biên dịch, ký tự bổ sung, số liệu). Bạn sẽ nhận thấy điều này khi tập tin đột nhiên "giảm cân" trong quá trình chuyển đổi; việc chuyển đổi TrueType sang PostScript và ngược lại sẽ đặc biệt không ổn.

Ngoài ra, quá trình chuyển đổi hầu như luôn vi phạm các điều khoản không sửa đổi của giấy phép. Nói một cách đơn giản, điều này cũng giống như hành vi trộm cắp. Khi bạn ném tệp vào trình chuyển đổi, hãy yên tâm rằng nó sẽ không bỏ sót chúng và sẽ đưa ra cảnh báo vì tệp có chứa chữ ký số của nhà sản xuất và các hạn chế sửa đổi tương ứng.

10. Phông chữ web nên nặng bao nhiêu?

Trình duyệt phải tải xuống đầy đủ các tập tin phông chữ trước khi hiển thị trang. Có lẽ bạn đã thấy hiệu ứng “font flash” (hoặc FOUT), khi trong một khoảnh khắc ngắn, thay vì các phông chữ kỳ lạ, các phông chữ hệ thống tiêu chuẩn sẽ nhấp nháy. Sẽ là bình thường nếu TTF (OTF) vừa với 100 kb và WOFF (EOT) vừa với 50 kb. Hãy luôn suy nghĩ xem bạn có cần sử dụng phông chữ tùy chỉnh hay không, ngay cả khi bạn sử dụng nó trong 1 tiêu đề ngắn, bạn vẫn sẽ phải tải xuống toàn bộ tệp phông chữ.
Thiết kế càng hoàn hảo thì các tệp phông chữ có thể nặng càng nhỏ và cố gắng chọn các hình dạng đơn giản. Theo nghĩa này, hình thức lý tưởng là một hình học kỳ cục mở với độ tương phản thấp. Để tăng tốc độ tải phông chữ, việc sử dụng data:uri cũng rất hữu ích.

11. Có thể sử dụng bao nhiêu kiểu phông chữ trên web?

Từ quan điểm của một nhà thiết kế, rất nhiều kiểu chữ rất ngầu. Và thực sự, đối với tiêu đề - In đậm, và ở đằng kia, đối với phần phụ - ExtraLight, chúng ta thường sẽ đẩy các văn bản không cần thiết và nhấn chúng vào In đậm đậm đặc. Đây rồi - sự giàu có thực sự và sự đa dạng về phong cách. Nhưng khi tất cả “của cải” này bắt đầu được chuyển đến trang web, hóa ra mọi thứ diễn ra chậm chạp một cách khủng khiếp. Và tốt hơn hết là đừng cố mở một trang web như vậy từ thiết bị di động. Ngoài ra, đừng quên rằng mỗi kiểu chữ sẽ có giá tiền riêng và rất có thể khách hàng sẽ yêu cầu bạn tìm một phông chữ đồng nghĩa hoặc giảm số lượng kiểu chữ, để không mua hết kiểu chữ đắt tiền. Việc sử dụng tối đa 2-3 kiểu chữ giống nhau hoặc khác nhau là điều bình thường.

12. Có cần thiết phải giới hạn bộ ký tự không?

Câu trả lời cho câu hỏi này phụ thuộc vào loại trang web đó và cách nó sẽ được sử dụng. Các hạn chế có thể hữu ích vì có thể giảm đáng kể kích thước của tệp. Đôi khi, do thiếu hiểu biết, các nhà phát triển tải các tệp phông chữ nặng lên trang web với bộ ký tự đầy đủ và sẽ rất tốt nếu không có chữ tượng hình (lưu ý, phông chữ Arial Unicode chứa hầu hết các ký tự trong bảng Unicode nặng 22 MB).

Đối với những người làm cho các trang web bằng tiếng Anh trở nên dễ dàng nhất, họ không cần phải tải thêm ký tự nào cả, những ký tự bằng tiếng Latin cơ bản (hoặc ASCII) là đủ. Nếu bạn chỉ sử dụng phông chữ cho các tiêu đề bằng tiếng Nga + bao gồm tiếng Anh, thì bộ ASCII (tiếng Latin cơ bản) và 64 ký tự của bảng chữ cái tiếng Nga sẽ là đủ cho bạn; không cần thiết phải tải bộ 420 ký tự Cyrillic Extended . Đó là một câu chuyện hoàn toàn khác nếu trang web của bạn đa ngôn ngữ, trong trường hợp đó, để tránh hiển thị sai các ký tự, bạn cần cố gắng bao gồm tất cả các ngôn ngữ được sử dụng.

13. Tôi có thể sử dụng bản sao phông chữ không?

Sẽ xảy ra trường hợp mua phông chữ gốc quá đắt hoặc thậm chí là không thể, khi đó việc chọn phông chữ đồng nghĩa (bản sao) sẽ là phù hợp. Tất nhiên, bạn không nên mong đợi chất lượng tuyệt vời từ chúng, ngay cả khi chúng được sản xuất bởi một công ty nổi tiếng của Nga. Mọi thứ hoàn toàn tồi tệ khi bạn bắt gặp tác phẩm của một người biết chữ ẩn danh nào đó quyết định thử sức mình trong một lĩnh vực mới, hãy cẩn thận với những phông chữ như vậy. Dưới đây là ví dụ về các bản sao (bản gốc được chỉ định trong ngoặc): FreeSet (Frutiger), Pragmatica và Helios (Helvetica). Xin lưu ý rằng hình dạng chữ cái có thể khác nhau. Có một số lượng lớn các bản sao trong thư mục từ đồng nghĩa phông chữ Paratype.

14. Làm thế nào để kiểm tra phông chữ?

Các nhà thiết kế không quen với việc chỉ nhìn thấy phông chữ qua cửa sổ Photoshop, các biên tập viên đồ họa sử dụng các phương pháp làm mịn văn bản của riêng họ và bạn có thể bị đánh lừa bởi một bức tranh đẹp. Sẽ hữu ích hơn nhiều khi tìm hiểu cách kiểm tra và xem chúng trên trình duyệt. Nếu có trang demo, hãy đảm bảo rằng tất cả các loại tạo tác và đột biến không xuất hiện trong quá trình kết xuất. Ngoài ra còn có một công cụ tên là Typecast, nơi bạn có thể kiểm tra nhiều phông chữ và sau đó hiển thị trang cho khách hàng. Đối với những người chọn phông chữ mới cho một trang web đã hoàn thiện, dịch vụ Web Fonts Previewer là không thể thiếu đối với bạn, bạn có thể thử nghiệm bất kỳ phông chữ nào trên một trang web đang hoạt động, như thể bạn đã triển khai nó.

15. Máy tính của tôi có font chữ thì có thể sử dụng trên website được không?

Đầu tiên, một chút về trộm cắp. Tôi biết rất nhiều nhà thiết kế có hàng nghìn phông chữ trên máy tính của họ mà không ai biết nguồn gốc của chúng. Theo quy định, họ chỉ cần tải nó xuống từ Internet. Nhưng vì lý do nào đó không ai nghĩ rằng việc tạo ra những phông chữ đẹp phải mất hàng tháng, đôi khi hàng năm trời làm việc nghiêm túc! Nhưng đây không phải là lý do duy nhất khiến bạn không nên sử dụng những phông chữ bị sém và lấy không rõ nguồn gốc mà còn vì bạn có thể gặp khó khăn nghiêm trọng ở giai đoạn phát triển.

Nếu bạn muốn nhúng phông chữ đi kèm với hệ điều hành vào trang web của mình, bạn chỉ có thể thực hiện việc này bằng cách phân loại phông chữ đó hoặc sử dụng phông chữ đó trong hình ảnh. Nếu bạn thực sự cần nhúng thì bạn sẽ cần mua một giấy phép riêng, giống như các phông chữ thông thường (cả Georgia và Tahoma đều đang được giảm giá).

16. Làm thế nào để mua phông chữ web?

Khi bạn "mua một phông chữ", điều gần nhất với việc mua phần mềm là bạn nhận được giấy phép sử dụng nó chứ không phải là quyền đối với chính tệp chương trình. Hóa ra tệp phông chữ được biên dịch hợp pháp là một chương trình. Sửa đổi hoặc thay đổi trừ khi được giấy phép cho phép được coi là vi phạm bản quyền.

Một cách thuận tiện để mua phông chữ là thông qua danh mục phông chữ (Fonts.com, MyFonts, Ascender, Typekit). Bạn sẽ có thể xem, so sánh và chọn một trong các tùy chọn có sẵn để sử dụng và thanh toán bằng thẻ. Cách dễ dàng nhất cho các công ty là liên hệ trực tiếp với xưởng sản xuất hoặc để khách hàng mua phông chữ.

Hoặc có lẽ tốt hơn hết là bạn không nên chi tiền cho một phông chữ nào cả? Có rất nhiều phông chữ miễn phí tuyệt vời cũng tốt như những phông chữ trả phí!

17. Có những loại giấy phép nào?

Có nhiều loại giấy phép phông chữ khác nhau và với sự ra đời của phông chữ web, sự đa dạng ngày càng tăng lên. Trong cuộc sống thực, mỗi công ty tự đặt ra các quy tắc của trò chơi và giấy phép phông chữ có thể chứa các tính năng của nhiều loại khác. Chúng tôi sẽ quan tâm đến những cái điển hình.

Giấy phép thương mại thông thường giới hạn việc sử dụng trên một số thiết bị nhất định và cho phép phân phối các tác phẩm được tạo bằng phông chữ. Đây có thể là tạp chí, báo, tờ rơi, danh thiếp, hình ảnh phông chữ được quét - tất cả chúng ta có thể gọi chung là bản in. Giấy phép này không phù hợp cho phim, truyền hình, web và nhúng vào các ứng dụng và chương trình; các quyền đó phải được mua riêng.

Ngoài ra còn có các giấy phép cụ thể, ví dụ: giấy phép có độc quyền. Trong trường hợp này, công ty mua tất cả các quyền từ các nhà thiết kế kiểu chữ và ngay cả tác giả của phông chữ cũng không có quyền sử dụng nó ở bất kỳ đâu. Điều đặc biệt đáng ngạc nhiên khi những phông chữ như vậy có trên torrent hoặc khi một số nhà thiết kế bên thứ ba sử dụng chúng.

Giấy phép miễn phí (miền công cộng) - tác giả của phông chữ cho phép phân phối miễn phí, có hoặc không có điều kiện cho biết tên của mình (Creative Commons) (ví dụ: OFL, GPL, Apache 2.0). Loại giấy phép này thậm chí còn cho phép sử dụng thương mại, ngoài việc bán hàng và phân phối trả phí. Ví dụ: PT Sans, Opensans, Droid. Đôi khi, việc sửa đổi phông chữ được cho phép (GPL), nhưng sửa đổi bạn tạo sẽ tự động kế thừa cùng một giấy phép (có nghĩa là bạn cũng có thể bị phân nhánh). Freedom giả định rằng nó có thể được sử dụng trên bất kỳ phương tiện truyền thông nào, kể cả. và web.
Miễn phí cho mục đích sử dụng phi thương mại - nghĩa là bạn có thể sử dụng nó trong mọi trường hợp bạn không kiếm được tiền từ nó. Ví dụ, để đào tạo, sở thích và các dự án cộng đồng. Đôi khi, các nhà sản xuất cho phép các nhà thiết kế sử dụng với hy vọng rằng khách hàng may mắn của nhà thiết kế sau đó sẽ mua phiên bản thương mại của phông chữ.

18. Giấy phép đối với phông chữ web khác nhau như thế nào?

Giấy phép web là loại giấy phép yêu thích của chúng tôi, chúng bổ sung cho giấy phép chính hoặc được cấp riêng. Quy định một trường hợp đặc biệt - việc sử dụng phông chữ trên các trang web. Theo quy định, hạn chế quan trọng nhất là số lượt xem trang. Ví dụ: 10 nghìn mỗi tháng, 100 nghìn hoặc 1 triệu, tức là càng có nhiều người truy cập trang web của bạn thì bạn càng phải trả nhiều tiền cho giấy phép. Ngoài ra còn có các tùy chọn không giới hạn, khi bạn trả tiền cho phông chữ một lần, nhưng chúng đắt hơn nhiều lần. Chắc hẳn bạn thắc mắc, có ai theo dõi số lượt xem không? Thường thì không. Nhưng đừng quên rằng một số lượng lớn quầy giám sát lưu lượng truy cập trang web của bạn và nếu bạn khơi dậy sự nghi ngờ của người bán, bạn có thể bị mất giấy phép.

Chưa hết, giấy phép web riêng không cho phép sử dụng trên máy tính thông thường. Đôi khi giấy phép web được cấp miễn phí, nghĩa là cùng lúc với việc mua phông chữ trên máy tính để bàn, bạn có quyền sử dụng phiên bản web của nó. Nhưng điều này vẫn còn hiếm, đại đa số các nhà sản xuất đều yêu cầu một khoản phí bổ sung.

Sau khi mua, bạn sẽ nhận được các tệp đặc biệt mà bạn nhúng vào trang web (TTF, OTF, WOFF, EOT) và một số phông chữ không cho phép đặt các tệp này trên trang web ở dạng không được bảo vệ, vì về mặt lý thuyết, các bên thứ ba có thể lấy được chính các tập tin phông chữ. Tùy chọn thứ ba là bạn sử dụng dịch vụ web đặc biệt của nhà sản xuất phông chữ, chẳng hạn như Typekit, thuộc sở hữu của Adobe và trả phí đăng ký.

19. Tôi có thể lấy phông chữ web tốt ở đâu?

Danh mục phông chữ miễn phí từ Google
Fontsquirrel là một thư mục và trình chuyển đổi phông chữ web nổi tiếng
Myfonts - kho phông chữ khổng lồ với hệ thống thanh toán tiện lợi
Fonts.com là đối thủ cạnh tranh chính của MyFonts
Typekit - dịch vụ cho thuê font chữ của Adobe
Typecast - cửa hàng nói trên có dịch vụ thử nghiệm
tái bút Một tài nguyên hữu ích khác được Maria Doreuli đề xuất là WebFont.ru. Cấp phép. Để làm cho nó rõ ràng
Tim Brown. Hiển thị kiểu chữ trên web
Tim Brown. Thuộc tính CSS ảnh hưởng đến kết xuất kiểu
Tim Brown. Kết xuất kiểu: hệ điều hành
Tim Ahrens. Một cái nhìn cận cảnh hơn về kết xuất phông chữ
Tim Ahrens (Bộ đánh máy). Xem xét kỹ hơn về gợi ý TrueType
Lợi ích của OpenType/CFF so với TrueType

Ildar Kinyabulatov, nhà thiết kế web ADV/kỹ thuật web

Thông báo

Định dạng tệp linh tinh OTF

Tệp OTF thường được liên kết với phông chữ máy tính. Nó được phát triển bởi Adobe và Microsoft. Nó được giới thiệu lần đầu tiên trong Mac OS X và Windows 2000. Định dạng phông chữ OpenType này tương tự như định dạng TTF (Phông chữ TrueType). Điều phân biệt định dạng OTF với các định dạng phông chữ khác là nó có khả năng mở rộng.

Thông tin kỹ thuật về file OTF

Tương tự như các tệp phông chữ TrueType, định dạng OTF cũng chứa các đặc điểm của định dạng PostScript phổ biến không kém, khiến nó trở thành định dạng phông chữ duy nhất kết hợp các đặc điểm của các định dạng trên. Các tệp OTF có một số ưu điểm chính. Chúng hoàn toàn có thể mở rộng, tức là kích thước phông chữ có thể được thay đổi mà không làm giảm chất lượng. Ngoài ra, chúng còn chứa một dòng mới cũng như các bố cục kiểu chữ với công nghệ TrueType và PostScript đã được biết đến.

Thông tin bổ sung về định dạng OTF

Xin chào, Habr!

Hàng núi bài viết đã được viết mô tả các khía cạnh khác nhau khi làm việc với phông chữ web, nhiều ví dụ hoạt động đã được thu thập, nhưng hàng ngày chúng ta vẫn tiếp tục phải đối mặt với sự hiểu lầm cơ bản về phông chữ web là gì. Không phải ai cũng có thời gian tìm kiếm tài liệu trên Google về chủ đề này, vì vậy tôi đã cố gắng đưa ra câu trả lời cho các câu hỏi thường gặp. Tài liệu này sẽ được quan tâm chủ yếu bởi những người chưa đi sâu vào sự phức tạp của công nghệ phông chữ.

01. Tại sao chúng ta lại cần phông chữ web mà không phải phông chữ tiêu chuẩn?

Điều đầu tiên bạn nghĩ đến là các phông chữ tiêu chuẩn cực kỳ nhàm chán và thật khó để làm điều gì đó nguyên bản với sự trợ giúp của chúng. Theo quy định, hầu hết chúng đều mang đến sự u sầu và chán nản không chỉ cho người dùng mà còn cho cả những người thiết kế web. Trong trường hợp này, các phông chữ không chuẩn có tính biểu cảm cao hơn và ngoài ra, chúng có nhiều mức độ lớn hơn nên có rất nhiều lựa chọn. Hơn nữa, phông chữ là một phần không thể thiếu của thương hiệu, vì vậy mọi công ty đều cố gắng sử dụng nó một cách tích cực hơn vì cơ hội kỹ thuật như vậy đã xuất hiện.

Và người ta hoàn toàn có thể từ bỏ các phông chữ tiêu chuẩn, đặc biệt là vì nhiều hệ điều hành di động không hỗ trợ chúng (ví dụ: Arial, Taһoma, Verdana và Georgia). Tuy nhiên, thật không may, ngành công nghiệp, trong nhiều năm đã được điều chỉnh thành 96 màn hình dpi và Georgia verdans, vẫn chưa hoàn toàn sẵn sàng cho những thay đổi nhanh chóng và trên các hệ điều hành Windows cũ hơn vẫn có vấn đề với việc hiển thị phông chữ không chuẩn do đặc thù của cơ chế rasterization

02. Làm thế nào để chọn được font chữ web tốt?

Phông chữ không chỉ là một tập hợp các chữ cái được số hóa được tạo bằng bút vẽ trên giấy hoặc trong Illustrator, nó còn được tinh chỉnh và đánh bóng 98%, gợi ý và thử nghiệm trên nhiều phương tiện khác nhau và ở các kích cỡ khác nhau. Phông chữ này trông đẹp, kiểu dáng bóng bẩy, sẽ không có vấn đề gì với nó dù trên máy in hay trên màn hình, nó toát lên chất lượng tốt.

Tuy nhiên, khi chọn phông chữ, điều này thậm chí không phải là điều quan trọng hơn nhiều mà là sự phù hợp và tuân thủ của phông chữ với phương pháp sử dụng và nhiệm vụ được giao cho nó. Nếu bạn làm việc với phông chữ, bạn cần hiểu mọi thứ hoạt động như thế nào những công nghệ nào được sử dụng. Điều này sẽ giúp bạn không ghi nhớ trong đầu một loạt các quy tắc ghi nhớ khó hiểu, được ghi lại một cách phù hợp và bắt đầu. Ví dụ, mọi nhà in có lòng tự trọng đều biết lý do tại sao không nên sử dụng phông chữ TrueType để in offset, phông chữ nào có thể được sử dụng làm phông chữ văn bản và phông chữ nào - chỉ dành cho tiêu đề hoặc chỉ mục. Nếu anh ta không biết điều này, thì anh ta sẽ phải in lại một lượng lớn bản in, và những bất ngờ và vấn đề liên tục sẽ chờ đợi anh ta tại nơi làm việc. Thật ngạc nhiên là tại sao không ai đưa ra bất kỳ yêu cầu nào đối với các nhà thiết kế web.

03. Trình duyệt hiển thị phông chữ như thế nào?

Tôi thường nghe nói rằng các trình duyệt tự vẽ phông chữ nên chúng trông khác nhau ở mọi nơi. Nhưng trên thực tế, một hệ thống con đồ họa đặc biệt của HĐH tham gia vào việc hiển thị phông chữ: trong Windows, điều này GDI hoặc Viết trực tiếp và trên OS X và iOS - Văn bản lõi(và trước đây là QuickDraw). Có 3 cơ chế rasterization (render) phông chữ phổ biến: pixel hai màu (đen và trắng), pixel đơn sắc (thường được gọi là khử răng cưa hoặc khử răng cưa thông thường) và pixel phụ. Subpixel sử dụng tính năng của màn hình LCD và plasma, trong đó mỗi pixel được chia thành 3 phần (đỏ, lục và lam), nhằm tăng độ phân giải ngang của hình ảnh được hiển thị và cải thiện độ rõ nét.

Tuy nhiên, các trình duyệt chọn phương thức hiển thị của riêng chúng từ các phương thức do HĐH cung cấp. Ví dụ: GDI có 3 tùy chọn hiển thị: đen trắng, khử răng cưa thông thường và subpixel Loại rõ ràng. Điểm đặc biệt của cái sau là việc làm mịn chỉ xảy ra theo chiều ngang, phù hợp với vị trí của các pixel phụ. Đây chính là lý do tại sao chúng ta thường thấy hiện tượng răng cưa khủng khiếp ở các nét ngang và chéo của phông chữ khi sử dụng. May mắn thay, Microsoft bắt đầu dần dần cải thiện cơ chế này và GDI đã được thay thế bằng công nghệ DirectWrite, công nghệ này đã đưa ra tính năng khử răng cưa dọc. So sánh:

04. TTF hay OTF?

TrueType và PostScript ban đầu là các định dạng phông chữ khác nhau. TrueType sử dụng đường cong Bezier bậc hai, trong khi PostScript sử dụng đường cong bậc ba, vốn quen thuộc với các nhà thiết kế làm việc trong Illustrator và Photoshop. Ngày nay, cả hai phương pháp mô tả đường cong đều được sử dụng như một phần của cùng một định dạng OpenType, với điểm khác biệt duy nhất là tệp TrueType có phần mở rộng TTF và tệp PostScript có phần mở rộng OTF. Mỗi công nghệ đều có những tính năng gợi ý riêng và ứng dụng cụ thể.

Nhìn vào bức tranh. Nếu phông chữ TrueType dễ đọc hơn nhiều ở kích thước nhỏ, nhưng ở kích thước lớn, chúng ta thấy những nét đặc trưng, ​​thì đối với phông chữ PostScript, mọi thứ hoàn toàn ngược lại. Điều này là do các trình duyệt chọn các phương pháp rasterization khác nhau cho PS và TT. Đối với PS, trình duyệt áp dụng khử răng cưa đơn sắc thông thường và TT được xử lý bằng ClearType. Vì vậy, hóa ra TrueType sẽ thích hợp hơn cho phông chữ văn bản và PostScript tốt hơn cho các tiêu đề và dòng chữ lớn.

Chúng tôi cũng thấy rằng không phải tất cả các trình duyệt đều sử dụng DirectWrite. Vì vậy, nó vẫn không có trong Google Chrome.

05. Điều gì khác ảnh hưởng đến màn hình?

Đôi khi tốt hơn là đặt phương pháp rasterization theo cách thủ công. Ví dụ: trong các trình duyệt có công cụ Webkit, bạn có thể sử dụng thuộc tính CSS - làm mịn phông chữ webkit và kích hoạt khử răng cưa thông thường theo cách thủ công thay vì khử răng cưa pixel phụ và ngược lại. Ngoài ra còn có những cách không hề tầm thường để khiến trình duyệt thay đổi phương pháp rasterization; trên Habré, họ từng đề xuất sử dụng một bản hack với text-shadow .

Chúng ta không được quên về cỡ chữ (font-size). Hình dạng đường viền, độ tương phản nét vẽ và khả năng đọc có thể khác nhau rất nhiều giữa các kích thước phông chữ. Đặt trình chỉnh sửa đồ họa xuống và xem phông chữ web trông như thế nào trong trình duyệt, trong chiến đấu.

Một cách khác để giảm thiểu những thiếu sót của khử răng cưa là thông qua quản lý màu sắc và độ tương phản. Để giảm hiệu ứng của đường viền màu (khi sử dụng ClearType, các đường viền màu vàng và đỏ tươi xuất hiện xung quanh các cạnh), bạn có thể thử giảm độ tương phản tông màu bằng cách làm cho màu nền gần với màu văn bản hơn. Đừng quá lo lắng, hãy nhớ đến những người dùng có thị lực kém.

06. Phông chữ web có cần gợi ý không?

Gợi ý là các hướng dẫn đặc biệt liên kết chặt chẽ các đường cong trừu tượng của phông chữ với các pixel trên màn hình. Phần lớn các phông chữ (bao gồm cả phông chữ thương mại) không được gợi ý vì đây là một thủ tục khá tốn công và phức tạp. Gợi ý được thực hiện khác nhau đối với TrueType và PostScript. Nếu bạn lấy phông chữ rẻ tiền, định dạng OTF sẽ an toàn hơn, vì trong TT quy trình vẫn không thay đổi kể từ thời rasterization đen trắng và không hoàn toàn đầy đủ, nhưng đối với PS, quy trình đơn giản hơn và tác giả có cơ hội để làm gợi ý tự động.

Phông chữ không có gợi ý sẽ bị mờ khi rasterized và chiều cao của các chữ cái có thể tăng vọt.

Một mặt, phông chữ có gợi ý khá rõ ràng, tương phản và đồng nhất, nhưng mặt khác, hình dạng chữ bị biến dạng tùy theo kích thước và khoảng cách có thể khác so với thực tế. Các chữ cái hoàn toàn phụ thuộc vào pixel.

Trong HĐH Windows, có lẽ chúng ta thấy cách tiếp cận triệt để nhất: các phông chữ phổ biến như Tahoma, Verdana, Arial và Georgia được gợi ý cụ thể cho GDI ClearType và khi DirectWrite xuất hiện, các phông chữ chính có trong HĐH phải được gợi ý lại và cập nhật.

Không giống như Microsoft, Apple có cách tiếp cận ngược lại, vì vậy hệ điều hành của họ sử dụng các thuật toán cho phép bất kỳ phông chữ nào được hiển thị ít nhiều hiệu quả và gợi ý hoàn toàn không được tính đến.

Để trả lời câu hỏi: kỷ nguyên của màn hình 300DPI đang nhanh chóng đến gần và một số lượng lớn thiết bị di động đã có độ phân giải này và sẽ sớm không cần gợi ý nữa. Nhưng vì Windows vẫn phụ thuộc vào gợi ý và tập trung vào màn hình có độ phân giải thấp, hãy cố gắng chọn phông chữ tiêu chuẩn hoặc gợi ý chất lượng cao cho văn bản, nếu không văn bản sẽ khó đọc và khó hiểu.

07. @font-face hay Cufon?

Dù nghe có vẻ lạ lùng đến đâu thì vẫn có người tự hỏi mình câu hỏi này. Có vẻ như sau khi các trình duyệt bắt đầu hỗ trợ thuộc tính @font-face, tất cả các công nghệ nhúng phông chữ khác (Cufon, sIFR, Flash) dường như trở nên không còn phù hợp. Nhưng một số ý nghĩa vẫn còn tồn tại, chẳng hạn như cách thay thế phông chữ bằng hình ảnh, khi không hiển thị các đường cong vector trên trang web mà chỉ hiển thị một bản in, chẳng hạn như máy in in nó trên một tờ giấy hoặc Photoshop xuất ra JPG không thể chỉnh sửa. Điều này được nhiều giấy phép phông chữ (máy tính để bàn) thông thường cho phép. Một số nhà sản xuất phông chữ (ví dụ: Adobe) cho phép nhúng phông chữ trên máy tính để bàn (trong các chương trình và trên máy chủ), miễn là nó vẫn được bảo vệ và không thể tải xuống. Nếu bạn không thể mua giấy phép web riêng thì bạn có thể sử dụng sIFR thích hợp khi phông chữ được nhúng bằng đối tượng Flash. Điểm bất lợi là nó sử dụng Flash, không phải tất cả các thiết bị đều hỗ trợ. Bạn cũng có thể sử dụng công nghệ Cufon (Canvas được sử dụng) nếu giấy phép cho phép. Tất nhiên, trong trường hợp này, tập lệnh sẽ cồng kềnh và việc chọn văn bản sẽ không hiệu quả, nhưng trong tình huống tuyệt vọng thì nó sẽ có tác dụng.

Nhưng tốt nhất nên sử dụng @font-face, nó vừa tiên tiến hơn về mặt công nghệ, vừa tiện lợi hơn, hơn nữa đã tích lũy đủ kinh nghiệm để làm việc với nó. Nó chỉ có một nhược điểm: không phải tất cả các nhà sản xuất đều cho phép sử dụng phông chữ của họ trên web.

08. Tệp phông chữ nên ở định dạng nào?

Ngày nay, phông chữ được chuẩn bị để triển khai (@font-face) trên trang web phải có nhiều định dạng:

TTF hoặc OTF- một tệp phông chữ quen thuộc với chúng tôi nhưng được tải từ máy chủ khi xem trang web;
WOFF- kho lưu trữ nguồn không được bảo vệ OTF hoặc TTF có lẽ là định dạng quan trọng nhất được hầu hết các trình duyệt phổ biến hỗ trợ và các tệp trong WOFF thường nhẹ hơn 2–2,5 lần so với tệp gốc;
EOT- cần có một kho lưu trữ do TT OpenType triển khai, có cơ chế bảo vệ, để hỗ trợ các trình duyệt Internet Explorer cũ hơn (bắt đầu từ IE8, ngoài các đường cong TrueType, PostScript cũng được hỗ trợ);
SVG- để hỗ trợ trình duyệt Safari.

09. Phông chữ web có thể chuyển đổi được không?


Bất kể mọi người có nói gì với bạn, bạn không thể đơn giản chuyển đổi một tệp và giữ nguyên chất lượng ban đầu của phông chữ, đặc biệt nếu ban đầu nó ở định dạng OpenType. Trong quá trình này, có khả năng mất một số dữ liệu được nhúng trong tệp phông chữ (hướng dẫn đã biên dịch, ký tự bổ sung, số liệu). Bạn sẽ nhận thấy điều này khi tập tin đột nhiên "giảm cân" trong quá trình chuyển đổi; việc chuyển đổi TrueType sang PostScript và ngược lại sẽ đặc biệt không ổn.

Ngoài ra, quá trình chuyển đổi hầu như luôn vi phạm các điều khoản không sửa đổi của giấy phép. Nói một cách đơn giản, điều này cũng giống như hành vi trộm cắp. Khi bạn ném tệp vào trình chuyển đổi, hãy yên tâm rằng nó sẽ không bỏ sót chúng và sẽ đưa ra cảnh báo vì tệp có chứa chữ ký số của nhà sản xuất và các hạn chế sửa đổi tương ứng.

10. Phông chữ web nên nặng bao nhiêu?

Trình duyệt phải tải xuống đầy đủ các tập tin phông chữ trước khi hiển thị trang. Có lẽ bạn đã thấy hiệu ứng “font flash” (hoặc FOUT), khi trong một khoảnh khắc ngắn, thay vì các phông chữ kỳ lạ, các phông chữ hệ thống tiêu chuẩn sẽ nhấp nháy. Sẽ là bình thường nếu TTF (OTF) vừa với 100 kb và WOFF (EOT) vừa với 50 kb. Hãy luôn suy nghĩ xem bạn có cần sử dụng phông chữ tùy chỉnh hay không, ngay cả khi bạn sử dụng nó trong 1 tiêu đề ngắn, bạn vẫn sẽ phải tải xuống toàn bộ tệp phông chữ.
Thiết kế càng hoàn hảo thì các tệp phông chữ có thể nặng càng nhỏ và cố gắng chọn các hình dạng đơn giản. Theo nghĩa này, hình thức lý tưởng là một hình học kỳ cục mở với độ tương phản thấp. Để tăng tốc độ tải phông chữ, việc đưa nó vào tệp kiểu bằng cách sử dụng data:uri cũng có thể hữu ích.

11. Có thể sử dụng bao nhiêu kiểu phông chữ trên web?

Từ quan điểm của một nhà thiết kế, rất nhiều kiểu chữ rất ngầu. Và thực sự, đối với tiêu đề - In đậm, và ở đằng kia, đối với phần phụ - ExtraLight, chúng ta thường sẽ đẩy các văn bản không cần thiết và nhấn chúng vào In đậm đậm đặc. Đây rồi - sự giàu có thực sự và sự đa dạng về phong cách. Nhưng khi tất cả “của cải” này bắt đầu được chuyển đến trang web, hóa ra mọi thứ diễn ra chậm chạp một cách khủng khiếp. Và tốt hơn hết là đừng cố mở một trang web như vậy từ thiết bị di động. Ngoài ra, đừng quên rằng mỗi kiểu chữ sẽ có giá tiền riêng và rất có thể khách hàng sẽ yêu cầu bạn tìm một phông chữ đồng nghĩa hoặc giảm số lượng kiểu chữ, để không mua hết kiểu chữ đắt tiền. Việc sử dụng tối đa 2-3 kiểu chữ giống nhau hoặc khác nhau là điều bình thường.

12. Có cần thiết phải giới hạn bộ ký tự không?

Câu trả lời cho câu hỏi này phụ thuộc vào loại trang web đó và cách nó sẽ được sử dụng. Các hạn chế có thể hữu ích vì có thể giảm đáng kể kích thước của tệp. Đôi khi, do thiếu hiểu biết, các nhà phát triển tải các tệp phông chữ nặng lên trang web với bộ ký tự đầy đủ và sẽ rất tốt nếu không có chữ tượng hình (lưu ý, phông chữ Arial Unicode chứa hầu hết các ký tự trong bảng Unicode nặng 22 MB).

Đối với những người làm cho các trang web bằng tiếng Anh trở nên dễ dàng nhất, họ không cần phải tải thêm ký tự nào cả, những ký tự bằng tiếng Latin cơ bản (hoặc ASCII) là đủ. Nếu bạn chỉ sử dụng phông chữ cho các tiêu đề bằng tiếng Nga + bao gồm tiếng Anh, thì bộ ASCII (tiếng Latin cơ bản) và 64 ký tự của bảng chữ cái tiếng Nga sẽ là đủ cho bạn; không cần thiết phải tải bộ 420 ký tự Cyrillic Extended . Đó là một câu chuyện hoàn toàn khác nếu trang web của bạn đa ngôn ngữ, trong trường hợp đó, để tránh hiển thị sai các ký tự, bạn cần cố gắng bao gồm tất cả các ngôn ngữ được sử dụng.

13. Tôi có thể sử dụng bản sao phông chữ không?

Sẽ xảy ra trường hợp mua phông chữ gốc quá đắt hoặc thậm chí là không thể, khi đó việc chọn phông chữ đồng nghĩa (bản sao) sẽ là phù hợp. Tất nhiên, bạn không nên mong đợi chất lượng tuyệt vời từ chúng, ngay cả khi chúng được sản xuất bởi một công ty nổi tiếng của Nga. Mọi thứ hoàn toàn tồi tệ khi bạn bắt gặp tác phẩm của một người biết chữ ẩn danh nào đó quyết định thử sức mình trong một lĩnh vực mới, hãy cẩn thận với những phông chữ như vậy. Dưới đây là ví dụ về các bản sao (bản gốc được chỉ định trong ngoặc): FreeSet (Frutiger), Pragmatica và Helios (Helvetica). Xin lưu ý rằng hình dạng chữ cái có thể khác nhau. Có một số lượng lớn các bản sao trong thư mục từ đồng nghĩa phông chữ Paratype.

14. Làm thế nào để kiểm tra phông chữ?

Các nhà thiết kế không quen với việc chỉ nhìn thấy phông chữ qua cửa sổ Photoshop, các biên tập viên đồ họa sử dụng các phương pháp làm mịn văn bản của riêng họ và bạn có thể bị đánh lừa bởi một bức tranh đẹp. Sẽ hữu ích hơn nhiều khi tìm hiểu cách kiểm tra và xem chúng trên trình duyệt. Nếu có trang demo, hãy đảm bảo rằng tất cả các loại tạo tác và đột biến không xuất hiện trong quá trình kết xuất. Ngoài ra còn có một công cụ tên là Typecast, nơi bạn có thể kiểm tra nhiều phông chữ và sau đó hiển thị trang cho khách hàng. Đối với những người chọn phông chữ mới cho một trang web đã hoàn thiện, dịch vụ Web Fonts Previewer là không thể thiếu đối với bạn, bạn có thể thử nghiệm bất kỳ phông chữ nào trên một trang web đang hoạt động, như thể bạn đã triển khai nó.

15. Máy tính của tôi có font chữ thì có thể sử dụng trên website được không?

Đầu tiên, một chút về trộm cắp. Tôi biết rất nhiều nhà thiết kế có hàng nghìn phông chữ trên máy tính của họ mà không ai biết nguồn gốc của chúng. Theo quy định, họ chỉ cần tải nó xuống từ Internet. Nhưng vì lý do nào đó không ai nghĩ rằng việc tạo ra những phông chữ đẹp phải mất hàng tháng, đôi khi hàng năm trời làm việc nghiêm túc! Nhưng đây không phải là lý do duy nhất khiến bạn không nên sử dụng những phông chữ bị sém và lấy không rõ nguồn gốc mà còn vì bạn có thể gặp khó khăn nghiêm trọng ở giai đoạn phát triển.

Nếu bạn muốn nhúng phông chữ đi kèm với hệ điều hành vào trang web của mình, bạn chỉ có thể thực hiện việc này bằng cách phân loại phông chữ đó hoặc sử dụng phông chữ đó trong hình ảnh. Nếu bạn thực sự cần nhúng thì bạn sẽ cần mua một giấy phép riêng, giống như các phông chữ thông thường (cả Georgia và Tahoma đều đang được giảm giá).

16. Làm thế nào để mua phông chữ web?

Khi bạn "mua một phông chữ", điều gần nhất với việc mua phần mềm là bạn nhận được giấy phép sử dụng nó chứ không phải là quyền đối với chính tệp chương trình. Hóa ra tệp phông chữ được biên dịch hợp pháp là một chương trình. Sửa đổi hoặc thay đổi trừ khi được giấy phép cho phép được coi là vi phạm bản quyền.

Một cách thuận tiện để mua phông chữ là thông qua danh mục phông chữ (Fonts.com, MyFonts, Ascender, Typekit). Bạn sẽ có thể xem, so sánh và chọn một trong các tùy chọn có sẵn để sử dụng và thanh toán bằng thẻ. Cách dễ dàng nhất cho các công ty là liên hệ trực tiếp với xưởng sản xuất hoặc để khách hàng mua phông chữ.

Hoặc có lẽ tốt hơn hết là bạn không nên chi tiền cho một phông chữ nào cả? Có rất nhiều phông chữ miễn phí tuyệt vời cũng tốt như những phông chữ trả phí!

17. Có những loại giấy phép nào?

Có nhiều loại giấy phép phông chữ khác nhau và với sự ra đời của phông chữ web, sự đa dạng ngày càng tăng lên. Trong cuộc sống thực, mỗi công ty tự đặt ra các quy tắc của trò chơi và giấy phép phông chữ có thể chứa các tính năng của nhiều loại khác. Chúng tôi sẽ quan tâm đến những cái điển hình.

Giấy phép thương mại thông thường giới hạn việc sử dụng trên một số thiết bị nhất định và cho phép phân phối các tác phẩm được tạo bằng phông chữ. Đây có thể là tạp chí, báo, tờ rơi, danh thiếp, hình ảnh phông chữ được quét - tất cả chúng ta có thể gọi chung là bản in. Giấy phép này không phù hợp cho phim, truyền hình, web và nhúng vào các ứng dụng và chương trình; các quyền đó phải được mua riêng.

Ngoài ra còn có các giấy phép cụ thể, ví dụ: giấy phép có độc quyền. Trong trường hợp này, công ty mua tất cả các quyền từ các nhà thiết kế kiểu chữ và ngay cả tác giả của phông chữ cũng không có quyền sử dụng nó ở bất kỳ đâu. Điều đặc biệt đáng ngạc nhiên khi những phông chữ như vậy có trên torrent hoặc khi một số nhà thiết kế bên thứ ba sử dụng chúng.

Giấy phép miễn phí (miền công cộng) - tác giả của phông chữ cho phép phân phối miễn phí, có hoặc không có điều kiện cho biết tên của mình (Creative Commons) (ví dụ: OFL, GPL, Apache 2.0). Loại giấy phép này thậm chí còn cho phép sử dụng thương mại, ngoài việc bán hàng và phân phối trả phí. Ví dụ: PT Sans, Opensans, Droid. Đôi khi, việc sửa đổi phông chữ được cho phép (GPL), nhưng sửa đổi bạn tạo sẽ tự động kế thừa cùng một giấy phép (có nghĩa là bạn cũng có thể bị phân nhánh). Freedom giả định rằng nó có thể được sử dụng trên bất kỳ phương tiện truyền thông nào, kể cả. và web.
Miễn phí cho mục đích sử dụng phi thương mại - nghĩa là bạn có thể sử dụng nó trong mọi trường hợp bạn không kiếm được tiền từ nó. Ví dụ, để đào tạo, sở thích và các dự án cộng đồng. Đôi khi, các nhà sản xuất cho phép các nhà thiết kế sử dụng với hy vọng rằng khách hàng may mắn của nhà thiết kế sau đó sẽ mua phiên bản thương mại của phông chữ.

18. Giấy phép đối với phông chữ web khác nhau như thế nào?

Giấy phép web là loại giấy phép yêu thích của chúng tôi, chúng bổ sung cho giấy phép chính hoặc được cấp riêng. Quy định một trường hợp đặc biệt - việc sử dụng phông chữ trên các trang web. Theo quy định, hạn chế quan trọng nhất là số lượt xem trang. Ví dụ: 10 nghìn mỗi tháng, 100 nghìn hoặc 1 triệu, tức là càng có nhiều người truy cập trang web của bạn thì bạn càng phải trả nhiều tiền cho giấy phép. Ngoài ra còn có các tùy chọn không giới hạn, khi bạn trả tiền cho phông chữ một lần, nhưng chúng đắt hơn nhiều lần. Chắc hẳn bạn thắc mắc, có ai theo dõi số lượt xem không? Thường thì không. Nhưng đừng quên rằng một số lượng lớn quầy giám sát lưu lượng truy cập trang web của bạn và nếu bạn khơi dậy sự nghi ngờ của người bán, bạn có thể bị mất giấy phép.

Chưa hết, giấy phép web riêng không cho phép sử dụng trên máy tính thông thường. Đôi khi giấy phép web được cấp miễn phí, nghĩa là cùng lúc với việc mua phông chữ trên máy tính để bàn, bạn có quyền sử dụng phiên bản web của nó. Nhưng điều này vẫn còn hiếm, đại đa số các nhà sản xuất đều yêu cầu một khoản phí bổ sung.

Sau khi mua, bạn sẽ nhận được các tệp đặc biệt mà bạn nhúng vào trang web (TTF, OTF, WOFF, EOT) và một số phông chữ không cho phép đặt các tệp này trên trang web ở dạng không được bảo vệ, vì về mặt lý thuyết, các bên thứ ba có thể lấy được chính các tập tin phông chữ. Tùy chọn thứ ba là bạn sử dụng dịch vụ web đặc biệt của nhà sản xuất phông chữ, chẳng hạn như Typekit, thuộc sở hữu của Adobe và trả phí đăng ký.

19. Tôi có thể lấy phông chữ web tốt ở đâu?

Danh mục phông chữ miễn phí từ Google
Fontsquirrel là một thư mục và trình chuyển đổi phông chữ web nổi tiếng
Myfonts - kho phông chữ khổng lồ với hệ thống thanh toán tiện lợi
Fonts.com là đối thủ cạnh tranh chính của MyFonts
Typekit - dịch vụ cho thuê font chữ của Adobe
Typecast - cửa hàng nói trên có dịch vụ thử nghiệm
tái bút một tài nguyên hữu ích khác được ilyaerin đề xuất, WebFont.ru Chức năng trên biểu mẫu: thiết kế cho người đọc
Maria Doreuli. Cấp phép. Để làm cho nó rõ ràng
Tim Brown. Hiển thị kiểu chữ trên web
Tim Brown. Thuộc tính CSS ảnh hưởng đến kết xuất kiểu
Tim Brown. Kết xuất kiểu: hệ điều hành
Tim Ahrens. Một cái nhìn cận cảnh hơn về kết xuất phông chữ
Tim Ahrens (Bộ đánh máy). Xem xét kỹ hơn về gợi ý TrueType
Lợi ích của OpenType/CFF so với TrueType

Ildar Kinyabulatov, nhà thiết kế web ADV/kỹ thuật web

Phần mở rộng tệp .otf được sử dụng làm tệp phông chữ OpenType trong đó loại phông chữ này được phát triển bởi Adobe và Microsoft. Nó là sự kết hợp của các định dạng phông chữ như TrueType và hậu tố. Ngoài việc là một loại tệp phông chữ, phần mở rộng tệp .otf còn được sử dụng làm tệp mẫu, đó là tệp nào? Bạn sử dụng Bảng tính OpenOffice để tạo công thức. Các tệp mẫu .otf này rất hữu ích vì chúng tự động điền vào bảng tính bằng công thức. Phần mở rộng tệp này cũng được sử dụng làm tệp Thiết kế Tufting OpenTuft và nó đề cập đến các định dạng được sử dụng để tạo các thiết kế phế liệu. Các tệp .otf này cho phép bạn dệt các thiết kế thành nhiều loại vải khác nhau. Các tệp này cũng chứa sợi, vị trí cửa sổ và thông tin về độ dài búi. Định dạng .otf này đã được NedGraphics sử dụng cho gói thiết kế của họ nhưng đã bị thay đổi do có xung đột với phần mở rộng tệp .otf được sử dụng làm phông chữ OpenType. Các ứng dụng khác được liên kết với phần mở rộng tệp .otf là Blu-Ray và OnkoS.

Phần mở rộng tập tin không
Danh mục tệp
Tệp ví dụ (2,91 KiB)
Các chương trình liên quan Trình xem phông chữ AMP (Windows)
Sách phông chữ Apple (MAC)
FontForge (Windows, MAC & Linux)
Trình xem phông chữ Microsoft Windows (Windows)