понеділок, 13 липня 2009 р.

Переноси і типографіка українського тексту в HTML


Дов­го я роз­би­рав­ся з пра­ви­ла­ми пе­ре­но­сів. Особ­ли­во як­що зва­жи­ти на «ефект Мат­ри­ці» ©, який був у цій спра­ві ви­рі­шаль­ним. Я дав­но по­ду­мав, що не вар­то ви­на­хо­ди­ти ве­ло­си­пед, але дов­го від­кла­дав до­с­лі­джен­ня то­го, як во­но ре­а­лі­зо­ва­но в TeX. На­справ­ді, про­б­ле­ма пе­ре­но­су є не­три­ві­аль­ною, про що свід­чить ди­сер­та­ція. Але від­по­від­ні таб­ли­ці для ук­ра­їн­сь­кої мо­ви дав­но іс­ну­ють, от­же, про­б­ле­ма в ре­а­лі­за­ції ал­го­рит­му на JavaScript. І я вже був по­чав ду­ма­ти, як йо­го кра­ще за­пр­огра­му­ва­ти, ко­ли з'я­ви­ла­ся щас­ли­ва ду­м­ка, що я, пев­но, не один про це по­ду­мав. І прав­да, ви­яви­ло­ся, що є від­кри­тий проєкт Hyphenator, який під­три­мує різ­ні мо­ви. Все, що по­тріб­но, — це ви­тяг­ти таб­ли­ці для ук­ра­їн­сь­ких слів з TeX і пе­ре­тво­ри­ти на UTF-8.

Я, зви­чай­но, не міг не при­кру­ти­ти пе­ре­но­си до транс­лі­те­ра­то­ра і по­те­с­ту­ва­ти пра­ви­ла. Най­кра­щи­ми ви­яви­ли­ся таб­ли­ці, що їх ство­рив Ан­д­рій Швай­ка, але во­ни, на жаль, пога­но від­ді­ля­ли префікс від ко­ре­ня. То­му до­ве­ло­ся ще трош­ки по­мучи­ти patgen. Ко­ли я за­кін­чу те­с­ту­ва­ти таб­ли­ці, від­прав­лю їх роз­роб­ни­кам, і во­ни бу­дуть до­ступ­ні на сто­рін­ці проєк­ту. А по­ки що, Hyphenator мож­на запус­ка­ти звід­си.

В прин­ци­пі, при­клад все по­яс­нює, як­що за­зир­ну­ти в HTML, але я роз­ка­жу ок­ре­мо, як при­кру­ти­ти пе­ре­но­си до бло­ґа на Blogger. Го­лов­ною особ­ли­віс­тю є те, що шаб­лон Blogger не дозво­ляє ста­ви­ти ат­ри­бут lang у <html>, а без нь­о­го пр­ограм­ка про­сить ко­рис­ту­ва­ча вка­за­ти мо­ву ру­ка­ми при за­ван­та­жен­ні сто­рін­ки, що не є кру­то. Роз­в'я­зу­є­ть­ся це встав­лян­ням в роз­діл <head> шаб­ло­ну
<meta content='uk' http-equiv='content-language'/>
Ми вка­за­ли ос­нов­ну мо­ву, але це ще не все. Hyphenator пе­ре­но­сить тіль­ки ті роз­ді­ли, які йому дозво­ле­но пе­ре­но­си­ти. А са­ме: тіль­ки те, що має клас hyphenate. То­му, як­що не­об­хід­но, щоб пе­ре­но­си­ли­ся сло­ва в до­пи­сах, не­об­хід­но до­да­ти цей клас у від­по­від­ний роз­діл шаб­ло­ну, а та­кож до­да­ти ат­ри­бут, що яв­но вка­зує мо­ву. Для пе­ре­но­су до­пи­сів зна­хо­ди­мо postbody і ви­прав­ля­є­мо йо­го так:
<div class='hyphenate' lang='uk'><data:post.body/></div>
Те са­ме тре­ба зро­би­ти з усі­ма еле­мен­та­ми, в яких ви хо­че­те, щоб сло­ва пе­ре­но­си­ли­ся. Те­пер до­да­є­мо скрип­тик, який, влас­не, все й ро­бить:
<script src="http://tran.eu5.org/Hyphenator/Hyphenator.js" type="text/javascript"></script>
<script type="text/javascript"><!--
Hyphenator.config({displaytogglebox:false,minwordlength:4});
Hyphenator.run();
//-->
</script>
Змін­ну displaytogglebox мож­на по­с­та­ви­ти true, як­що ви хо­че­те, щоб у пра­во­му вер­х­ньо­му кут­ку з'я­ви­ла­ся кно­поч­ка, яка дозво­лить ко­рис­ту­ва­чу від­клю­ча­ти пе­ре­но­си.

