З Word в HTML. Як правильно робити документ, щоб він добре перетворювався на HTML
Бочка меду
LMS Collaborator вміє створювати навчальні ресурси з готового документа MS Word. Достатньо завантажити файл DOCX-формату і система запропонує перетворити його в ресурс по типу «Сторінка». Це значно економить час для авторів ресурсів.
Порядок дій:
- Створити новий ресурс по типу «Файл».
- Завантажити документ.
- Після завантаження система запитає «Перетворити файл у Ресурс-Сторінку?» – погоджуйтесь.
- Зберегти і переглянути результат.
Результатом буде HTML-ресурс у вигляді однієї сторінки, яка швидко завантажується та має всі шанси ідеально відображатися на будь-яких пристроях – від робочого столу до мобільного телефону.
Ложка дьогтю
Але перетворення передбачає, що при верстці документа DOCX ви користувалися загальноприйнятими правилами та форматуванням, якому існує пряма альтернатива у форматі HTML. Якщо прямої відповідності не буде, то результат перетворення не зможе відповідати оригіналу.
Що вийде з вашого документа, ви можете легко перевірити на сервісах перетворення Word в HTML. Наприклад, ост таких:
- Online HTML converter
- Word to HTML Converter Online. Convert Word to clean HTML – 4html.net
- WORD to HTML | DOC to HTML
Ще можна побачити як сам MS Word справляється із перетворенням свого документа у формат HTML. Спробуйте команду «Файл» – «Зберегти як…» та збережіть у форматі файлу «Веб-сторінка з фільтром (.htm)».
Якщо результат буде відповідати оригіналу – то ваш документ відформатований добре.
Абсолютно точного (чи максимально близького до нього) перетворення документа DOCX в інший формат можна досягти тільки перетворенням у PDF.
Але є способи зробити «правильний» документ, який буде перетворюватися в HTML без критичних спотворень.
Найкращі практики форматування документу MS Word
1. Стилі заголовків і тексту
Використовуйте стандартні стилі заголовків: «Заголовок», «Підзаголовок», «Заголовок 1», «Заголовок 2» тощо.
Текст набирайте стандартним стилем – «Звичайний».
2. Інтервали та відступи
Якщо потрібно для абзаців змінити відступи, змінити інтервал, шрифт – змінюйте в тексті. Можна змінювати стилі, але це не завжди працює.
3. Вирівнювання текста
Зазвичай із цим проблеми відсутні. Все перетворюється коректно.
4. Форматування шрифта
Всі звичайні способи зміни шрифту – зображення, колір, розмір – будуть добре перетворюватися.
5. Зміна типу шрифта
Шрифт зможе відобразитися правильно тільки в тому випадку, якщо на чужому комп’ютері будуть встановлені ті ж шрифти, що і у вас. Використовуйте безпечні шрифти (дізнатись більше про безпечні шрифти):
6. Списки
З простими маркованими та нумерованими списками проблем не повинно виникнути. Ієрархічні списки теж непогано конвертуються, але будуть відмінності.
7. Вставка картинок
Коректно відображатимуться картинки вставлені в текст як знак, а не як окремий об’єкт з можливістю обтікання. Про всяк випадок перевірте, що налаштовано в параметрах картинки «Розмір і положення» – «Обтікання текстом», повинно бути так:
Найнадійніший спосіб – окрема картинка в окремому абзаці тексту.
Жодні налаштування обтікання зображення текстом не дадуть хорошого результату. Картинки «утікатимуть» зі своїх місць та ігноруватимуть ваші налаштування.
Єдиний стабільний випадок – це обтікання картинки текстом праворуч. Вставте картинку першою в абзаці перед усім текстом та в налаштуваннях «Розмір та положення» – «Обтікання текстом» виберіть стиль обтікання «Квадрат» та обтікання текстом «Праворуч». Також додатково можна налаштувати відступи від тексту.
8. Зміна розміру, оформлення і параметрів картинок
Ви можете змінювати розміри картинок та експериментувати з іншими перетвореннями.
Як правило, прості зміни коректно переносяться в HTML. Але щось особливе – навряд чи буде розпізнано правильно.
9. Таблиці
Таблиці конвертуються майже без помилок.
Якщо потрібно, щоб таблиця розтягувалася на всю ширину сторінки, встановіть для неї параметр «Автопідбір за шириною вікна». У цьому випадку краще робити таблицю якнайпростіше – без об’єднаних і розбитих осередків, оскільки перетворення може бути неточним.
Висновок
Чарівного засобу, що точно перетворює будь-який DOCX на HTML, не існує. І не може бути. Занадто багато специфічних відмінностей у цих форматів.
Якщо вам важлива швидкість створення навчальних ресурсів у СДО та їх адаптивність до читання з мобільних пристроїв – очищайте та спрощуйте форматування документів, конвертуйте у HTML. У вас буде швидкий та прийнятний результат.
Потрібна точна відповідність документу? З цим найкраще справляється перетворення у PDF. Але доведеться забути про зручності читання з екрану смартфона.
Є час та натхнення – вивчайте верстку HTML документів за допомогою правил Bootstrap його альтернатив Bootstrap Alternatives (Top 10 Best Frontend Frameworks).
P.S. У нас є приклад правильно підготовленого файлу Word. Його можна використати як шаблон для документів. Перейдіть на демо-портал LMS Collaborator у Каталог навчальних завдань та заберіть його за цим посиланням:
