Теги в соціальних мережах і синтетичні (флективные) мови

I. В чому проблема

Багато комп'ютерні технології, розроблені споконвічно в світі аналітичного мови , при перенесенні в співтовариство з синтетичним мовою натикаються на додаткові труднощі.

Наприклад, пошук з урахуванням морфології в англійських і російських текстах вимагає різного рівня складності:



Один із прикладів такої мовної різниці технологій — теги в англійських і російських блогах і соціальних мережах. Поки теги виділяються в окремий блок (як це реалізовано на Хабрахабре або в ЖЖ), проблем немає: в обох мовах використовуються початкові форми слів, іноді множина (і тут навіть англійська мова являє залишки колишньої синтетизма). Але як тільки теги потрапляють в текст, різниця загострюється. І часом здається, що, наприклад, хештеги Твіттера стають потужним фактором посилення аналитизма в російській мові. Раз у раз натикаєшся на фрази на кшталт:

Ми з #чоловік в ресторані.

З завтрашнього дня в #Москва.

Повернулися з #море.

Виникає дуже дивне відчуття, певне мовне запаморочення і роздвоєння.

Люди, які не хочуть миритися з випирає неприродністю, вирішують проблему по-різному.

Хтось виносить теги кінець твіти, як би в окремий блок.

Повернулися. #море #відпустку

Хтось виносить теги вперед, як би додатково вычленяя тему наступного пропозиції.

#Москва. З завтрашнього дня.

Хтось перетворює в теги усі словоформи. Хоча це суттєво зменшує потенціал пошуку по тегам — адже морфологію до них ще не прикрутили.

Ми з #чоловіком в ресторані.

Хтось додає закінчення через дефіс, подвійні або одинарні лапки і навіть через пробіл. Ця вставка обриває автоматичне перетворення слова в тег якраз на такому символі. Але це рішення ускладнює читання, хоч такі пунктуаційні «потрухи», що стирчать назовні, все одно легше сприймати, ніж раптове відсутність відмінювання.

Ми з #чоловік-го в ресторані.

Ми з #муж'їм в ресторані.

Ми з #чоловік їм в ресторані.

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

Вулиці #Київ-а. Вечірнім #Київ-му. Ми в #Київ-е.

Вулиці #Москви-и. Вечірньої #Москви-ой. Ми в #Москви-е.

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

II. Два можливих рішення та їх особливості

Насправді в наборах символів є два підходящих знака, які одночасно і переривають тегування, і не залишають ніякого видимого проміжку між тегом-основою і закінченням: м'який перенос (скорочено «shy») і пробіл нульової ширини (скорочено «zwsp»).

Їх застосування дозволяє створювати, наприклад, ось такі хештеги в Твіттері:



Або такі в Фейсбуці (попередній варіант не вийде, тому що Фейсбук фільтрує однакові хештеги, залишаючи тегом тільки перший зустрівся):



У двох символів є ряд спільних рис.

1. У більшості випадків вони невидимі всередині слова.

2. Вони стають місцем перенесення частини слова на іншу рядок, коли слово вже не вміщається

3. Вони не дають розриватися частин слова при вирівнювання тексту по ширині (принаймні, в основних браузерах останніх версій).

4. Виявити обидва знака в слові можна наступними способами: а. при переміщенні каретки від символу до символу стрілками клавіатури каретка на місці невидимого символу один раз «пробуксовує», як би не реагує на натискання клавіші; б. при додаванні пробілів перед словом воно рано чи пізно, мимохідь до кінця рядка, розламується на дві частини в місці вставленого знака; ст. деякі текстові редактори (частіше программистские) відображають невидимі символи (наприклад, нульовий пробіл можна побачити у відомому сервісі jsfiddle.net а от м'який перенос там не відображається; до речі, можна поспостерігати за поведінкою тексту з такими прихованими символами, якщо поперемещать рамки блоків: jsfiddle.net/k37ssezj (в першому відрізку після кожного «слова» вставлено нульовою пробіл, у другому — м'який перенос)).

Але є івідмінності між двома знаками, і всі вони на користь м'якого переносу:

1. М'який перенос — більш традиційний і древній для комп'ютерного світу знак, він знаходиться в початковій частині Юнікоду, присутня у більшій кількості шрифтів і його легше вводити з клавіатури. Пробіл нульової ширини розташований значно пізніше у таблиці Unicode, може бути в меншій кількості шрифтів і вводити його з клавіатури складніше.

2. При перенесенні частини слова на новий рядок знак переносу більш логічним і більш явно позначає єдність слова.

Деякі відмінності залежать від додатків.

1. Знаки можуть по-різному впливати на пошук по сторінці (перенесення не заважає пошуку Chrome і Firefox, але заважає в IE; пробіл не заважає пошуку Chrome, але заважає в Firefox і IE).

2. При подвійному клацанні на слові, що містить невидимий знак, іноді виділяється лише частина слова під курсором, іноді все слово (при вставці перенесення виділення ділиться тільки в гібридних тегах Твіттера в Chrome; вставлення пробілу — ділиться в усіх словах у Chrome, IE).