За­од­но я на­пи­сав ти­п­ограф, який, ок­рім пе­ре­но­сів, ще роз­став­ляє ти­п­ограф­сь­кі зна­ки за стан­дар­том. Ця шту­ка, спо­ді­ва­ю­ся, зго­ди­ть­ся тим, хто хо­че, щоб їх­ні ко­мен­та­рі в бло­ґах ра­ду­ва­ли око. При­най­м­ні я від­не­дав­на ко­мен­тую з пе­ре­но­са­ми.
Опублікував Sandy о 17:37 Мітки: , , ,

7 коментарів:

  1. Sandy14 липня 2009 р. о 12:24

    Вчо­ра Олек­сій Гре­ков від­пра­вив свої таб­ли­ці в Hyphenator. Що ж, тим гір­ше для них. Мої на­ба­га­то кра­ще пе­ре­но­сять...

    Хто хо­че, мо­же взя­ти мої таб­ли­ці тут.

    ВідповістиВидалити
  2. diy14 липня 2009 р. о 17:06

    Дякую, дуже корисна річ, Зробив переноси у дописах на своєму блозі, на другому також встановлю.
    Добре було б як встроїти типограф у форму для надсилання дописів, наприклад як додаток до браузера, гадаю у принципі таке можливо.
    Не зрозумів як підключити ваші таблиці переносів.

    ВідповістиВидалити
  3. Sandy14 липня 2009 р. о 17:21

    Як­що ви за­пус­ка­є­те Hyphenator з мо­єї сто­рін­ки, він уже з мо­їми таб­ли­ця­ми. Як­що ви ска­ча­є­те йо­го зі сто­рін­ки проєк­ту, то від­по­від­ний файл тре­ба за­мі­ни­ти на мій.

    Що сто­су­є­ть­ся до­дат­ку до бра­у­зе­ра, то, ду­маю, за до­по­мо­гою GreaseMonkey це не­важ­ко зро­би­ти, але я ним не ко­рис­ту­ю­ся, то­му не бе­ру­ся. ;)

    ВідповістиВидалити
  4. diy14 липня 2009 р. о 17:41

    Дякую, зрозуміло.
    GreaseMonkey досі не користувався, треба буде подивитися.

    ВідповістиВидалити
  5. diy17 липня 2009 р. о 12:42

    Тим­ча­со­во ви­да­лив скрипт пе­ре­но­сів, бо пе­ре­став пра­цю­ва­ти від­жет рей­тин­гів. І з при­хо­ву­ван­ням тек­с­ту «під кат» (Чи­та­ти да­лі...) проб­ле­ма. Швид­ше за все по­в’я­за­не зі за­мі­ною кла­су post-​body entry-​content на post-​​body hyphenate.

    ВідповістиВидалити
  6. Sandy17 липня 2009 р. о 13:52

    Так, з div я по­га­ряч­ку­вав. Кра­ще до­да­ти клас hyphenate до P. Мабуть, справді кілька класів краще не робити, дякую. Додав ще галочку як прив'язувати.

    ВідповістиВидалити
  7. Sandy6 серпня 2009 р. о 16:25

    Ще одне важливе доповнення.

    ВідповістиВидалити

Підписатися на: Дописати коментарі (Atom)
Hy-phen-a-tion