сначала в подборе ключевых запросов для конкретной веб-страницы, определении размера целевого «SEO-текста» и необходимой частоты ключевых слов в нём, а затем в формулировании предложений и фраз, содержащих в себе ключевые запросы определённое количество фраз в разных падежах, единственном и множественном числе, при разных формах глаголов. Эти параметры могут потом корректироваться по результатам выдачи поисковых систем. При этом задача SEO-копирайтера — написать оригинальный текст таким образом, чтобы подобная оптимизация была как можно менее заметна «живому» читателю. Широко применяется также включение ключевого запроса

• HTML-теги title, meta description, h1, alt, атрибут meta keywords.

Другой пример серой оптимизации — дорвей без редиректа, когда при попадании на дорвей не происходит автоматического перенаправления на продвигаемый сайт.

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

Чёрная оптимизация

• чёрной оптимизации относятся все методы, которые противоречат правилам поисковых систем. Среди них можно выделить следующие: использование дорвеев (страниц и ресурсов, созданных специально для роботов поисковых систем, зачастую с большим количеством ключевых слов на странице), приём под названием клоакинг (пользователю отдаётся одна страница, легко читаемая, а поисковому роботу — другая, оптимизированная под какие-либо запросы), использование скрытого текста на страницах сайта, использование «однопиксельных ссылок».

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

Ключевые слова (англ.- Keywords) представляют собой слова (или их набор), которые описывают тему сайта или текст, и используются поисковыми системами для обеспечения точного соответствия (релевантности) результатов поиска».

Другими словами, именно при помощи ключевых слов вы должны описать свой сайт, а поисковые машины Google, Yandex, Bing и др. на основании такого

---

«описания» включат ваш сайт в поисковую выдачу при обработке пользовательских запросов, соответствующих вашей тематике.

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

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

---

Почему нельзя перенасыщать сайт ключевыми словами?

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

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

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

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

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

Семантическое ядро – является необходимой частью seo. Этап создания семантического ядра делится на 3 основные части:

— определяем основные направления

— подбираем ключевые слова

— распределяем их по сайту

Почему важно правильно рассчитать плотность? Невысокая плотность означает то, что поисковики даже не обратят внимания на слово. Чересчур высокая, наоборот, привлечёт внимание, но только лишь затем, чтобы «забанить». Поскольку поисковик решит, что это спам и включит соответствующий фильтр.

---

Лекция 8.

Добавление медиа-контента

1. Добавление изображений Тег <img>

Чтобы добавить изображения на страницу мы используем строчный элемент <img>. Для работы <img> должен быть включен атрибут src со значением, указывающим исходник изображения - URL, обычно относительно сервера, на котором размещён сайт.

Наряду с атрибутом src долженможет быть применён атрибут alt или title (альтернативный текст). Альтернативный текст будет отображаться вместо изображения, если по какой-то причине изображение не доступно.

<img src="dog.jpg" alt="Изображение о собаке" title="Изображение о собаке">

Favicon (сокр. от англ. FAVorite ICON — «значок для избранного») — значок веб-страницы. Отображается браузером во вкладке перед названием страницы, а также в качестве картинки рядом с закладкой, во вкладках и в других элементах интерфейса.

Традиционно использовались изображения размера 16×16 пикселей формата ICO, под именем favicon.ico

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

Рис. Отображение иконки в строке браузера (без и с использованием favicon)

Adobe Photoshop не понимает формат ICO и не сохраняет в нем рисунки, так что для этой цели требуется дополнительный плагин. Но формат рисунка не обязательно должен быть ICO, также допускается использование GIF и PNG (многие браузеры показывают favicon и в формате JPG). Прописывается следующим образом:

<head>

<link rel="shortcut icon" href="/images/favicon.ico" type="image/x-icon">

</head>

ИЛИ

<head>

<link rel="shortcut icon" href="/images/favicon.png" type="image/png">

</head>

---

Увеличение (зумирование изображений)

Способ 1. Увеличение изображения при наведении со смещением блоков.

Разметка в html:

<img src="images/image.jpg" class="zoom"> <!—Применяем класс zoom –

увеличение, значения которого пропишем в css->

Разметка в css:

.zoom:hover { zoom: 3.0; } /* Число с плавающей запятой, значение 1.0 соответствует normal. Значения больше 1.0 увеличивают масштаб объекта, значения меньше 1.0 уменьшают масштаб. */

• данном примере масштаб рисунка увеличивается в три раза при наведении на него курсора мыши.

Способ 2. Увеличение изображения при наведении без смещения блоков.

Разметка в html:

<div class="image"><img src="Pict/img1.jpg"></div>

Разметка в css:

.image img {

transition: all 0.5s ease-out; /* Устанавливает эффект перехода между двумя состояниями элемента – статическим и с использованием псевдокласса :hover*/

}

.image img:hover{

transform: scale(3.0); /* преобразовывает элемент при наведении курсора*/

}

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

Значения transition:

all - все свойства будут трансформироваться, используется по умолчанию.

0.5s - задаёт время в секундах, сколько должна длиться анимация перехода до её завершения (в данном случае установлено 0,5 секунды).

ease-out - анимация начинается быстро, к концу замедляется.

ease-in - анимация медленно начинается, к концу ускоряется.

ease - анимация начинается медленно, затем ускоряется и к концу движения опять замедляется.

ease-in-out - анимация начинается и заканчивается медленно.

linear - одинаковая скорость от начала и до конца.

Значения transform:

---

Смотрите также файлы

• Техническое задание.doc

• Техническое задание_пример.doc

• Art-direction.pdf

• Введение в профессию. Основные понятия веб-разработки - занятие 1.pdf

• КЛАССЫ, ИДЕНТИФИКАТОРЫ, СЕЛЕКТОРЫ - занятие 2.pdf.pdf