X   Сообщение сайта
(Сообщение закроется через 3 секунды)



 

Здравствуйте, гость ( Вход | Регистрация )

2 страниц V   1 2 >
Открыть тему
Добавить ответ в эту тему
> Подробный гайд по оптимизации изображений, wpmaster.kz - Блог о WordPress для веб-мастеров.
Андрей_WPM
Андрей_WPM
Topic Starter сообщение 21.7.2019, 13:31; Ответить: Андрей_WPM
Сообщение #1


Бывалый
****

Группа: User
Сообщений: 338
Регистрация: 10.3.2019
Из: Казахстан, Россия
Поблагодарили: 134 раза
Репутация:   18  


Всем привет!

Наконец-то я закончил писать свой Гайд по оптимизации картинок на сайте. Думал он не закончиться никогда. :)

В мануале описан весь процесс оптимизации изображений, который я провожу перед каждой публикацией. Прочитав его вы узнаете как правильно называть изображения, какими инструментами пользоваться, как максимально автоматизировать процесс оптимизации и много ещё полезных фишек.

Приготовьтесь к "многабукаф"! Все необходимые ссылки на программы, сервисы и плагины в статье имеются. Пользуйтесь на здоровье.

Уровень: Новичок, Пользователь, Бывалый.
Время прочтения: ~21 минута.
Статья на блоге: Гайд по оптимизации изображений.

Комментируем, плюсуем, распространяем... всё как обычно. ;)


--------------------


Поблагодарили: (1)
2
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Kuzzma
Kuzzma
сообщение 21.7.2019, 14:06; Ответить: Kuzzma
Сообщение #2


Бывалый
****


Группа: User
Сообщений: 482
Регистрация: 12.6.2015
Из: Москва
Поблагодарили: 161 раз
Репутация:   21  


Андрей_WPM, привет!

Немаловажный - пишется слитно, а так нормальная статья. "Не маловажную роль...", поправьте на сайте.



--------------------
Здесь информация о Ваших сайтах, товарах, услугах (свободно)

Flextype - маленькая, быстрая и бесплатная CMS для сайтов!


Поблагодарили: (1)
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
GetWeb
GetWeb
сообщение 21.7.2019, 14:46; Ответить: GetWeb
Сообщение #3


Новичок
*

Группа: User
Сообщений: 19
Регистрация: 19.7.2019
Поблагодарили: 2 раза
Репутация:   1  


WEBp очень интересный формат, отличное сжатие, жаль что еще слабая поддержка браузерами, пару лет придется подождать.
Из онлайн сервисов для сжатия изображений мне очень понравился squoosh, там гибкая система оптимизации.



--------------------
Get-Web.site - Качественная верстка сайтов


Поблагодарили: (1)
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
ekvador
ekvador
сообщение 21.7.2019, 15:03; Ответить: ekvador
Сообщение #4


Участник
***


Группа: User
Сообщений: 175
Регистрация: 12.6.2011
Поблагодарили: 67 раз
Репутация:   10  


Цитата
Выделить на странице скриншотом нужную картинку, сохранить и посмотреть её размеры.
Воспользоваться специальным инструментом, например экранной линейкой.

при масштабировании окна браузера получите ошибочные данные
проверяется без скринов и сторонних расширений. в панели разработчика наведите указатель мыши на ссылку изображения, или откройте изображение в отдельной вкладке и смотрите title этой вкладки


Поблагодарили: (1)
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Андрей_WPM
Андрей_WPM
Topic Starter сообщение 21.7.2019, 15:20; Ответить: Андрей_WPM
Сообщение #5


Бывалый
****

Группа: User
Сообщений: 338
Регистрация: 10.3.2019
Из: Казахстан, Россия
Поблагодарили: 134 раза
Репутация:   18  


Цитата(Kuzzma @ 21.7.2019, 16:06) *
Немаловажный - пишется слитно


Благодарю, поправил.

Цитата(ekvador @ 21.7.2019, 17:03) *
при масштабировании окна браузера получите ошибочные данные


Справедливое замечание. Поправил статью. Спасибо.


--------------------
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
rom_4
rom_4
сообщение 21.7.2019, 15:41; Ответить: rom_4
Сообщение #6


трафа много не бывает
******

Группа: Active User
Сообщений: 1576
Регистрация: 9.7.2010
Из: Россия
Поблагодарили: 620 раз
Репутация:   69  


Хотел пару моментов от себя добавить:
Цитата
Подгоняем размеры и пропорции картинки под нужные значения.

В том случае, если не используются лайтбоксы (увеличение при клике на картинку)

Цитата
Установить на сайт скрипт-хук

А если писать на компе "домик на берегу озера.jpg" - без тире? Так не проще?

Ну и из бесплатных программ мне нравится как сжимает FileOptimizer


--------------------
Зарабатываю тут, тут и тут


Поблагодарили: (1)
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Андрей_WPM
Андрей_WPM
Topic Starter сообщение 21.7.2019, 16:14; Ответить: Андрей_WPM
Сообщение #7


Бывалый
****

Группа: User
Сообщений: 338
Регистрация: 10.3.2019
Из: Казахстан, Россия
Поблагодарили: 134 раза
Репутация:   18  


Цитата(rom_4 @ 21.7.2019, 17:41) *
А если писать на компе "домик на берегу озера.jpg" - без тире? Так не проще?


Проще, более того, я точно так и пишу, только после компрессии, инструмент сам добавляет эти тире. И это очень не удобно, постоянно их удалять в ручную. Поэтому я в хук этот момент и добавил. В первую очередь для собственного удобства.

