- Зачем оптимизировать изображения для Интернета? Стандартный пример: разумно оптимизированный веб-сайт...
- Дайте изображению атрибут alt
- Установить описательный заголовок
- Используйте соответствующее имя файла
- Обратите внимание на размер файла
- Используйте правильный формат файла
- Снизить качество
- EXIF и метатеги не нужны человеку
- Используйте иконки как шрифты, а не как графику
- Используйте элемент изображения с умом
- Мое личное мнение:
Зачем оптимизировать изображения для Интернета?
Стандартный пример: разумно оптимизированный веб-сайт облегчает поисковым системам правильную индексацию своего контента. Текст не является препятствием, изображения в основном делают это. Сканер может (все еще) не читать и не интерпретировать изображения. Поэтому, если вы позаботитесь о том, чтобы ваше изображение можно было интерпретировать по-разному, каждый сканер будет в восторге. Звучит хорошо, правда?
Есть еще больше рычагов, которые вы можете использовать, чтобы получить максимальную отдачу от изображений и графики вашего сайта. Итак, приступим к делу:
Дайте картинке осмысленное название
Да, вы можете видеть, что показано на картинке. И да, нам все еще нужен заголовок, который отражает это. Прежде всего, это не плюс для вашего аккаунта SEO, а преимущество для ваших посетителей. Если он наведет указатель мыши на картинку, это описание станет видимым.
Кстати, вы можете добавить ключевые слова в это описание, которые важны для вашего SEO.
Дайте изображению атрибут alt
Атрибут alt является абсолютно необходимой услугой для ваших слабовидящих подписчиков. Их специальные браузеры читают это описание, так что становится ясно, что видно на картинке.
Так что, если ваш сайт работает без барьеров, вы не можете обойти эту точку. Если это не является абсолютно необходимым, будьте хорошим человеком и сделайте так, чтобы никому не мешало.
Но для зрячих посетителей также помогает атрибут alt. А именно, если картинка не была загружена. В этом случае он помогает в виде заполнителя преодолеть пропущенный опыт.
Установить описательный заголовок
Поскольку изображения должны поддерживать вашу статью, хорошо, если ваши читатели тоже это понимают. Для большинства картинок это не должно быть проблемой. Таким образом, если изделие обрабатывает шлифовку дверей, это, безусловно, облегчает связь с изображением отшлифованной двери. Иная ситуация, когда изображение показывает людей, которых не все сразу узнают. Это также может быть сложная ситуация, которая требует объяснения.
Подпись, которая объясняет, что происходит на картинке, помогает здесь. А поскольку вы не знаете, что легко для одного и трудно для другого, вы всегда должны ставить подпись.
Для большинства CMS это довольно легко сделать. Вот в примере: WordPress. Вы можете легко добавить заголовок, заголовок и атрибут alt:
Используйте соответствующее имя файла
Сам файл изображения должен иметь имя файла, содержащее ключевые слова, относящиеся к вашей статье. Поэтому, если ваше изображение 20151010-DSC1011.jpg, измените имя на то, что отражает содержание. Имейте в виду, какие условия поиска вы бы использовали, чтобы найти изображение. Почему? Если поисковые запросы и имя файла совпадают, скорее всего, ваше изображение появится в Поиске картинок Google.
Обратите внимание на размер файла
Этот момент очень важен. Потому что, если вы используете очень большие файлы изображений, произойдут две вещи:
Во-первых, загрузка страницы, содержащей изображение, будет намного медленнее, чем использование меньшего файла. Посетителям вашего сайта часто не хватает терпения ждать.
Второе - и это действительно неудобно - это отрицательно сказывается на вашем технический SEO ,
Еще раз для безопасности: я имею в виду не размер, а размер файла, но размер файла в килобайтах. Размеры изображения не должны превышать максимальный размер, в котором они используются на веб-сайте. Таким образом, если изображение отображается на настольной версии веб-сайта с разрешением 1000x1000 пикселей, но только на смартфоне с разрешением 320x320 пикселей, оно должно иметь максимальный размер 1000x1000 пикселей. Если он больше, он тратит впустую пространство и удлиняет время загрузки. Если оно меньше, оно в максимальной степени отражается на неприглядных потерях качества.
Этот метод всегда имеет подвох. Каждое изображение загружается в полном размере, даже если оно меньше. Адаптивный дизайн или нет. С такими инструментами, как imgix Вы можете помочь здесь? Это позволит разместить ваши изображения на сервере и использовать их по мере необходимости в зависимости от размера области просмотра. Это экономит место и делает ваш сайт быстрее.
Используйте правильный формат файла
Существует только ограниченное количество соответствующих форматов для отображения изображений на веб-сайтах: .gif, .jpg и .png.
И вот как вы используете это оптимально:
- .jpg для фоновой графики и фотографий
- .png или .gif для макета графики
Снизить качество
Это звучит парадоксально, но это помогает. Конечно, это не сделано, что это выделяется. Я говорю о снижении до 80%. Это стандартно для файлов .jpg в любом подходящем инструменте для редактирования изображений и обычно запрашивается при сохранении. Это экономит место и обеспечивает более короткое время загрузки. Обстоятельство, которое, кстати, Google ценит.
Инструменты, которые делают эту работу для вас, например, kraken.io или PNGGauntlet ,
EXIF и метатеги не нужны человеку
Фотографии обычно снабжаются дополнительной информацией, такой как EXIF и метатеги. Эта информация будет занимать место для хранения и не даст никакой выгоды при использовании на вашем веб-сайте. Так что ты делаешь? Довольно просто: покончим с этим.
Вы можете сделать это tinypng использовать.
Используйте иконки как шрифты, а не как графику
Значки, используемые в нужном месте, способствуют удобству использования веб-сайта и пониманию его содержания. К сожалению, в большинстве случаев они все еще используются в качестве графики. Эти графики хотят быть загружены и масштабированы для другого. Последнее невозможно без потери качества. Как приятно, что есть веб-шрифты. Они основаны на векторах, поэтому занимают немного памяти с одной стороны, а с другой - произвольно масштабируются.
Всякий раз, когда вы используете иконки, делайте это как веб-шрифт, если это возможно. Полезны готовые наборы, такие как Fontawesome или генераторы значков шрифтов, такие как Fontello ,
Используйте элемент изображения с умом
Элемент изображения HTML5 далеко не поддерживается всеми браузерами. В старых версиях Firefox, Chrome и Safari такая же проблема, как и в Internet Explorer. Поэтому следует тщательно продумать, имеет ли смысл его использование. В противном случае вы можете заблокировать важных посетителей / клиентов.
Вы хотели бы использовать элемент изображения сегодня, как мы делаем на этом сайте? Тогда это все JavaScript плагин picturefill Ваше решение, позволяющее даже более старым браузерам обмениваться файлами изображений.
Мое личное мнение:
Для фотографий и графики менталитет «забей и забудь» контрпродуктивен. Приведенные выше примеры показывают, что существует большой потенциал для оптимизации. Однако, как и во всех правилах, стандарты должны быстро превратиться в плоть и кровь. Так что не переживай и приступай к работе!
Используете ли вы свои собственные хаки, о которых я не упоминал в этой статье, или у вас есть вопросы или предложения по улучшению? Дайте мне знать в комментариях!
Похожие
Как вручную установить метатеги WordPressПосле того, как админ дает способы или учебник для установки тегов WordPress с плагинами , это неполно, если вы не дадите учебник по ручной установке метатегов на WordPress. Временами мы просто учимся как. 1. Подготовьте свой метатег, начиная с заголовка блога, описания вашего блога и ключевых слов. 2. Отредактируйте файл header.php. отредактировать его можно WebAIM: альтернативный текст
... неправильным или плохим альтернативным текстом. Подобно многим вещам в веб-доступности, определение подходящего, эквивалентного, альтернативного текста часто является вопросом личной интерпретации. Благодаря использованию примеров, эта статья представит нашу опытную интерпретацию правильного использования альтернативного текста. Важный Также смотрите наш статья об изображениях для получения дополнительной информации Как эффективно оптимизировать и оптимизировать изображения
... файла изображения Многие люди не обращают внимания на название изображения. Убедитесь, что вы создали имя, связанное с содержанием, а также включили целевые ключевые слова. Это эффективный способ получить высокий рейтинг в поисковых инструментах. Так как создать правильное имя? Мы должны назвать файл на основе его содержимого. Это способ оптимизации изображения для пользователей (при поиске). Более того, когда они смотрят на такое имя файла, они SEO Совет для WordPress: атрибут alt изображений
... изображения, если элемент не может быть загружен навигатор , Однако с появлением инструментов веб-поиска этот атрибут получил новые приложения. Сегодня большая часть контента в Интернете основана на изображениях. Тем не менее, многие сайты не оптимизированы для обеспечения лучшего WORDPRESS SEO: как оптимизировать описание меты
... как в Google или других поисковых системах. Вы, как веб-мастер, должны оптимизировать Мета-описание для увеличения CTR с помощью поисковой выдачи. Проверьте следующие советы: Сделайте интересные описания. Написать резюме для описания вашей страницы, чтобы привлечь посетителей, чтобы щелкнуть страницу на дисплее в результатах поиска. Помимо того, что вы интересны, вы также должны написать мета-описание, которое соответствует тому, что обсуждается в вашей статье, как оптимизировать SEO видео архивы YouTube
В настоящее время все больше и больше людей заинтересованы в том, чтобы стать Youtuber, потому что это позволяет им зарабатывать существенный доход. Тем не менее, быть профессиональным Youtuber не так просто, как можно себе представить, потому что вам также нужно подумать о том, как правильно оптимизировать SEO SEO . Быть Youtuber не просто достаточно, чтобы сделать видео и загрузить его на канал Youtube. Есть несколько вещей, которые нужно Как работает SEO-бизнес
... не говорит об этом. Сначала я хочу поделиться с вами информацией об инциденте, а затем мы переходим к обсуждению некоторых важных вопросов о SEO-бизнесе. Было около 14:00 вечера в пятницу днем, когда электронное письмо среди всех остальных привлекло мое внимание. Тема письма была «ссылочный спам». Человек, который написал это, утверждал, что он позвонил мне Как оптимизировать ваш сайт для поисковых систем
Что такое поисковая оптимизация (SEO)? Википедия определяет поисковую оптимизацию как: «... процесс улучшения объема и качества трафика на веб-сайт из поисковых систем с помощью« естественных »(« органических »или« алгоритмических ») результатов поиска. Обычно, чем раньше сайт представлен в результатах поиска, или Долгожданный: SEO как предмет
Пока не настоящее исследование: первый курс непрерывного образования характеризуется дальнейшей профессионализацией немецкой SEO-индустрии. Академия повышения квалификации в области SEO (сокращенно «afs») началась с успешного старта 1 сентября, чтобы начать дальнейшее развитие Как работает традиционный маркетинг?
... как это работает и как извлечь из этого максимальную пользу. Что такое традиционный маркетинг? Баркетинг - это тип общения между бизнесом и аудиторией. Можно использовать много разных методов, чтобы донести информацию о товарах или услугах до потребителей. Традиционный маркетинг включает в себя множество нецифровых форм коммуникации, таких как визитные карточки, почтовые рассылки, рекламная продукция или рекламные листовки, реклама в газетах или журналах Как оптимизировать контент для Google Featured Snippet Box
... используйте каждое ключевое слово с длинным хвостом в качестве пунктов субтитров и маркеров. Поле «Похожие запросы». Поле «Похожие запросы» обычно отображается внизу каждого результата поиска. Перед любой оптимизацией выполните поиск по ключевому ключевому слову или по ключевому слову с длинным хвостом. Затем определите связанные ключевые слова, которые отображаются в поле «Похожие запросы». Затем выборочно включите эти
Комментарии
Вы бы не свернули с автострады, не припарковались и не вошли в здание, если бы не знали, что внутри, не так ли?Вы бы не свернули с автострады, не припарковались и не вошли в здание, если бы не знали, что внутри, не так ли? Нет! Ну, и не будет поисковых систем! Поисковые системы ищут обозначение веб-страницы - тег заголовка HTML - чтобы сообщить им, о чем эта страница. HTML-мета-описание - это краткое описание веб-страницы или поста в блоге и того, что можно найти на странице или посте. Мета-описание похоже на рекламу магазина. Он сообщает поисковым системам и людям больше Но как именно вы узнаете, оптимизирована ли ваша SEO должным образом, и еще сложнее, как вы знаете, как это исправить, если это не так?
Но как именно вы узнаете, оптимизирована ли ваша SEO должным образом, и еще сложнее, как вы знаете, как это исправить, если это не так? Последнее, что вы хотите сделать, это продолжать делать те же ошибки. Продолжайте читать, чтобы узнать, как оптимизировать работу вашего SEO, чтобы вы могли начать продажи! Давайте начнем. Но как вы можете оптимизировать изображения для поисковых систем, таких как Google и Bing?
Но как вы можете оптимизировать изображения для поисковых систем, таких как Google и Bing? Что нужно? Ниже мы собрали для вас самые важные меры, которые помогут вам ответить на эти вопросы. Изображения, а также страницы продукта нуждаются в ключевых словах. Назовите изображения с точным названием продукта, включая название бренда. Для нескольких изображений фотографии товара должны быть пронумерованы. Используйте дополнительные теги и теги заголовка, чтобы разместить больше Посмотрите, как последний пример звучит больше как предложение, которое вы услышите от реального человека (а не от робота, стремящегося захватить мир и править всеми нами)?
Посмотрите, как последний пример звучит больше как предложение, которое вы услышите от реального человека (а не от робота, стремящегося захватить мир и править всеми нами)? Дело в том, что вместо того, чтобы как можно чаще вставлять в него ключевое слово «кондиционер», оно фокусируется на предоставлении информации, которая действительно интересует пользователей. Используете ли вы правильные ключевые слова? На данный момент, вы, вероятно, задаетесь вопросом, являются ли ключевые Но как можно оптимизировать отдельные страницы или как обмануть эти алгоритмы?
Но как можно оптимизировать отдельные страницы или как обмануть эти алгоритмы? PD: Вам даже не нужно начинать с обмана, потому что, если эти алгоритмы заметят это, они буквально наказаны! Речь идет о работе чистой, устойчивой и аккуратной. Конечно, невозможно учесть все 300 упомянутых выше параметров, но вы должны постараться подготовить как можно больше для Google, чтобы подготовленная страница была важной. Мы стараемся оптимизировать наших клиентов от 30% до 40%, поэтому Разве не было бы проще просто не беспокоиться и не рисковать?
Разве не было бы проще просто не беспокоиться и не рисковать? Я имею в виду построить устойчивый бизнес, который не будет полностью задействован, полагаясь исключительно на листинг на странице 1, чтобы создать достаточно бизнеса, чтобы оплатить накладные расходы? Ну да, в этом подходе много логики, и он сработал для других, но вот в чем дело: SEO никогда не умрет по следующим двум причинам: Вам по-прежнему нужен технически продуманный веб-сайт для оценки. Если ваш Каким будет соответствующий атрибут alt для изображения в Примере 9?
Каким будет соответствующий атрибут alt для изображения в Примере 9? "рукопожатие" «Бизнесмены пожимают друг другу руки, чтобы завершить контракт» alt = "" будет достаточно «Мы гарантируем наши профессиональные услуги» Анализируя этот пример, определите, представляет ли изображение важный контент. В этом случае я бы сказал, что это не так. В современной практике в Интернете многие такие изображения получают описательный Разве не правильно пробовать то, что мы хотели попробовать, пока не стало слишком поздно, даже если это не было чем-то большим или даже если это было сложно?
Разве не правильно пробовать то, что мы хотели попробовать, пока не стало слишком поздно, даже если это не было чем-то большим или даже если это было сложно? Я сказал, что буду следовать ее решению. Я думал, что если бы она сделала это, я бы сделала это. Если бы она этого не сделала, я бы не смог этого сделать. Она поговорила с нашим агентством, и это было правильно, пока не стало слишком поздно и решение не было принято. Тем не менее, мы продолжали следить за ювелирными изделиями. Мы волновались В этом сценарии человек, предлагающий услуги SEO на Ближнем Востоке, не может не спросить: «Как сделать SEO для арабских сайтов ?
Вы хотите узнать, как оптимизировать SEO на странице вашего сайта, как профессионал?
Вы хотите узнать, как оптимизировать SEO на странице вашего сайта, как профессионал? Screaming Frog Seo Spider - лучший инструмент в мире для анализа на странице URL сети , Это скрэппер, паук, который проверяет веб-страницы сверху вниз, ссылается по ссылке и анализирует их, показывая вам все, что вы хотите знать о каждой из страниц. Он сообщает вам, сколько текстовых символов имеет каждая страница, ее внутренние и внешние ссылки, ее SEO для WordPress: как лучше заполнить атрибут alt?
SEO для WordPress: как лучше заполнить атрибут alt? Во-первых, важно придавать значение качеству и формату изображений. Использование стандартных расширений (.jpg, .gif, .png) и обеспечение баланса между оптимизацией нагрузки и качеством очень важны для создания веб-сайта. Работая над SEO для WordPress вашего сайта, вы должны помнить атрибут alt как еще один элемент предпочтения поисковых систем. Однако это не означает, что альтернативный текст должен злоупотреблять ключевыми
Зачем оптимизировать изображения для Интернета?
Звучит хорошо, правда?
Почему?
С такими инструментами, как imgix Вы можете помочь здесь?
Так что ты делаешь?
Так как создать правильное имя?
Что такое традиционный маркетинг?
Вы бы не свернули с автострады, не припарковались и не вошли в здание, если бы не знали, что внутри, не так ли?
Но как именно вы узнаете, оптимизирована ли ваша SEO должным образом, и еще сложнее, как вы знаете, как это исправить, если это не так?
Но как вы можете оптимизировать изображения для поисковых систем, таких как Google и Bing?
