Красивая глобальная подсказка по alt


Содержание

Бесплатная подборка всплывающих подсказок с использованием JQuery и CSS3

Здравствуйте, дорогие читатели блога beloweb.ru. В этот замечательный вечер я спешу представить Вам, замечательную подборку бесплатных плавно всплывающих подсказок на любой вкус и цвет с использованием CSS3 и JQuery.

Ну что тут сказать, подборка получилась довольно таки не плохая. И я думаю, что она существенно поможет решить Вам проблему с подсказками на сайте. Тем более здесь есть с чего выбрать. Ну а теперь наслаждайтесь, друзья.

Красивая глобальная подсказка по alt

Изучив рубрику «CSS», вы узнаете, как с помощью каскадных таблиц стилей (CSS) можно легко управлять дизайном сайта и упростить создание самого сайта. Данная рубрика заменит Вам полноценный «учебник по CSS».

Бесплатные уроки CSS для начинающих

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

Забавные эффекты для букв

Небольшой эффект с интерактивной анимацией букв.

ALT картинки — как правильно прописать

Время чтения: 7 минут Нет времени читать?

Тема сегодняшней статьи – SEO — оптимизация изображения с помощью атрибута ALT. Многие не знают, что при оптимизации данного атрибута вы повышаете вероятность посещения вашего сайта. Итак, более подробнее расскажу далее в статье:

Что такое атрибут ALT?

ALT – это атрибут, в котором содержится альтернативный текст изображения. Атрибут показывается, когда в браузере отключен показ изображения, но в стандартных настройках вы его не увидите.

Так же, как и Title и Description он учитывается поисковой системой

Как сделать всплывающую подсказку в HTML и CSS?

Приветствую вас на сайте Impuls-Web!

Довольно часто возникает необходимость сделать всплывающую подсказку html для того, что бы пояснить пользователю какой-то момент на странице сайта, или, к примеру, сделать пояснение к изображению, которое будет появляться при наведении на него указателя мышки.

В сегодняшней статье я покажу вам два простых способа, с помощью которых с легкостью делается всплывающая подсказка html-кодом и css-стилями.

Всплывающая подсказка HTML

Итак, для создания всплывающей подсказки html мы можем использовать атрибут title, который можно присвоить для любого элемента на странице. В случае если данный атрибут задан для какого либо элемента, то при наведении указателя мышки на данный элемент будет появляться всплывающая подсказка.

Или вот еще один пример с использованием картинки:

Как видите все просто, но данная всплывающая подсказка html имеет ряд своих недостатков. А именно, все параметры отображения, такие как шрифт, цвет, размер задаются исходя из параметров браузера, и вы ни как не можете на них повлиять.

Всплывающая подсказка CSS

Второй способ заключается в том, что мы можем создать всплывающую подсказку CSS, и задать для нее такое визуальное оформление, как нам нужно. Для этого мы создадим дополнительный блок после элемента, для которого нужно сделать всплывающую подсказку CSS, в нем разместим нужный текст, а затем css-стилями зададим нужные параметры визуализации.

Вот что получится:

Данными стилями мы задаем стилизацию нашей подсказке и делаем ее полностью прозрачной. А далее при наведении указателя мышки на картинку, делаем ее видимой.

Конечно данный способ создания всплывающей подсказки CSS немного трудоемкий в плане кода, но вы можете сделать заготовку для различных случаев, а потом просо подставлять нужные классы для элементов с подсказками.

Надеюсь, моя статья будет для вас полезна и поможет вам сделать удобные и информативные подсказки. Если данная статья вам понравилась, обязательно оставьте комментарий, поделитесь ею в социальных сетях и подпишитесь на мою рассылку.


Желаю вам удачи! До встречи в следующих статьях!

Как правильно заполнять alt и title картинки

Что такое Alt и Title картинки

Привет, народ. Дабы не тратить ваше время, давайте коротко и по делу.

Title картинки – это надпись, которая всплывает при наведении курсора на изображение. Это нужно, чтобы дать подсказку посетителю. Рассказать, что изображено на картинке или куда обратить внимание.

Alt картинки – от английского слова alternative. Это такая полезная вещь, которую очень любят индексировать поисковики, дабы определить, что изображено. Также, он будет виден, если пользователь отключит в браузере отображение картинок. Что не имеет смысла и совершается в редких случаях.

Если все же пользователь выключит отображения графического контента или произойдет какой-то сбой на чьей-то стороне, то вместо картинки будет виднеться маленькая иконка с текстом. Этот текст и есть alt изображения.

Alt и title картинки для SEO

Для тайтл картинки имеет минимальное значение. Он индексируется не охотно, но вот может сыграть вам на руку в поведенческих факторах. На дворе 2020 год, seo сейчас — это юзабилити и качественный контент. Поэтому привлекайте внимания пользователя любым способом.