3. Потрібно пам'ятати про баг IE11: при роботі з просунутими полями вводу (так званими
Rich Editor
, що дозволяють бачити оформлення в реальному часі в стилі редакторів WYSIWYG; їх породжують властивості
element.contentEditable
та
document.designMode
) іноді не працює вставка з буфера обміну — в такому разі в консолі розробника потрібно перемикатися з режиму Edge в режим сумісності з більш низькою версією браузера (починаючи з IE10). Наприклад, така проблема проявляється при спробі щось вставити в текст нотатки (Note) у Фейсбуці.

Нарешті, на вставку знаків можуть по-різному впливати сайти.

1. Фейсбук більш ворожим до невидимого прогалині. Він видаляє його майже відразу під час введення, і вже точно не зберігає його при публікації поста (судячи з усього, це мало кому приносить труднощі). Невидимий перенесення зберігається, в тому числі у малопопулярних поки фейсбучних хештегах, але іноді чомусь доводиться поводити по слову кареткою введення за допомогою клавіатури взад-вперед, щоб сайт цей знак у слові «побачив», інакше теж може не зберегти (при ручному введенні ця проблема проявляється рідше, ніж при спробах вставити в текст символ програмно за допомогою скрипта (про це трохи пізніше)).

2. При спробах вставити знак в Twitter скриптом, потрібно пам'ятати про цей прикро давню баг в Firefox. Доведеться або користуватися іншими способами вставки, або встановлювати ключ
security.csp.enable
з
about:config
на
false
, що, напевно, буде занадто радикальним способом вирішення друкарських проблем.

III. Способи реалізації

1. Введення вручну.

Якщо ви не вводите рідкісні символи з клавіатури, можливо, вам буде корисно ознайомитися з цій невеликій статті. У ній описується два методи введення символів: в десятеричном численні (надійно працює тільки з початковим блоком Юнікоду та деякими символами поширених кодувань) і в шістнадцятковому. Для зручності згаданого у статті редагування реєстру можна зберегти текст в файл з розширенням .reg і кодуванням Юнікод, клацнути на ньому і погодитися на внесення даних до реєстру.

EnableHexNumpad.regWindows Registry Editor Version 5.00

[HKEY_CURRENT_USER\Control Panel\Input Method]
"EnableHexNumpad"="1"



Отже, при введенні вручну ми повинні знати порядковий номер наших символів у двох счислениях:

М'який перенос:
0173
та
00ad
(відповідно
Alt + '0173'
та
Alt + '+00ad'
).

Нульовий пробіл:
8203
та
200b
(відповідно
Alt + '8203'
та
Alt + '+200b'
).

(До речі, цікаво, що нульовий пробіл не входить в клас пробільних символів JavaScript '\s': перерахування однієї з груп прогалин переривається якраз перед ним).

Що потрібно врахувати:

а. Десятеричный введення символів з більшим порядковим номером працює дуже рідко. Іноді нічого не вставляється, іноді вставляється щось зовсім несподіване.

б. При введенні шістнадцятиричних кодів, що містять букви, часто спрацьовують задані в додатках клавіатурні скорочення (shortcuts), і введення символу зривається. Іноді це залежить від поточної розкладки клавіатури, іноді ні.

2. Вставка з буфера обміну.

Можна десь зберегти ці два символи, щоб копіювати їх звідти і вставляти через
Ctrl+C/Ctrl+V
. Хоча зберігати і копіювати невидимі символи трохи важче, ніж видимі: доведеться або зберегти кожен в окремому файлі, або знати їх місце і виділяти за допомогою клавіатури (
Shift+стрілки
).

У Windows можна скористатися звичної утилітою, вибравши не найбідніший шрифт, виставивши потрібні опції, ввівши порядковий шістнадцятковий номер і натиснути потрібні кнопки:





3. Введення за допомогою скрипта (букмарклета).

Трохи далі будуть представлені дві програмки, ідентичні у всьому, крім коду символу і його змінної. Вони послідовно перебирають три варіанти обставин:

а. Курсор знаходиться в простому однорядковому або багаторядковому полі. Використовуються звичайні для таких випадків властивості і методи.

б. Курсор знаходиться в полі з розширеними можливостями типу
Rich Editor
(враховуються варіанти як з елементом поточного вікна/документа, так і з повністю виділеної під редактор
iframe
зі своїм вікном/документом). Використовується
document.execCommand()
.

ст. Фокус не в текстовому полі чи потрібний метод роботи з
Rich Editor
не реалізований в браузері (в IE11 команда
insertText
не підтримується, але буде реалізована Edge). У цьому випадку перед користувачем спливає віконце з текстовим полем, в якому необхідний символ вже виділено (хоч він при цьому і невидимий). Залишається лише натиснути
Ctrl+C
закрити вікно (можна натисканням
Enter
або
Esc
), потім вставити курсор у потрібне місце тексту і натиснути
Ctrl+V
. Можна вважати цей варіант зручною реалізацією попереднього способу копіювання і вставки з файлу або утиліти.