Попробуйте назвать картинку без тире, оптимизировать программой и вы увидите эти тире. Скорее даже это под программу и писалось, потому-что я ей в основном оптимизирую. И всем заказчикам тоже. Она для меня как третья рука. :D

Поправлюсь, тире ставит фотошоп. Я чёт сам засомневался, сейчас проверил. У меня путь начинается с фотошопа, потом программа и загрузка на сайт.

Сообщение отредактировал Андрей_WPM - 21.7.2019, 16:24


--------------------


Поблагодарили: (1)
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
rom_4
rom_4
сообщение 21.7.2019, 17:35; Ответить: rom_4
Сообщение #8


трафа много не бывает
******

Группа: Active User
Сообщений: 1576
Регистрация: 9.7.2010
Из: Россия
Поблагодарили: 620 раз
Репутация:   69  


Андрей_WPM, я пользую на сайте Robin image optimizer от Webcraftic, он прекрасно добавляет описание без тире, т.е. как оно есть, и также Webcraftic перезаписывает название картинки уже с тире(или нижним подчеркиванием, не помню). Единственное что остается - заполнить альт. Но если альт и название совпадают как в вашем примере, то ctrl+a, ctrl+c и ctrl+v решают эту задачу на раз. Ну или вашим скриптом автоматом прописывать альт из названия. Просто сложилось впечатление, что в статье есть лишняя работа для вебмастера, можно ваши примеры еще оптимизировать.

п.с. если начинать с фотошопа, тогда да, наверное ваш пример норм. Если без фотошопа, тогда не норм :)

Сообщение отредактировал rom_4 - 21.7.2019, 17:42


--------------------
Зарабатываю тут, тут и тут


Поблагодарили: (1)
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Андрей_WPM
Андрей_WPM
Topic Starter сообщение 21.7.2019, 18:29; Ответить: Андрей_WPM
Сообщение #9


Бывалый
****

Группа: User
Сообщений: 338
Регистрация: 10.3.2019
Из: Казахстан, Россия
Поблагодарили: 134 раза
Репутация:   18  


rom_4, честно говоря, по сравнению с качеством и уровнем компресси xnconvert выигрывает в разы по сравнению с robin. Я тестировал и плагины и сервисы, видел результаты. Поэтому я и остановился на программе. Плюс, у меня главная картинка статьи в формате webp (подставляется если браузер поддерживает), а robin с этим форматом только в платной версии работает. Как то так.

Цитата(rom_4 @ 21.7.2019, 19:35) *
Просто сложилось впечатление, что в статье есть лишняя работа для вебмастера, можно ваши примеры еще оптимизировать.


Оптимизировать можно всё! :D Тут главное основу понять. Многие даже это не делают ведь, потому что не знают как и чем.
А по поводу лишней работы, тут скорее много информации, за раз тяжеловато освоить, поэтому и кажется что лишняя. На самом то деле, один раз дорогу настроил и потом просто ходи по ней. Обрезал, сжал, загрузил. Ничего лишнего я считаю.

Но идея максимально оптимизировать процесс достаточно логичная. Я поработаю над этим! ;)


--------------------
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
AlekseiZuev
AlekseiZuev
сообщение 23.8.2019, 22:54; Ответить: AlekseiZuev
Сообщение #10


Новичок
*

Группа: Viewer
Сообщений: 1
Регистрация: 20.8.2019
Поблагодарили: 1 раз
Репутация:   0  


Андрей_WPM,
Андрей! Внимательно прочитал Ваш подробный гайд по оптимизации изображений. Общее впечатление хорошее. Не совсем понятно как продвигать картинку в Интернете? Я в поисковике ввожу запрос на картинку и как поисковик найдет именно то что мне надо? домик-на-берегу-озера.jpg переделается в domik-na-beregu-ozera.jpg В Описание и Подпись пойдет текст Домик на берегу озера и по нему и будет происходить индексация? Я правильно понял. Хотелось бы большей определенности в этом вопросе. Куда ставить ключевик? Может я что-то пропустил, тогда извините.


Поблагодарили: (1)
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
2 страниц V   1 2 >
Открыть тему
Добавить ответ в эту тему
3 чел. читают эту тему (гостей: 3, скрытых пользователей: 0)
Пользователей: 0


Свернуть

> Похожие темы

  Тема Ответов Автор Просмотров Последний ответ
Открытая тема (нет новых ответов) Статьи по текстовой оптимизации и продвижении текстами
rush-analytics.ru - блог сервиса SEO-аналитики
4 RushAgency 563 1.8.2019, 11:58
автор: vvovvo
Открытая тема (нет новых ответов) Обработка фотографий и изображений для сайтов, и не только …
0 DarkUnicorn 672 4.6.2019, 22:57
автор: DarkUnicorn
Открытая тема (нет новых ответов) Ищем специалиста по технической оптимизации сайта под ключ
0 Irish0ck 547 23.4.2019, 14:33
автор: Irish0ck
Открытая тема (нет новых ответов) Ищу рутинщика, для внешней оптимизации (ссылки, коменты и тд)
4 regem 1029 14.2.2019, 14:53
автор: Mak_Pet
Открытая тема (нет новых ответов) Ищу партнерку для оптимизации компьютера
3 Akeeloq 1735 8.2.2019, 9:59
автор: Akeeloq


 



RSS Текстовая версия Сейчас: 19.9.2019, 2:10
Дизайн