Даже сами подумайте, приятней же когда появляется всплывающая подсказка у изображения.

А вот alt картинки — это клад. Во-первых, его отсутствие GoogleBot считает ошибкой, Яндекс относится лояльней. Во-вторых, он охотно индексируется, а такое изображение попадает в раздел «Картинки» в поиске. Это значит, что таким способом вы сможете привлекать дополнительный трафик на свой сайт.

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

Как правильно заполнять alt и title для картинок

C title все намного проще. Для поисковика правил нет, но это не значит, что вы пишите тут любую ересь. Выше мы делали подводку к поведенческим факторам. Желательно вам не надоедать пользователю, быть ему полезным.

1) Он не должен быть длинным. Согласитесь, подсказка в 4 строки будет вызывать отторжение.

2) Должен как-то относиться к изображению.

3) Не должен дублироваться с основным title, заголовками h1-h5, с атрибутами alt.

Alt картинки имеет вес у поисковика, поэтому здесь есть ограничения с правилами, но так и возможности.

1) Одного слова не достаточно, желательно держаться в рамках от 3 слов. Максимальное число символов 250.

2) Он должен соответствовать содержимому изображения.

3) Категорически не стоит перечислять в нем ключевые запросы как в key words.

4) Желательно, не должен повторяться с другими alt на странице.

Так что, добавляя очередную картинку в блог, подумайте. Может какой-то человек захочет её найти? Попробуйте превратить его в лишний трафик.

Где заполнять alt и title картинок на примере wordpress

Например, в вордпресе вам достаточно зайти из панели управления (консоль) в раздел «Медиафайлы»«Библиотека». Далее выбираете любое изображение.

Или, редактируя статью, просто жмёте на любую вставленную картинку, после на карандашик.

Конечно, на примере wordpress показать легче всего, но многие популярные CMS дают такую возможность. Вот, к примеру – Joomla. Там есть свои подводные камни, но у большинства графического контента можно прописать alt если нажать «Редактировать изображение»

На этом все. Очень надеемся, что мы вам были полезны. Если да, поставьте лайк. Это нас мотивирует делать больше качественного и интересного контента!

Как стилизовать всплывающую подсказку alt в html?


Можно ли стилизовать всплывающую подсказку для атрибута alt?

Я хочу стиль фона, цвет шрифта и т.д. для атрибута html alt .

Может ли кто-нибудь помочь мне с этим?

Вы можете использовать новый пользовательский атрибут data- HTML5: Семантические подсказки с чистыми CSS3 и HTML5.

Вы не можете создать всплывающую подсказку по умолчанию (т.е. стиль атрибута alt ), но вы можете использовать теги Javascript, CSS и

Или эти подсказки только для CSS:

Вы можете сделать это, используя CSS и позиционирование, показывая и скрывая div в javascript.

Семантические подсказки с чистым CSS3 и HTML5

Этот метод настолько прост, что Im действительно удивил, что никто не придумал его раньше, пожалуйста, стреляйте в меня, если у меня есть ссылка, но я не смог найти ничего после какого-то обширного действия Google.

В настоящее время большинство людей используют что-то вроде этого, чтобы создать чистую CSS-подсказку:

(Код из CSSGlobe)

Но это еще один посторонний элемент в нашем HTML и, по сути, не имеет особого смысла для прошивок, поэтому попробуем создать более семантическое решение.

Посмотрите в действии

Решение заключается в атрибуте title и свойстве содержимого CSS. Мы можем использовать этот атрибут для динамического вставки текста с помощью CSS. HTML является основным, как вам нравится:

Илон Маск рекомендует:  Структуры в с

Используя свойство содержимого CSS, мы затем создаем некоторый контент после span следующим образом:

HTML Собака имеет список того, что мы можем использовать с свойством content.

Теперь наша подсказка будет отображаться, когда мы наводим верх над диапазоном. Вероятно, мы должны сделать его более заметным.

Взгляд в будущее

С HTML5, наконец, позволяющим настраивать атрибуты, мы можем сделать это еще более семантическим.

Вы можете больше узнать о пользовательских атрибутах HTML5 в JavaScript Kit.

Альт коды – таблица всех символов

Приветствую вас снова на нашем сайте! Вы знали, что с помощью самой обыкновенной клавиатуры можно вводить гораздо больше символов, чем на ней нарисовано? Ну, скорее всего, знали, если вы попали в эту статью с поиска. Если нет, то сегодня вы узнаете, что такое альт коды и как ими пользоваться, а также, почему они могут не сработать.

