Джерело
Дивовижний світ веброзробки | Довге тире — вигадка ШІ?Правильна пунктуація існує не один рік. І в ко...
2 290 Охват/переглядів
2026-01-30 08:05
Повідомлення №313
Довге тире — вигадка ШІ?
Правильна пунктуація існує не один рік. І в компʼютерній типографіці теж. Ба більше, існує великий набір символів, які є прямими відповідниками типографіки друкарської. І різновиди тире — лише верхівка айсбергу. HTML так само підтримує різноманітний набір символів, до того ж у різний спосіб. От ви знали, що існує більше одного пробіла? Чи що існує спеціальний символ мінуса? І ділення? І множення? Я свого часу теж не знав, але колись мені довелось трошки попрацювати в друкарстві, і з тих пір я ніколи не ставлю дефіс замість тире. В HTML існує ціла група спеціальних послідовностей для відображення таких символів. Називаються вони HTML Character Entities. Поділяються вони на іменовані, наприклад < (<), та числові, виражені через десяткові коди — Æ (Æ). Деякі символи мають обидва представлення, інші ж — лише DEC-запис. Звичайно, ви можете використовувати й безпосередньо самі символи прямо в розмітці, але є кілька «але». Деякі з них, як от <, є керуючими символами самого HTML, і можуть зламати розмітку. Або ж, якщо раптом ваш документ декодується не в UTF-8, символ може просто не відобразитись. А використання HTML-сутності гарантує, що бравзер покаже його незалежно від таблиці кодування (якщо документ взагалі парситься). HTML має багато спільного з друкарською типографікою. Наприклад, існує нерозривний пробіл , який не дозволяє розрив рядка в цьому місці. Я досить часто використовую його у верстці, особливо там, де є довге тире. За правилами типографіки, довге тире не має знаходитися на початку рядка, якщо це не початок прямої мови або маркер списку. І послідовність слово —, або ще краще слово —, примушує бравзер правильно рендерити текст, щоб тире не переносилося на новий рядок. А ще є вузький пробіл, половинний, широкий, фіксований та «волосяний». Вони мають різну ширину і використовуються в різних ситуаціях для покращення візуального сприйняття тексту. Звідки вони усі пішли? Та з друкарства. Нагадаю, що довгий час друкарська матриця збиралася вручну з відливків з карбованими літерами, і довжина рядка регулювалася так само вручну. І різні пробіли — це по факту різної ширини залізячки, які вставлялися поміж літер. Лапок також існує велика кількість. І, що цікаво, деякі символи, які візуально нагадують лапки, ними не є. Наприклад, ″ — це не лапки, а подвійний штрих (″), який використовується для позначення координат на кшталт 50° 45′ 30″. Так само для трикрапки на письмі існує… трикрапка — окремий символ …. Ну і математика, куди ж без неї. Так, мінус — це не дефіс, а цілком собі мінус «−» (−), як от тут: «−15%». Для позначення нерівності варто використовувати символ ≠ (≠), а множення позначати символом × (×), а не астериском *. Якщо вже повернутися до тире, то зазвичай на письмі використовується два: довге «—» (—) та коротке «–» (–), яке використовується для позначення діапазонів. Тож записати, до прикладу, «девʼять чи десять» правильно можна ось так: «9–10», а не «9-10». Найпростіше ці символи вводити на Mac, адже там у стандартної клавіатури є спеціальний набір комбінацій саме для друкарських символів. На Windows з цим трохи сумніше — або користуватися Alt-послідовностями з «бухгалтерської» цифрової клавіатури, або ставити сторонні рішення. На мобільних з цим теж немає проблем — позатискайте різні кнопки на клавіатурі. Це дуже цікава вправа, яка покаже вам, скільки цікавих символів є у вашому розпорядженні. Ну а при верстці в HTML найнадійніший спосіб зробити ваші тексти гарними та типографськи правильними — це використовувати HTML Entities. Гарно оформлений текст і читається і сприймається набагато краще, навіть якщо це коротке повідомлення в месенджері.Що почитати:
Technical Web Typography: Guidelines and TechniquesЩо почитати душнілам:
WHATWG — Named character references***@babichdev
Правильна пунктуація існує не один рік. І в компʼютерній типографіці теж. Ба більше, існує великий набір символів, які є прямими відповідниками типографіки друкарської. І різновиди тире — лише верхівка айсбергу. HTML так само підтримує різноманітний набір символів, до того ж у різний спосіб. От ви знали, що існує більше одного пробіла? Чи що існує спеціальний символ мінуса? І ділення? І множення? Я свого часу теж не знав, але колись мені довелось трошки попрацювати в друкарстві, і з тих пір я ніколи не ставлю дефіс замість тире. В HTML існує ціла група спеціальних послідовностей для відображення таких символів. Називаються вони HTML Character Entities. Поділяються вони на іменовані, наприклад < (<), та числові, виражені через десяткові коди — Æ (Æ). Деякі символи мають обидва представлення, інші ж — лише DEC-запис. Звичайно, ви можете використовувати й безпосередньо самі символи прямо в розмітці, але є кілька «але». Деякі з них, як от <, є керуючими символами самого HTML, і можуть зламати розмітку. Або ж, якщо раптом ваш документ декодується не в UTF-8, символ може просто не відобразитись. А використання HTML-сутності гарантує, що бравзер покаже його незалежно від таблиці кодування (якщо документ взагалі парситься). HTML має багато спільного з друкарською типографікою. Наприклад, існує нерозривний пробіл , який не дозволяє розрив рядка в цьому місці. Я досить часто використовую його у верстці, особливо там, де є довге тире. За правилами типографіки, довге тире не має знаходитися на початку рядка, якщо це не початок прямої мови або маркер списку. І послідовність слово —, або ще краще слово —, примушує бравзер правильно рендерити текст, щоб тире не переносилося на новий рядок. А ще є вузький пробіл, половинний, широкий, фіксований та «волосяний». Вони мають різну ширину і використовуються в різних ситуаціях для покращення візуального сприйняття тексту. Звідки вони усі пішли? Та з друкарства. Нагадаю, що довгий час друкарська матриця збиралася вручну з відливків з карбованими літерами, і довжина рядка регулювалася так само вручну. І різні пробіли — це по факту різної ширини залізячки, які вставлялися поміж літер. Лапок також існує велика кількість. І, що цікаво, деякі символи, які візуально нагадують лапки, ними не є. Наприклад, ″ — це не лапки, а подвійний штрих (″), який використовується для позначення координат на кшталт 50° 45′ 30″. Так само для трикрапки на письмі існує… трикрапка — окремий символ …. Ну і математика, куди ж без неї. Так, мінус — це не дефіс, а цілком собі мінус «−» (−), як от тут: «−15%». Для позначення нерівності варто використовувати символ ≠ (≠), а множення позначати символом × (×), а не астериском *. Якщо вже повернутися до тире, то зазвичай на письмі використовується два: довге «—» (—) та коротке «–» (–), яке використовується для позначення діапазонів. Тож записати, до прикладу, «девʼять чи десять» правильно можна ось так: «9–10», а не «9-10». Найпростіше ці символи вводити на Mac, адже там у стандартної клавіатури є спеціальний набір комбінацій саме для друкарських символів. На Windows з цим трохи сумніше — або користуватися Alt-послідовностями з «бухгалтерської» цифрової клавіатури, або ставити сторонні рішення. На мобільних з цим теж немає проблем — позатискайте різні кнопки на клавіатурі. Це дуже цікава вправа, яка покаже вам, скільки цікавих символів є у вашому розпорядженні. Ну а при верстці в HTML найнадійніший спосіб зробити ваші тексти гарними та типографськи правильними — це використовувати HTML Entities. Гарно оформлений текст і читається і сприймається набагато краще, навіть якщо це коротке повідомлення в месенджері.Що почитати:
Technical Web Typography: Guidelines and TechniquesЩо почитати душнілам:
WHATWG — Named character references***@babichdev