FANDOM


Існує безліч часто зустрічаються прикладів використання вікітекст, який відмінно відображається на екрані комп'ютера, але не завжди добре на екрані мобільного. Один з таких прикладів - вкладені таблиці.

Як нагадування: ви завжди можете подивитися, як сторінка виглядає на мобільному пристрої, для цього додайте до адреси URL ? Useskin=wikiamobile. Також ви можете це побачити в режимі попереднього, вибравши в випадаючому меню «мобільний скін».

Що таке вкладені таблиціРедагувати

Вкладені таблиці - це таблиці всередині таблиць.

Ось приклад вкладених таблиць з однієї англійської вікі. Подивіться на різницю між відображенням на екрані комп'ютера і на екрані мобільного телефону.
Desk Mob

Чим погані вкладені таблиціРедагувати

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

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

Що робити, якщо на вікі є вкладені таблиціРедагувати

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

Як позбутися від вкладених таблицьРедагувати

Як визначити, що на вікі є вкладені таблиці.Редагувати

У вихідному коді таблиці починаються з {| або <table>, а закриваються за допомогою коду |} або </table>. Таким чином, якщо ви бачите початок таблиці, і до її закінчення вам зустрічається початок ще однієї або декількох таблиць, перед вам вкладені таблиці.

Як розділити вкладені таблиціРедагувати

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

Що робити даліРедагувати

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

Тим не менш, вам доведеться шукати компроміс між тим, як таблиця виглядає на великому екрані комп'ютера і на маленькому екрані мобільного. Можливо, для цього буде потрібно CSS. Справа в тому, що CSS змінює тільки вигляд сторінки в повній версії браузера, а в мобільній версії ці додаткові стилі ігноруються.

Додаткова інформаціяРедагувати

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

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

ПрикладРедагувати

Як приклад того, як можна позбутися від вкладених таблиць, можна навести англомовну вікі Brave Frontier. Користувачи змогли не тільки прибрати вкладені таблиці з найбільш важливого шаблону, а й зберегти прекрасний вигляд сторінок для екранів комп'ютерів. А відображення сторінок в мобільному скине значно покращився. Дивіться самі:


Ви також можете ознайомитися з вихідним кодом шаблонів:

Примітка: шаблони захищені від редагування, але ви можете скопіювати їх і використовувати в своїх цілях.

Див. такожРедагувати

Зв'яжіться з співробітникамиРедагувати

Якщо вам потрібна допомогти з вкладеними таблицями на вашій вікі, зв'яжіться зі співробітниками, використовуючи сторінку Special:Contact. Будь ласка, додайте в тему Mobile: Nested tables.

Community content is available under CC-BY-SA unless otherwise noted.