Если вам нужны только таблицы альт кодов со всеми символами, то сразу проматывайте статью до картинок с таблицами. Если же хотите узнать что-то другое, то читайте статью внимательно.

Для чего нужны альт коды

Вот, допустим, вы пишете какую-нибудь работу, скажем, по физике, и вам необходимо написать «60 градусов по Цельсию». Если вы пишите в MS Word, то символ градуса Цельсия вы всегда сможете найти в спецсимволах. Но не все знают, как это сделать. Да и к тому же, поиски некоторых редких символов могут отнять достаточно много времени.

Уверяю вас, когда вы научитесь пользоваться альт кодами, то у вас вставка градуса Цельсия займет не более пары секунд.

Еще распространенная ситуация – это когда дефис упорно не хочет автоматически превращаться в тире (удлиняться). Проблему с тире тоже вам помогут решить Alt коды.

Как воспользоваться этими скрытыми символами

Использовать символы, которых нет на клавиатуре предельно просто. Нужно просто зажать левый Alt на клавиатуре и параллельно с этим набрать цифровой код символа.

Например, Alt + 1 даст вам такой вот смайлик ☺. Можете потренироваться в комментариях. PS: в текстовых документах смайлик будет не цветным, а черно-белым.


Тут правда есть один нюанс – цифры, которые расположены над буквами, не сработают. Нажимать нужно именно на цифры, расположенные на правой части клавиатуры. Поэтому вот на такой компактной клавиатуре альт коды не работают.

Alt коды самых востребованных символов

Какими-то символами пользуются реже, какими-то чаще. Сейчас мы приведем примеры самых часто используемых символов, которые желательно выучить наизусть. Остальные же вы всегда сможете подсмотреть в шпаргалке, если оставите эту статью в закладках или сделаете ее репост, чтобы она оставалась у вас на виду.

Альт коды символов, которые вам точно пригодятся:

Название Символ Альт коды Примечание
Градус Цельсия ° Alt + 0176
Диаметр Ø Alt + 0216 Альт код диаметра доступен только на латинской раскладке клавиатуры
Тире
Alt + 0150
Alt + 0151
Их два. Работают на обеих раскладках.
Кавычки елочки «» Alt + 0171
Alt + 0187
Если в вашем шрифте по умолчанию вот такие кавычки “”
Плюс/минус ± Alt + 0177
Галочка

Alt + 251
Alt + 10003
Alt + 10004
Несколько вариантов, которые можно назвать галочками.
Галочка в квадрате Alt + 9745 На случай важных переговоров!
Стрелка вправо, влево, вверх, вниз ←→↑↓ Alt + 26
Alt + 27
Alt + 24
Alt + 25
Альт код стрелки вправо бывает необходим, когда нужно показать следствие из чего-либо.
Знак ударения ударе́ние Alt + 769 Ставим курсор после нужной буквы и набираем альт код ударения. Важно! Через поиск это слово больше не найдется, так как символы «е» и «е́» это совершенно разные символы.
Знак копирайта © Alt + 0169
Сердечко Alt + 3 Есть еще альт код белого сердечка, но он у меня не работает почему-то, поэтому я его не даю вам. У нас только проверенная информация.
Бесконечность Alt + 8734
Неразрывный пробел Пример: а, б, в, г, д, е Alt + 0160 Мы применили альт код неразрывного пробела между буквами. Несмотря на то, что «а» и «б» могли бы поместиться на первой строке, они приклеились к остальным буквам.
Параграф § Alt + 0167

Альт коды всех основных символов в таблице

В этих таблицах представлены все основные символы, которые можно ввести при помощи альт кодов. Однако не берусь утверждать, что это абсолютно все символы. Их очень много, и часто бывает, что несколько кодов могут выдавать один и тот же символ. Если что-то не нашли, то спрашивайте в комментариях, попробуем разобраться вместе.

Только для русской раскладки клавиатуры

Только для английской раскладки клавиатуры

Зачем использовать альт коды для букв

Вы, конечно же, заметили, что помимо всяких необычных знаков и символов в таблице есть также аль коды обыкновенных букв. Это абсолютно те же самые буквы, которые вы вводите с клавиатуры и даже через поиск можно будет найти слово, в котором одна из букв вставлена Alt кодом.

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

Другого полезного применения таких букв я не нашел. Если у вас есть интересные идеи, блесните ими в комментариях.

Если не работают альт коды, то…

То значит, вы что-то делаете не так. В принципе альт коды могут не работать по нескольким причинам.

Например, вы не очень внимательно прочитали инструкцию и пытаетесь использовать цифры, расположенные над буквенными клавишами. Они не сработают. Вам нужно использовать только те цифры, которые расположены справа (numpad).

