Як правильно оптимізувати картинки для сайту
Постараюся зробити коротку інструкцію з правильного використання зображень на сайті.
Мова піде не про елементи дизайну, а про картинках у вигляді контенту (фото, галереї, скріншоти, інструкції, скани документів і т.д.).
Головна проблема - Контент-менеджер або сам замовник отримує фото для розміщення на сайті і відразу завантажує їх на сайт.
Це проблема №1, тому що ніхто не дивиться, що там за фотки, якого вони розміру, ваги і як називаються, а це все важливі моменти, тому що:
- Розмір фото не повинен перевищувати ширину того блоку, в якому зображення буде знаходитися, тобто, якщо це фото розміщене всередині статті і його розмір всередині контенту буде 300px, то зовсім не потрібно завантажувати фото шириною 5000px, якщо ж це фото для слайдера чи галереї, яка може використовувати попап, тоді максимальна ширина фото буде відповідати ширині екрану, я зазвичай ставлю 1920px.
- Вага фоток не повинен вимірюватися в Мегабайтах, оптимально, щоб розмір фоток був до 200 КБ, але може бути і більше в залежності від розміру і формату зображення. Але якщо фото важить більше 1 Мб, тоді це проблема.
- Назва фото повинно бути прописано тільки латиницею без пробілів і спецсимволов. Не можна використовувати кирилицю, прогалини і спецсимволи, через те, що на різних хостингах з таким форматом можуть виникнути проблеми, і майже на всіх хостингах після архівації-розархівації (при перенесенні або відновленні з бекапу) кирилиця буде перетворена в якісь незрозумілі знаки , і шляхи до файлів, що зберігаються в базі даних або прописаних в коді не відповідатимуть оновленим іменах файлів ... Тільки латиниця.
Тепер уявімо ситуацію, що ми отримали від замовника 20 фоток, які потрібно додати в галерею. Ми могли б просто взяти і відразу їх завантажити, але ви вже почали читати цю статтю і почали думати.
20 фоток важать 93МБ? Напевно, варто зменшити їх вагу. Ширина деяких фото 5000px? Навіщо, якщо галерея сайту обмежує розмір фото до 1200px. Всі фотки мають різні назви і, найчастіше, це набір символів і цифр, згенерований камерою і нічим не корисний ні для користувача, ні для пошукових систем? Тоді краще використовувати простий шаблон в назві фоток з прив'язкою до якоїсь події або назвою статті.
Якщо, потрібно змінити одне або два зображення, тоді це буде простіше і швидше зробити за допомогою Photoshop, через CTRL + ALT + i поміняти розмір і зберегти результат для WEB через CTRL + ALT + SHIFT + S.
Але у нас 20 фоток (а буває і більше), тоді потрібен інструмент для пакетного зміни зображень.
За допомогою програми FastStone Photo Resizer ми можемо пакетно змінити розміри і назви для фоток. Завантажити її можна тут faststone.org/FSResizerDownload.htm .
Коротка інструкція:
- Додаємо файли для обробки (1), вибираємо папку для оброблених файлів (2), задаємо нове ім'я для файлів (3) і задаємо настройки для ресайз (4)
- В налаштуваннях для даного сайту я задаю ресайз до 1200px, тому що там галерея обмежує розмір фото до 1200, а, як правило, для галерей я задаю розмір 1920
- На виході отримуємо такі результати:
як бачимо, загальна вага був 93МБ, а став 6Мб, що для 20 файлів досить таки непогано.
Даний результат непоганий, але не ідеальний. Для того, щоб Google Page Speed не лаявся на вагу фоток, ми їх ще трохи оптимізуємо.
Для фінальної оптимізації зображень відмінно підійде 1 з 2 онлайн ресурсів tinypng.com або kraken.io . Я зараз користуюся, в основному, першим.
І це дозволяє нам стиснути фотки ще на 46% зберігши при цьому ще 3МБ
За підсумком, наша сторінка буде завантажувати користувачеві не 93Мб великих зображень, а завантажить всього навсього 3Мб фоток потрібного розміру. Плюс економиться місце на вашому хостингу, тому що 10 таких галерей і дешевий хостинг вже буде забитий майже на 1 Гігабайт, тоді як 10 галерей з 3МБ займе всього 30МБ.
У даній статті всього 4 картинки, але оптимізувавши їх через tinypng.com я зменшив вагу з 1370КБ до 350КБ, або на 75%, може і дрібниця, але користувачеві потрібно буде завантажити на 1 МБ менше, значить сторінка завантажиться швидше.
Важливо перевірити якість зображень після всіх процедур, так як можуть з'явитися артефакти, тонкі лінії можуть розмитися, а складні малюнки з дрібними деталями можуть поплисти. Тому, якщо вам якість графічних матеріалів важливіше їх ваги і швидкості завантаження на сайті, тоді можна пропустити останній крок.
Трохи пізніше я ще напишу що-небудь про альти і тайтли, але невідомо коли.
Оток важать 93МБ?Ширина деяких фото 5000px?
Всі фотки мають різні назви і, найчастіше, це набір символів і цифр, згенерований камерою і нічим не корисний ні для користувача, ні для пошукових систем?
Pro SEO Совет: как WikiPedia может повлиять на ваш рейтинг PageRank |
2019-11-09 11:11:20

Да, вы слышали это правильно. Название действительно говорит Википедия .
Большинство маркетологов уже знают, что Википедия имеет большой вес с Google.
С появлением Wikipedia на первой странице по большинству поисковых терминов, вы можете увидеть всю мощь сайта без каких-либо исследований.
Это седьмой по популярности сайт с более чем 325 миллионами читателей по всему миру. Несмотря на то, что он не является надежным источником для академического мира, мы все можем согласиться с тем, что это один из самых популярных и полезных веб-сайтов .

