✅ WEB і WordPress новини, теми, плагіни. Тут ми ділимося порадами і кращими рішеннями для сайтів.

Прості кроки Зробіть веб-сайт зручним для мобільних пристроїв (адаптивний дизайн)?

5

Нарешті я зробив свій сайт: steakovercooked.com зручним для мобільних пристроїв, і тому всі веб-сторінки в усіх моїх 6 доменах наразі придатні для мобільних пристроїв.

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

зручний для мобільних пристроїв

Ось кроки, які допоможуть зробити сайт зручним для мобільних пристроїв, також відомий завдяки адаптивному дизайну CSS.

Очистіть вбудований CSS у тегах HTML

Вбудований CSS у тегах HTML поганий, оскільки вони змішують презентацію та HTML, наприклад,

Стиль визначається безпосередньо в тезі div HTML, який неможливо змінити за допомогою зовнішніх таблиць стилів.

Не використовуйте пікселі визначеної/фіксованої ширини

Якщо ви визначите щось на кшталт, наприклад, width:900px, імовірно, це незручно для мобільних пристроїв. Ви можете замінити це відсотком, наприклад 30%. Менші пікселі менш імовірно будуть проблемою, наприклад, піктограми добре підходять для екрану з невеликою роздільністю. Тільки уявіть, що найменша ширина екрана становить 300 пікселів (приблизно), тому ви не хочете, щоб будь-який з ваших елементів HTML був ширшим за цю ширину.

Вставте наступне в тег head

Зображення/таблиці найгірші

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

Ось і все, ніяких складних речей! Зауважте, що сторінка, зручна для мобільних пристроїв, не те саме, що AMP (Accelerated Mobile Pages).

Джерело запису: helloacm.com

Цей веб -сайт використовує файли cookie, щоб покращити ваш досвід. Ми припустимо, що з цим все гаразд, але ви можете відмовитися, якщо захочете. Прийняти Читати далі