Если у вас небольшой ноутбук, то и клавиатура на нем, скорее всего, урезанная. В таком случае есть небольшая вероятность, что вы сможете использовать верхние цифры, если дополнительно зажать клавишу Fn. У меня этот способ не сработал, но его активно советуют в интернете.

Также если у вас неправильно работают альт коды (получается не тот символ, который должен быть), то попробуйте сменить раскладку клавиатуры (Alt+Shift).

Еще очень банальная причина – проверьте, включен ли numpad (кнопка NUM над ним).

Вместо итога

Даже не знаю, чем подытожить. Просто пользуйтесь на здоровье. Потренироваться вы можете прям тут, в комментариях. Давайте посмотрим, насколько вы усвоили тему. Если возникли трудности, то не стесняйтесь спрашивать совета и вам помогут (либо я, либо другие пользователи). Чтобы не запоминать все коды, просто добавьте эту статью в закладки в своем браузере.

Как сделать всплывающую подсказку в HTML и CSS?

Приветствую вас на сайте Impuls-Web!

Довольно часто возникает необходимость сделать всплывающую подсказку html для того, что бы пояснить пользователю какой-то момент на странице сайта, или, к примеру, сделать пояснение к изображению, которое будет появляться при наведении на него указателя мышки.

В сегодняшней статье я покажу вам два простых способа, с помощью которых с легкостью делается всплывающая подсказка html-кодом и css-стилями.

Всплывающая подсказка HTML

Итак, для создания всплывающей подсказки html мы можем использовать атрибут title, который можно присвоить для любого элемента на странице. В случае если данный атрибут задан для какого либо элемента, то при наведении указателя мышки на данный элемент будет появляться всплывающая подсказка.

Или вот еще один пример с использованием картинки:


Как видите все просто, но данная всплывающая подсказка html имеет ряд своих недостатков. А именно, все параметры отображения, такие как шрифт, цвет, размер задаются исходя из параметров браузера, и вы ни как не можете на них повлиять.

Всплывающая подсказка CSS

Второй способ заключается в том, что мы можем создать всплывающую подсказку CSS, и задать для нее такое визуальное оформление, как нам нужно. Для этого мы создадим дополнительный блок после элемента, для которого нужно сделать всплывающую подсказку CSS, в нем разместим нужный текст, а затем css-стилями зададим нужные параметры визуализации.

Вот что получится:

Данными стилями мы задаем стилизацию нашей подсказке и делаем ее полностью прозрачной. А далее при наведении указателя мышки на картинку, делаем ее видимой.

Конечно данный способ создания всплывающей подсказки CSS немного трудоемкий в плане кода, но вы можете сделать заготовку для различных случаев, а потом просо подставлять нужные классы для элементов с подсказками.

Надеюсь, моя статья будет для вас полезна и поможет вам сделать удобные и информативные подсказки. Если данная статья вам понравилась, обязательно оставьте комментарий, поделитесь ею в социальных сетях и подпишитесь на мою рассылку.

Желаю вам удачи! До встречи в следующих статьях!

Полная таблица ALT кодов

Что такое альт код? Alt-код — это символы, которые выводятся при нажатии комбинации клавиш на клавиатуре Alt + X, где X это набор цифр (определенного числа) на NumPad’е. NumPAd это блок цифр на клавиатуре как правило расположенных справа. Символы альт на ПК с операционными системами Windows не доступны при использовании обычной клавиатуры. Их можно вызывать только при помощи дополнительных команд. Зажимаем кнопку ALT и набираем число в десятичной системе счисления. Надеюсь здесь все понятно. Таблица Alt кодов поможет вам сориентироваться и найти нужный символ.

Внимание! Цифры набирайте на боковой Num-pad клавиатуре.

О максимальной длине атрибута ALT для изображений