М'який перенос
javascript: (function(d, e, shy, s1, s2, v, sy, sx) {
if (e.type == 'textarea' || e.type == 'text') {
s1 = e.selectionStart;
s2 = e.selectionEnd;
sy = e.scrollTop;
sx = e.scrollLeft;
v = e.value;
e.value = v.substring(0, s1) + shy + v.substring(s2);
e.selectionStart = e.selectionEnd = ++s1;
e.scrollTop = sy;
e.scrollLeft = sx;
e.focus();
} else if ((e.isContentEditable || d.designMode == 'on') && d.queryCommandSupported('insertText') || (d = e.contentDocument) && (d.activeElement.isContentEditable || d.designMode == 'on') && d.queryCommandSupported('insertText')) {
d.execCommand('insertText', false, shy);
} else {
prompt('Copy and paste in the text:', shy);
}
})(document, document.activeElement, '\u00ad')


Нульовою пробіл
javascript: (function(d, e, zwsp, s1, s2, v, sy, sx) {
if (e.type == 'textarea' || e.type == 'text') {
s1 = e.selectionStart;
s2 = e.selectionEnd;
sy = e.scrollTop;
sx = e.scrollLeft;
v = e.value;
e.value = v.substring(0, s1) + zwsp + v.substring(s2);
e.selectionStart = e.selectionEnd = ++s1;
e.scrollTop = sy;
e.scrollLeft = sx;
e.focus();
} else if ((e.isContentEditable || d.designMode == 'on') && d.queryCommandSupported('insertText') || (d = e.contentDocument) && (d.activeElement.isContentEditable || d.designMode == 'on') && d.queryCommandSupported('insertText')) {
d.execCommand('insertText', false, zwsp);
} else {
prompt('Copy and paste in the text:', zwsp);
}
})(document, document.activeElement, '\u200b')


У Chrome або Firefox можна створити нову закладку на довільну сторінку, а потім вставити код (від першої літери
javascript:
до останньої дужки після
'\u00ad'
або
'\u200b'
включно) у поле адреси, змінивши за необхідності назву закладки.

У Chrome можна просто виділити код і перетягнути виділений текст відразу в закладки, потім змінивши назву на більш відчутний.

В IE обидва цих способу неможливі (зате можливий описаний тут спосіб створення файлу в папці «Обраного»).

Нарешті, у всіх браузерах можна перетягнути в закладки посилання сторінки (в IE11 потрібно буде погодитися із збереженням букмарклета).

IV. Особливості застосування в різних браузерах і на різних сайтах.

Ось невелика таблиця з результатами випробувань трьох браузерів останніх версій Windows 7 SP 1. Мінус або плюс відображають поточний кінцевий результат, що залежить від суми обставин. Він може змінитися у процесі розвитку браузерів або сайтів. Більш загальні обставини відображені в примітках до заголовків рядків і колонок, більш приватні обставини зазначаються в клітинках. Окремі варіанти з постом і заміткою Фейсбуку взяті заради різної реалізації
Rich Editor
в них: у першому випадку як елементу сторінки, у другому — як цілого вбудованого фрейма зі своїм вікном/документом.



картинка без зменшення

Примітки до таблиці:1. Хештеги в нотатках Фейсбуку (поки що?) не працюють, чи то з невидимими символами, будь то без них.

2. При введенні десятеричного коду нульового пробілу замість очікуваного знака у всіх браузерах з'являється символ ♂ (порядковий номер— 10: 9794, 16: 2642).

3. У Фейсбуці нульовою пробіл видаляється сайтом відразу після вставки або після збереження поста.

4. Замість м'якого переносу спрацьовують клавіатурні скорочення.

5. Запобігти спрацьовування клавіатурного скорочення в Firefox в даному випадку можна додатковим затисненням клавіші Win.

6. Проблема залежить від розкладки клавіатури: чи спрацьовує клавіатурне скорочення, або взагалі нічого не відбувається.

7. У Фейсбуці програмно вставлені м'які переноси не завжди відразу «підхоплюються» сторінкою і тим самим не завжди зберігаються при публікації тексту, іноді потрібно рухати курсор всередині слова стрілками клавіатури. Можливо, є інші способи «актуалізації» вставки. Іноді вставка не розпізнається при первинному створенні посту, але розпізнається при редагуванні вже збережений.

8. У IE11 в полях типу
Rich Editor
буде працювати тільки компромісний метод букмарклета, з копіюванням і вставкою символу з буфера.

9. У IE11 поле поста Фейсбуку стає звичайним полем, без можливостей
Rich Editor
.


За наочним підсумками випробувань у таблиці виділено колонки з найбільш універсальними — кроссбраузернимі і кроссайтовыми — способами.

Дякую за увагу.

Джерело: Хабрахабр

0 коментарів

Тільки зареєстровані та авторизовані користувачі можуть залишати коментарі.