(Изображение предоставлено www.legalmorning.com )
Многие маркетологи стремятся воспользоваться Википедией одним из двух способов. Первый заключается в создании статьи Википедии для своего клиента. Второе - включить ссылки на их веб-сайты в различные статьи.
Почему маркетологи хотят, чтобы их ссылка была включена в Википедию?
Чтобы лучше это понять, нам нужно посмотреть, как Википедия использовалась в прошлом. Как сообщество с открытым исходным кодом, любой может редактировать сайт. Это просто и быстро и, вероятно, один из самых быстрых способов получить обратную ссылку. Несколько лет назад маркетологи выяснили, что Google придавал массу веса ссылкам в Википедии. Настолько, что маркетологи начали спамить ссылки так быстро, как только могли.
Вот почему Википедия изменила ссылки с «не следуй» на «не следуй».
Нет-Следуй и Делай-Следуй. Есть ли разница с Википедией?
Ссылки «не следовать» не имеют такого большого веса, как ссылки «не следовать». Я думаю, что это то, с чем мы все можем согласиться. В целях борьбы со спамом Википедия начала внедрять свои политика запрещенных ссылок для того, чтобы отговорить маркетологов использовать сайт для продвижения. Хотя это и сдерживало спам, оно, похоже, не влияло на ценность ссылок из Википедии.
Google по-прежнему уделяет большое внимание ссылкам из Википедии, несмотря на наличие атрибута "не следуй". Таким образом, люди продолжают спамить сайт, пытаясь повысить рейтинг страницы, но не так сильно, как раньше.
Эффект бумеранга из ссылок Википедии
Википедия вызывает то, что я люблю называть эффектом бумеранга. Как это работает, просто. Мы уже знаем, что Википедия занимает высокое место в поиске. Когда в высокопоставленной статье Википедии есть ссылка, она имеет тенденцию приводить ссылки вместе с ней.
Таким образом, ссылки, которые обычно могут не иметь высокого ранга страницы, будут увеличиваться в ранге просто от ранга и веса статьи Википедии.
Позвольте мне показать вам, как это выглядит. Давайте сделаем поиск для «Удачи Легиона», мультфильма из 1950-х. Это была случайная статья, которую я вытащил из Википедии благодаря ее генератору «случайных страниц». Когда я выполняю поиск в Google по этой теме, вы можете видеть многочисленные результаты поиска, один из которых с веб-сайта. DanDare.org ,
Сайт имеет рейтинг страницы 3, но авторитет домена составляет 31 и около 300 обратных ссылок на его сайт. Тем не менее, он опережает Amazon.com (рейтинг страницы 8, авторитет домена 97 и более 3 миллионов обратных ссылок).
Как это удалось сделать?
Dandare.org стал получателем эффекта бумеранга в Википедии. Несмотря на то, что он не настолько авторитетен, как Amazon.com, он опережает его в результатах поиска.
Если вы посмотрите на страницу Википедии для Удача Легиона в статье используется ссылка Dandare.org (см. ниже - имейте в виду, что из-за открытого источника Википедии текущая статья может не отражать то, что изображено). Если вы посмотрите внизу результатов поиска выше, вы даже увидите, что блог от Blogger попал на первую страницу результатов. Угадай, что? Он также используется в статье Википедии в качестве ссылки.

Эту концепцию я проповедовал управляющим компаниям в течение многих лет. В то время как Википедия была используется для управления репутацией цели, я советую им держаться подальше от этого для ORM. Причина в том, что Википедия будет влиять на негативные ссылки так же, как и на позитивные.
Если вы пытаетесь спрятать контент на второй странице Google, создание страницы в Википедии сведет на нет ваши репутационные усилия. Страница Википедии окажется на первой странице, и как только другие введут отрицательные ссылки (имейте в виду, что каждый может редактировать Википедию), она вернет все на первую страницу.
Как использовать эффект бумеранга в Википедии
Во-первых, создание статьи в Википедии - отличный способ повысить рейтинг вашей страницы. Ссылки внутри помогут любой странице, особенно вашему основному сайту. Если у вас есть внешняя ссылка из Википедии на ваш сайт, Google начнет влюбляться в вас.
Добавление ссылок на ваш сайт также поможет. Не только ссылки с вашего сайта, но и ссылки для прессы о вашем сайте. Если в крупной публикации говорилось о вас или ваших услугах, вы можете найти место в Википедии, где была бы уместна ссылка на эту статью. Это поможет держать положительные отзывы о вас выше в результатах поиска для просмотра пользователями.
Звучит отлично, правда? Ну, у меня есть последнее замечание для тех, кто сейчас хочет использовать Википедию в своих маркетинговых планах. Не принимайте участие в проекте в Википедии, если у вас нет такого опыта. Создание статьи и создание ссылок в Википедии требует знания правил Википедии и конкретных стратегий, чтобы быть уверенным, что вы не будете помечены как спамер.
Неспособность сделать что-либо может привести к тому, что ваш сайт будет заблокирован и помещен в черный список Википедией, а это не тот результат, который вы ищете. Я рекомендую нанять специалиста или провести много исследований, прежде чем погрузиться и испачкать руки.
Автор
Майкл Вуд - эксперт по интернет-маркетингу и владелец Legalmorning.com , Он специализируется на управлении репутацией и брендом, написании статей и профессиональном редактировании Википедии. Он является опытным редактором Википедии и помог сотням компаний и людей опубликовать свои статьи на сайте, где они потерпели неудачу.