Как нам уже известно по одному из предыдущих экспериментов с атрибутами alt и title, Яндекс использует их лишь для поиска по изображениям, а Google учитывает текст из ALT также и при ранжировании сайтов. Далее интересно было проверить максимально учитываемую длину атрибута ALT тега IMG , что и было проделано в текущем эксперименте (посвящается Елене http://optimizatorsha.ru/).

Илон Маск рекомендует:  Создание семантических HTML + CSS шаблонов на 2 и 3 колонки

Гипотеза

Поисковики учитывают не все слова из атрибута ALT

Цель эксперимента

Целью данного эксперимента было подтвердить или опровергнуть гипотезу, а также найти максимально допустимую длину атрибута ALT , если она ограничена, для основных поисковых систем – Google и Яндекс.

Проведение эксперимента

25-го июня была создана экспериментальная страница, содержащая уникальное изображение. В атрибут ALT было размещено 64 уникальных слова. Так выглядит часть HTML -кода на странице:

Ссылка на эксперимент была размещена на главной странице блога, поэтому индексация прошла довольно быстро. На данный момент экспериментальная страница проиндексирована в Google и Яндексе и фотография находится по уникальным фразам при поиске по изображениям.

Результаты

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

1. Основная выдача Google

При поиске в Google по словосочетаниям из атрибута ALT мы видим, что вплоть до 16-го слова экспериментальная страница находится:

По любым словам больше 16-го страницы нет в основной выдаче:

Также мы видим из 1-го скриншота, что в сниппет попадает всего 16 слов из атрибута ALT .

2. Поиск по изображениям в Google

При поиске по изображениям в Google мы также видим, что вводя поочередно слова из атрибута ALT , находятся лишь первые 16, остальные игнорируются.

С Google всё понятно, проверим Яндекс.

3. Поиск по изображениям в Яндексе


В отличие от Google, Яндекс нашел тестовое изображение с экспериментальной страницы по всем словам от первого вплоть до 28-го.

Начиная с 29-го изображение не находится.

Выводы

Как видно по результатам эксперимента, гипотеза подтвердилась – поисковики учитывают не весь ALT , а лишь несколько первых слов. Для Google лимит 16 слов, для Яндекса – 28 слов. В принципе, этого вполне достаточно, чтобы добавить в ALT описательный текст.

Несколько интересных фактов об индексации:

  • Google проиндексировал экспериментальную страницу в течение суток, Яндекс потратил на это больше недели;
  • Через 10 дней после индексации страницы фото появилось в результатах поиска по изображениям Google, Яндексу потребовалось в два раза больше времени для включения картинки в свой поиск по изображениям (чуть меньше месяца).

Любые комментарии приветствуются.

Читайте также

72 ответа (оставить свой)

Интересный эксперимент. Откуда уверенность, что индексирует определенное количество слов, а не символов?

Интересный эксперимент. Спасибо.
Мне тоже кажется, что ограничение по символам, а не по словам. Надо ставить ещё эксперимент, взять слова короче и длинее 8 символов. ))

С учетом пробелов:
Google 135 символов
Yandex 243 символов

Без учета пробелов:
Google 119 символов
Yandex 215 символов

В данном случае действительно эксперимент не совсем чист. То что слова одной длинны, мешает понять, что же считается.
Слова или символы?

Однако, если сравнить числа, то видно следующее.
16 слов или 135, 119 символов.
28 слов или 243, 215 символов.

у меня сложилось впечатление что 16 и 28 цифры, как бы боле круглые, �� с точки зрения человека знакомого с 16-ным счислением.
И более очевидные, чем разнобой 135, 119, 243, 215.

Опять же, я считаю что поисковики работают не просто с символами.
А со СЛОВАМИ ! Как известно контент это главное.

Полезная инфо. Я давно заметила, что Гугл выводит в результаты поиска по фразе из alt, даже если ее совершенно нету в контенте. Но не задумывалась, что можно включать целые абзацы. Спасибо за подробности и указание сроков. Учту.

Интересный эксперимент. Я сразу прочитал и ваш первый эксперимент, который до этого момента не видел. Я почему-то всегда прописываю ещё и titlte картинке, хотя, наверное, он не играет никакой роли при продвижение…

Оч интересное исследование, хотя всетаки сомнение присутствует, но это скорее субъективное пока сам не проверю… ��
За исследование спасибо! Однозначно в “Копилку рецептов”!

Тоже настораживает какое то не понятное значение. Именно 16 и именно 28…. понимаю еслиб было 15 и 30…. хотя кто их знает…

Не разумно было бы на месте поисковых систем индексировать и учитывать длину символов, а не слова. Зачем им нужны огрызки слов? Единственное, что можно добавить, это то что если написать предложение без пробелов, то возможно на этот случай проиндексирует какую-то его часть. Но для нормальных слов, длиной не более определенного количества символов, я думаю, они все-таки считают именно слова ��

Как пример, Google ведь в title считает по словам, а не по символам. Почему для него alt должно быть исключением? ��

Для более чистого эксперимента нужно бы еще 2 картинки – с длинными словами в ALT и с короткими. Потому что как уже писали, больше похоже на обрезку по символам. Скорее всего у Yandex она не должна превышать 255 (обрезается по словам к уменьшению), а у Google 150 символов.

Спасибо, интересный пост! Т.е., если в сомволах – примерно 128 для гугла ((7 знаков+1 пробел)*16), и 208 для яши ( по налогии, только умножаем на 28). Осталось разобраться с атрибутом title в изображениях ��

Ещё один ПОЛЕЗНЫЙ эксперимент. Спасибо Сергей.

Хотелось бы продолжение эксперимента с другими разными словами и все-таки разобраться с символами, длина-то слов разная бывает! ��

Эксперимент действительно интересно. Благодарен. Знал что есть ограничения, но какие… Спасибо, в общем.


Согласен с некоторыми комментаторами, что пс определяют по длине символов, а не по числу слов…

При ранжировании поисковики обычно оперируют словами, а не символами. В данном эксперименте также лимит используется на количество слов. Утверждение это несложно проверить, зная, что поставленная гипотеза об ограниченности альта уже подвердилась.

Для примера, был найден сайт, где в ALT используется больше 16 слов разной длины. Это сайт обоев на рабочий стол wallpampers.ru. На изображении ниже показан текст альта с нумерацией слов:

Если теперь вводить в кавычках ряд слов из альта, то мы заметим:

1. В основной выдаче Google сниппет не содержит 17-го слова.

2. При поиске по изображениям, Google находит картинки с сайта, если использовать все слова до 16-го. Однако, не находит ни одного, как только мы добавляем 17-ое слово.

По Яндексу предлагаю вам проверить самостоятельно ��

спасибо за полезную инфу, ранее даже не задумывалась о длине alt.

Скажите, а есть какой-то скрипт или программа, которая бы массово прописывала Alt и title у фото?:) НАпример есть 20 фоток стульев на 1 странице. Всем надо прописать тайтл отремонтированный кориченевый стул и альт – ремонт стульев. Как это осуществить? вручную или есть спец проги или скрипты? (сайт без движка на HTML )

Есть, называется CMS .
Если кликнете на мой ник, увидите в действии – там не только титлы, но и фото сами устанавливаются, я их лишь загружаю на сервер, а они сами находят свою статью и публикуются. Хотите, и вам сделаю такой сайт.

natkalin, CMS я так понимаю движок готовый, типа ВП, Джумлы и тд.. а у меня просто есть штук 10 хтмл страниц с картинками:) и навигацией между ними.. Ваш способ поможет ?:)

Спасибо за информацию.

Имя, если считать,что у всех фотографий уже есть пустой альт, то в текстовом редакторе делаешь замену по маске, в блокноте ctrl+h и меняешь alt=’‘ на alt=‘ремонт стульев’

2 psevdonim. 16 как раз КРУГЛОЕ число. А вот 15 или 30 не круглые.
С точки зрения шестнадцатеричной системы.

И 28 тоже более круглое в этой системе счисления.
В двоичной системе вообще 28 выглядит как 11100.

Может программер в Яндексе “ручку расписывал”. �� Или это скрытая реклама 1С? Кто знает… �� Яндекс он такой…

Предлагаю эксперимент, так же с изображением. При запросе “Платон Щукин” в Яндекс справа выводится изображение “того самого”. Как насчет того, что бы изменить эту картинку на другую на этот же запрос?

Имя, не занимайтесь глупостями и не ленитесь. Качаете на комп, открываете блокнотом, и ручками… Ваш плюс в том, что можете варьировать alt, разбавляя всеми возможными фразами, которые могут люди набирать в поиске.

natkalin, уговорили:) Просто сроки поджжимают) ладно пару кружек кофе и я пошел:)) спасибо

В ALT знаки препинания между словами можно ставить или надо обязательно без них?

Яндекс вечно не успевает за Гуглом.

Подскажите вот такой вопрос. есть страница ХТМЛ с выполненными превьюшками работ. На странице получается список из более 100 работ. Что будет если у всех 100 картинок на одной странице будет:

1) одинаковые ALT ? И разные Title?
2) Разный Alt и одинаковый Title?
3) Одинаковый Alt и одинаковый Title?

Полезный опыт. Спасибо что поделились результатами. Интересен только такой момент – вес у всех слов одинаковый, или у тех слов которые ближе к началу?

Почему яндекс такой медлительный и делает все в 2-3 раза дольше гугла?

Потому что у него “техника покруче”. Оригинал всегда лучше копии ��

А кто из них оригинал покруче? Гугл, который вышел на 5 лет позже?

Медлительность Яндекса – вопрос спорный.
Новый сайт (в подписи) Гугл нашел за 1,5 часа, но только главную, через 2 недели еще несколько стр., остальные страницы добавил в течении месяца. Яндекс добрел лишь через 2 недели, но захватил весь сайт целиком.

Итого: Яндекс проиндексировал сайт ровно в 2 раза быстрее.

Спасибо, обязательно учту и теперь буду использовать alt!


Вот это интересно! Придётся мне пересмотреть описания к картинкам. Правда, их на моём сайте не так много, но будут же ещё. Спасибо за исследование.

Илон Маск рекомендует:  Iis задание разрешений ntfs для каталога или файла

В принципе обычно хватает слова 3-4, иногда 5. А по поводу скорости вхождения в индекс, так это уже давно известно, гугл в этом плане (и не только в этом) намного лучше.

Ну подсказка весьма весомая и надо ею активно пользоваться

Кстати, вот что интересно: ведь кроме alt, используется также атрибут title (если alt отображается вместо не загрузившейся картинки, то title всплывает при наведении на картинку мыши). Он, вроде бы, тоже со вкусом используется поисковиками. На его длину есть какие-то ограничения – никто не проверял?

Княгиня, тайтл визображенияхиспользуется только рамблером…

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

Княгиня, на длину тайтла при поиске по изображениям тоже есть ограничения. Чуть позже будут результаты, но предварительно думаю, что ситуация похожа с альтом.

@Андрей:

Подскажите вот такой вопрос. есть страница ХТМЛ с выполненными превьюшками работ. На странице получается список из более 100 работ. Что будет если у всех 100 картинок на одной странице будет:

1) одинаковые ALT ? И разные Title?
2) Разный Alt и одинаковый Title?
3) Одинаковый Alt и одинаковый Title?

Андрей, а какой смысл делать всем 100 картинкам одинаковые описания? И что именно вы хотите узнать вопросом “что будет”? �� Делайте разный альт и тайтл для всех изображений в пределах сайта (кстати, я часто делаю так, что альт=тайтл для одного изображения).

Очень интересно всё же узнать, какая максимальная длина атрибута title для изображений? Воспользовалась поиском, но не нашла результаты об ограничениях тайтла… Есть ли ответ на этот вопрос?

Ну вот например, есть сайт фирмы, занимающейся ремонтом и реставрацией мебели. работают лет 10. и ежегодно на 1 странице выкладывают все свои работы за сделанные за год. Например на странице 2001.html расположено 2410 фотографий выполненных работ (отреставрированных кресел, стульев, диванов) что всем 2410 фотографиям делать разные альт и тайтл?:)

Или можно напарсить ключевиков по необходимому региону и из них составлять альты и тайтлы?:)

В общем есть 15ключей. Если к ним добавить пару разбавочных слов, таким образом получить штук 30 фраз. И рандомно расставить как альты, так и тайтлы из этих же фраз.
Вопросы:
1)Даст ли это какой-то результат и плюс для картинок, или нет?
2)Не будет ли это считаться переоптимизацией и не повлечет ли за собой санкции от ПС?:)

Собственно вот что хотелось узнать:)

(Ps: всего на всех страницах в сумме 20000 фото:) Я состарюсь пока пропишу всем альты и тайтлы, причем разные…)

@Андрей:

что всем 2410 фотографиям делать разные альт и тайтл?:)

Конечно! (это во-первых). А во вторых, зачем создаются эти страницы? Если для посетителей, то пожалейте их, 2000 фото даже если по 20 Кб каждое, будет в сумме составлять 40 Мб, пользователь состарится, пока откроется страница (выражаясь вашими словами) ��

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

Если же у вас цель лишь привлечь трафик из поиска по изображениям, то 2000 фото делать необязательно, можно ограничиться 10-20 тью на одну страницу.

@Devaka
Понятно, спасибо. Дело в том что я предлагал галерею. Но нет. Человеку нужно чтоб все осталось так, как есть:) А если разбить страницы по месяцам, получится по 200 фото на странице. На 200 фото 50 разный альтов тайтлов будет побожески?:) Я понимаю, что нужно 200 альтов и тайтлов, но как-то не сильно хочется тратить время…
Страницы созданы походу для трафика и чтобы на них ссылаться можно было ссылаться, непосредственно при общении с клиентом (например показать примеры тканей… как я понял.)

П.С: просто попросили чтоб поля альт и тайтл небыли пустыми (за сео, продвижение и тд и тп разговоров небыло). Такими действиями санкций я не навлеку?:) вот собственно все что интересует))

Картинка должна быть уникальной, чтобы она учитывалась или нет?
У яндекса очень жесткий отбор на уникальность картинок, так что он скопированные и даже измененные не выдаст в поиске картинок.

@Андрей:

просто попросили чтоб поля альт и тайтл небыли пустыми (за сео, продвижение и тд и тп разговоров небыло). Такими действиями санкций я не навлеку?:)

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

@Александр:


Картинка должна быть уникальной, чтобы она учитывалась или нет?

Учитывалась, в плане “попала в поиск”? Для Яндекса может быть и неуникальной, но тогда он в списке сайтов, где она расположена покажет лишь топ лучших на его взгляд ресурсов (по размеру картинки и авторитетности сайта). Для Гугла в индекс может и не попасть, но всё же часто можно найти и неуникальные изображения в поиске (обычно они неуникальны лишь визуально).

@Devaka
Спасибо за ответ:)) Вы как всегда на высоте! хотел подписаться на ррс, оказывается я уже подписан:)

Обычно больше 5 слов никогда в альт не пишу… И не может быть какой-то погрешности из-за повторения двух слогов?

Спасибо. полезно.
Ещё идеи принимаете для экспериментов? Мне любопытно насколько учтываются (и учитываются ли вообще) атрибуты title у ссылок? если да, то как с их длинной?

А что по поводу 200 картинок на странице (выше написано было) – радуйтесь, что есть столько! Прописав им всем альты и титлы, имеете ОЧЕНЬ хороши шансы на топ по этим фразам. Проверено.

Недавно начал читать ваш блог. Спасибо за нужный эксперимент.

а для титла в случае текстовых ссылок данное правило актуально?

Отличный материал. ALT к картинкам обычно всегда прописываю.

Теперь всегда на СДЛ буду прописывать альты к картинкам.

Спасибо, только хотел проводить похожий эксперемент т.к для оптимизации статьи по рекомендациям Кэтса надо картинки нормально оптимизировтаь т.е граф содержание.

Спасибо за интересный эксперимент

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

Спасибо за эксперимент, как раз сейчас рабоатю над оптимизацией изображений.
Если вдруг кто захочет повторить и немного развить условия теста: интересно было бы узнать, есть ли разница в длине воспринимаемого текста для кириллицы и латинницы.

Если альты изначально не прописаны, есть ли смысл делать это сейчас? Если нет, то почему?
P.S Изображения все уникальные.

Татьяна, конечно смысл есть. Это обязательно нужно сделать.
Не делать это можно только по одной причине — лень ��

Вообще, атрибут alt является ОБЯЗАТЕЛЬНЫМ , и его отсутствие считается ошибкой (правда он может быть пустым, но присутствовать в коде должен обязательно)

Он у меня есть, но пустой. Прописать не лень, другое дело, говорят что это все равно уже ничего не даст, напрасная трата времени. Так ли это?

Любопытно, кто это говорит. Мат Катс так не считает, по крайней мере �� Я ему как-то больше доверяю.
Вот рекомендации от Гугла:
http://www.google.com/support/webmasters/bin/answer.py?answer=114016

Если бы альт был не нужен, он не был бы обязательным. Поисковики пока что судят о содержании изображения в основном по alt и окружающему тексту.

Ха, прикольно почитать. Пропишу альты, Я с вами полностью согласна, спасибо за ответы:))

Очень интересная статья! На одном из моих сайтов сейчас конкретно занимаюсь продвижением картинок. Явно возьму на обозрение вашу статью, до этого использовал просто ключевое слово в АЛЬТ . Теперь буду знать, что можно разбавить, а как следствие, получить больше трафика. Или все таки лучше прямое вхождение, что бы не разбивать вес?

Занимаюсь недавно вёрсткой, и хочу теперь спросить. Получается выгодней вместо background описания картинок, вставлять реальные с титлами? Вовремя я статью прочитал. Спасибо. Надеюсь, что ещё актуально.

А можно ли в атрибут title изображения и в атрибут alt, вписывать одинаковую ключевую фразу? И является ли атрибут title для изображений, сколько значимым для индексации статьи?

Помогите разобраться с картинками, пожалуйста! Впервые выложили сайт в интернет, у нас было 20 картинок. Все быстро проиндексировались и находились и в Гугле, и в Яндексе. Названия были рандомные – типа img111. Мне посоветовали переименовать картинки, чтобы было понятно, что на ней, например, kotik.jpg. Я переименовала все картинки с нашей продукцией, оставила только логотип, шапку и всё, что относится к дизайну сайта. На страницах переписала пути картинок, залила их, удалила старые. И больше месяца уже новые картинки у нас не индексируются в поисковиках, только старые. Хотя на всех фотках есть альты и тайтлы, и по ним всё находилось до перезаливки. Что чем причина неиндексации и что можно сделать?

Ольга, ничего не поделаешь, нужно ждать переиндексации. Зря конечно вы картинки переименовали. Достаточно было бы изменить атрибуты альт-тайтл и описания.

Теперь начинает наводить на мысль. Может ли страница быть пессимизирована со стороны Гугла за “спамные alt”. Например ,если на странице много фотографий и у каждой почти одинаковые alt, только в конце “№..”

Сергей не подскажете, а можно ли использовать «точку» в alt?
то есть когда alt будет «текст. текст»

Сильно ли изменились данные на сегодня?

Подскажите, в Alt вводятся атрибуты без запятой? Как я понял. Если мне надо перечислить значения, например?. .

Понравилась статья? Поделиться с друзьями:
Кодинг, CSS и SQL