Как сделать ваше приложение Angular 4 SEO дружественным

  1. Начало работы с SEO-приложением для Angular 4
  2. Настройка нашего тестового приложения Angular 4
  3. Делаем приложение Angular 4 SEO дружественным
  4. Тестирование нашего дружественного к SEO приложения Angular 4
  5. Заключение

Приложения Angular 4 загружают первый чистый HTML-контент перед извлечением HTML-контента для страницы, загружаемой с использованием XMLHttpRequest. Одностраничные приложения потрясающие! Они загружаются быстро и дают вам большой контроль над тем, как вы хотите, чтобы ваше приложение работало. Они анализируются браузером, и, таким образом, у вас есть контроль над элементами DOM и всем этим.

Тем не менее, SPA не являются SEO дружественными, потому что им нужно динамически изменять метатеги и контент с помощью JavaScript, и это изменение обычно не воспринимается ботом поисковой системы. Поскольку некоторые поисковые роботы не могут анализировать JavaScript при сканировании веб-сайта, они будут видеть только первый голый контент каждый раз.

Хотя Гугл говорит их боты теперь способны рендерить JavaScript, это все еще неясная область, и ошибка в осторожности будет лучшим способом решения этой проблемы. Также есть другие поисковые системы, которые не обрабатывают JavaScript. Эта статья расскажет, как сделать ваше приложение для Angular 4 более удобным для SEO и таким образом облегчить его использование роботами поисковых систем.

⚠️ Это не учебник по Angular 4, и мы не будем рассказывать о специфике платформы Angular 4. Мы просто покажем вам, как использовать рендеринг на стороне сервера для обслуживания полностью сгенерированной HTML-страницы.

Начало работы с SEO-приложением для Angular 4

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

Настройка нашего тестового приложения Angular 4

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

Создание нового приложения с использованием ng-cli
Для настройки мы будем использовать команду ng new для создания приложения Angular 4.

$ ng new Blogist

⚠️ Примечание. Для правильной работы этого приложения вам потребуется последняя версия Angular CLI. Последняя версия 1.3.x на момент написания этой статьи.

Далее мы просто создадим компонент, в который затем сможем добавить логику нашего кода. Для этого мы будем использовать команду компонента ng g:

Компонент $ ng g ./blog/posts

Добавление фиктивных данных в наш PostComponent
Для краткости мы не будем подключаться к внешнему API. Вместо этого мы просто будем создавать некоторые фиктивные данные и использовать эти данные в нашем приложении.

Откройте файл ./src/app/blog/posts.component.ts, и мы добавим некоторую логику в код, чтобы убедиться, что он работает так, как нам нужно. Во-первых, давайте жестко закодируем некоторые данные в файл. Добавьте новый метод postsData к компоненту.

private postsData () {return [{"title": "Создание Angular.js в реальном времени с мраморными Websockets", "pubDate": "2017-08-23 14:41:52", "link": "https: // blog.pusher.com/making-angular-js-realtime-with-pusher/#comment-10372 "," guid ":" http://blog.pusher.com/?p=682#comment-10372 "," author ":" marble "," thumbnail ":" "," description ":" всегда большой поклонник ссылок на блоггеры, которые мне нравятся, но я не получаю много удовольствия от ссылок "," content ":" <p> всегда большой поклонник ссылок на блоггеры, которые мне нравятся, но я не получаю много удовольствия от ссылок из </ p> "," enclosure ": []," Categories ": []}, {" title ":" Создание Angular .js в режиме реального времени с Websockets без бретелек ремешком на "," pubDate ":" 2017-08-23 05:05:08 "," link ":" https://blog.pusher.com/making-angular-js-realtime -with-pusher / # comment-10371 "," guid ":" http://blog.pusher.com/?p=682#comment-10371 "," author ":" ремень без бретелек "," thumbnail ": "", "description": "очень несколько интернет-сайтов, которые будут подробно описаны ниже, с нашей точки зрения w, несомненно, стоит проверить "," content ":" <p> пара веб-сайтов, которые будут подробно описаны ниже, с нашей точки зрения, несомненно, стоит проверить </ p> "," enclosure ": [], "Categories": []}, {"title": "Создание Angular.js в реальном времени с помощью Websockets с помощью ограничений связывания", "pubDate": "2017-08-22 17:09:17", "link": "https://blog.pusher.com/making-angular-js-realtime-with-pusher/#comment-10370", "guid": "http://blog.pusher.com/?p=682#comment -10370 "," author ":" ограничения рабства "," thumbnail ":" "," description ":" очень немногие веб-сайты, которые оказываются в глубине ниже, с нашей точки зрения, несомненно, заслуживают того, чтобы их проверить " , "content": "<p> очень немногие веб-сайты, которые находятся ниже, с нашей точки зрения, несомненно, стоит проверить </ p>", "enclosure": [], "Categories": []}]; }

Чтобы использовать наши фиктивные данные, созданные выше, замените метод конструктора класса PostsComponent на код ниже:

публичные посты; constructor () {this.posts = this.postsData (); }

В приведенном выше коде мы просто присвоили свойству posts возвращаемое значение postsData, которое является нашим имитированным ответом на вызов API.

Создание представления для нашего PostsComponent
Теперь, когда у нас есть данные о ложных публикациях. Мы создадим представление, которое будет отображать все сообщения из наших фиктивных данных.

Откройте ваше представление ./app/blog/posts.component.html и введите код ниже:

<div class = "jumbotron"> <h1> Blogist </ h1> <p> Это лучший ресурс для лучших публикаций по веб-разработке. </ p> </ div> <div class = "row"> <div class = "col-xs-12 col-md-12"> <ul class = "list-group"> <li class = "list-group-item" * ngFor = "публиковать сообщения"> <h4> {{ post.title}} </ h4> </ li> </ ul> </ div> </ div>

Код выше просто берет данные постов и проходит через них; каждый раз отображается заголовок поста.

Затем откройте файл index.html и в разделе <head> замените содержимое следующим кодом. Он в основном использует Bootstrap и добавляет фиктивную панель навигации:

<! doctype html> <html lang = "en"> <head> <meta charset = "utf-8"> <title> Блогист </ title> <base href = "/"> <meta name = «viewport» content = "width = device-width, initial-scale = 1"> <link rel = "icon" type = "image / x-icon" href = "favicon.ico"> <link rel = "stylesheet" href = "https : //cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css "> </ head> <body> <nav class =" navbar navbar-default "> <div class = "container-liquid"> <div class = "navbar-header"> <a class="navbar-brand" href="#"> Блогист </a> </ div> <ul class = "nav navbar- nav "> <li class =" active "> <a href="#"> Сообщения </a> </ li> <li> <a href="#"> Веб-разработка </a> </ li> < li> <a href="#"> Графический дизайн </a> </ li> </ ul> </ div> </ nav> <div class = "container"> <app-root> Загрузка ... < / app-root> </ div> </ body> </ html>

Регистрация PostsComponent с нашим модулем приложения
Следующее, что мы сделаем, это зарегистрируем PostsComponent с нашим модулем приложения.

💡 Обратите внимание, что использование команды ** ng g component ** автоматически зарегистрирует компонент в модуле приложения. Таким образом, вам не нужно делать это снова. Если это было сделано для вас, вы можете пропустить этот шаг.

Если он не был зарегистрирован автоматически, откройте файл ./src/app/app.module.ts и импортируйте PostsComponent:

import {PostsComponent} из './blog/posts.component';

Затем в массиве объявлений NgModule добавьте PostsComponent в список:

@NgModule ({объявлений: [... PostsComponent,], ...})

Отображение вашего углового приложения
После регистрации нашего компонента Posts мы добавим его в наш файл ./src/app/app.component.html, чтобы отобразить компонент posts. Откройте файл ./src/app/app.component.html и добавьте в него следующий код:

<приложение-сообщения> </ приложение-сообщения>

Это все!

Теперь, когда вы запустите ng serve и перейдете по URL, предоставленному вам на вашем терминале. Вы должны увидеть страницу с нашими сообщениями:

Отлично, это именно то, что мы ожидали. Однако при просмотре источника URL-адреса вы заметите, что отсутствует все тело страницы, и видна только часть <app-root> loading… </ app-root>.

Это из-за того, как работает Angular. Сначала будет загружен родительский шаблон, а затем сам.

Затем он запустит процесс манипулирования DOM, который вставит содержимое каждой последующей страницы в тег <app-root>.

Следовательно, когда робот поисковой системы запрашивает эту страницу, он получает HTML <app-root> Загрузка… </ app-root> выше, и содержимое страницы, которая должна была способствовать SEO, теперь неизвестно движку.

Делаем приложение Angular 4 SEO дружественным

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

Project Проект Angular Universal состоит из API базовой платформы и окружающих инструментов, которые позволяют разработчикам выполнять рендеринг (или предварительный рендеринг) приложений Angular на стороне сервера.

Для начала мы будем устанавливать пакет angular / platform-server и пакет angular / animations. Оба необходимы для правильной работы сервера платформы. Сервер платформы будет предоставлять серверный рендеринг.

Запустите приведенную ниже команду в своем терминале, чтобы установить зависимости, необходимые для рендеринга на сервере вашего приложения Angular:

$ npm install --save @ angular / platform-server @ angular / animations

После успешной установки пакетов с помощью NPM откройте ./src/app.modules.ts и внесите следующие изменения в объявление BrowserModule:

@NgModule ({... import: [BrowserModule.withServerTransition ({appId: 'blogist'})], ...})

В приведенном выше коде мы добавили метод withServerTransition в модуль BrowserModule, и там мы передали appId, который совпадает с именем блогиста приложения. Это дополнение «настраивает приложение на основе браузера для перехода от приложения, отображаемого на сервере, если оно присутствует на странице».

Следующее, что мы сделаем, это создадим модуль сервера приложений. Создайте новый файл ./src/app/app-server.module.ts

импортировать {NgModule} из '@ angular / core'; import {AppModule} из './app.module'; import {AppComponent} из './app.component'; импортировать {ServerModule} из '@ angular / platform-server'; @NgModule ({import: [ServerModule, AppModule,], начальная загрузка: [AppComponent]}) класс экспорта AppServerModule {}

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

Добавление заголовка и мета-тегов в наше приложение Angular
Последнее, что мы добавим в приложение, - это поддержка метатегов и заголовков на каждой странице. С Angular Universal сделать это очень легко.

Откройте файл ./src/app/blog/posts.component.ts и выполните следующие действия:

Импортируйте мета и заголовок из пакета @ angular / platform-browser:

import {Meta, Title} из '@ angular / platform-browser';

Теперь в методе конструктора добавьте следующие строки кода:

конструктор (meta: Meta, title: Title) {this.posts = this.postsData (); // Устанавливает <title> </ title> title.setTitle ('Blogist'); // Устанавливает тег <meta> для страницы meta.addTags ([{name: 'author', content: 'Blogist'}, {name: 'description', content: 'Это описание.'},]) ; }

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

Создание сервера Express, чтобы сделать ваше приложение для Angular SEO дружественным
Давайте создадим экспресс-сервер. Это в основном позволит серверную визуализацию страницы.

Создайте новый файл в ./src/server.ts и затем добавьте содержимое ниже:

импорт 'отражать-метаданные'; импорт 'zone.js / dist / zone-node'; import {renderModuleFactory} из '@ angular / platform-server' import {enableProdMode} из '@ angular / core' import * как экспресс из 'express'; import {join} из 'path'; import {readFileSync} из 'fs'; import {AppServerModuleNgFactory} из '../dist/ngfactory/src/app/app-server.module.ngfactory' enableProdMode () const PORT = process.env.PORT || 4000 const DIST_DIR = join (__dirname, '..', 'dist') const app = express (); const template = readFileSync (join (DIST_DIR, 'index.html')). toString () app.engine ('html', (_, options, callback) => {const newOptions = {document: template, url: options. req.url}; renderModuleFactory (AppServerModuleNgFactory, newOptions) .then (html => callback (null, html))}) app.set ('views', 'src') app.set ('view engine', 'html' ) app.get ('*. *', express.static (DIST_DIR)) app.get ('*', (req, res) => {res.render ('index', {req})}) app. listen (PORT, () => {console.log (`Приложение прослушивает http: // localhost: $ {PORT}!`)});

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

Затем мы включаем ProdMode (), который просто включает производственный режим в нашем приложении. Мы также используем [renderModuleFactory] (https://angular.io/api/platform-server/renderModuleFactory) для анализа HTML-кода и визуализации страницы, которая загружалась на стороне сервера. Все остальное в коде связано с Express.

Следующее, что мы хотим сделать сейчас, это открыть наш файл ./src/tsconfig.app.json и добавить server.ts в раздел исключения файла.

"exclude": ["server.ts", ...]

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

Также откройте файл ./tsconfig.json и добавьте приведенный ниже фрагмент к файлу в корне проекта прямо под свойством compilerOptions:

... "lib": ["es2016", "dom"]}, "angularCompilerOptions": {"genDir": "./dist/ngfactory", "entryModule": "./src/app/app.module# AppModule "}}

Gen GenDir - это то, куда все сгенерируется. EntryModule принимает путь нашего основного загрузочного модуля. #AppModule в конце пути - это имя экспортируемого класса.

Последний шаг - обновление свойства scripts в нашем файле ./package.json. Вам следует либо заменить, либо добавить это к ключам, уже имеющимся в свойстве scripts:

{... "scripts": {"prestart": "ng build --prod && ./node_modules/.bin/ngc", "start": "ts-node src / server.ts"}, ...}

У нас есть команды, зарегистрированные для сценариев запуска и предварительного запуска в файле ./package.json. Поскольку мы добавили pre к имени start , оно будет запускаться автоматически перед вызовом сценария start .

Тестирование нашего дружественного к SEO приложения Angular 4

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

$ npm run start

Это запустит сценарий предварительного запуска, который содержит команды ng build --prod && ./node_modules/.bin/ngc, а затем запустит запуск сценария, который содержит команду ts-node src / server.ts. Как только команды завершены, вы должны увидеть вывод, близкий к этому, на вашем терминале:

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

Заключение

В этой статье мы выяснили, как сделать ваше приложение Angular 4 Single Page Application (SPA) SEO удобным с помощью Angular 4 Universal. Надеюсь, вы узнали что-то одно или два, и страх перед плохой оптимизацией SEO больше не помешает вам использовать Angular 4 для ваших приложений.

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

Похожие

SEO
Посмотрите, что один из наших счастливых клиентов говорит о наших услугах SEO ниже. Или зайдите на нашу страницу отзывов, чтобы узнать, почему так много наших клиентов рады поделиться своими историями успеха. Вы также можете проверить наши самые последние SEO Case Study узнать, как мы улучшили их рейтинг и рентабельность инвестиций всего за 6 коротких месяцев, и как мы можем сделать это и для вас.
Сделать Drupal SEO дружественным
... дружественным ? Вы можете начать с просмотра списка Drupal SEO модули которые доступны бесплатно. Кроме того, я только что закончил версию 1 моего Модуль Drupal SEO Friend , Он был принят на drupal.org и доступен по адресу: https://www.drupal.org/project/seo_friend , Загрузите файл tar, распакуйте
SEO серия
SEO серия Молодой, удивительный, активный и классный. LED LENSER® SEO - это молодая, захватывающая серия фар с яркими цветами, стильным дизайном и превосходной мощностью освещения. Благодаря эффектной упаковке
Брисбен SEO
SEO - это искусство оптимизации страниц вашего сайта для привлечения целевого трафика на него. Чем больше посетителей вашего сайта, тем больше потенциальных клиентов или продаж. В SiteZero мы предлагаем решения SEO , которые сделают вас более привлекательными для поисковых систем и увеличат ваш трафик. Мы применяем обширные стратегии и методы на странице и за ее пределами, которые помогут вам
Нью-Йорк Seo
... SEO компании ... Услуги SEO или поисковой оптимизации важны для маркетинга и рекламы вашего бизнеса. По этой причине важно, чтобы вы искали лучшее SEO эксперт Нью-Йорк должен получить лучшие нью-йоркские услуги SEO . При принятии решения о выборе компании необходимо учитывать множество факторов. Например, вы хотите убедиться, что их цены конкурентоспособны, что они обещают результаты, и
Как улучшить SEO вашего блога
Вы отключаетесь при простом упоминании о SEO или поисковой оптимизации? SEO, возможно, является одним из наиболее неправильно понятых элементов ведения блога. Люди думают, что SEO должно
SEO Услуги Бостон, Бостон SEO Компания Визион SEO
Мы местные Бостонская SEO компания , С нашим SEO услуги Мы уверены, что предлагаем политику
Основы международного SEO
Создание предприятия, которое будет успешным не только на местном, но и на международном уровне, является мечтой каждого предпринимателя. В какой-то момент роста вашего стартапа вы неизбежно подумаете о том, чтобы стать глобальным, особенно если значительная часть трафика вашего веб-сайта или пользовательской базы уже происходит из разных стран. Поскольку цифровое присутствие имеет решающее значение, после определения стран, на которые нужно ориентироваться, вам придется оценить возможности
Как мета-теги следует использовать для SEO
Последняя проверка 11 марта 2019 года в 08:00 В моем предыдущем посте
Как запустить мастер настройки Yoast SEO
... SEO Плагин для WordPress, теперь мы покажем вам, как запустить мастер настройки Yoast SEO . Это поможет вам быстро оптимизировать ваш сайт для поисковых систем, используя инструменты, включенные в Yoast. Войдите в свою панель WordPress ,
Обзор SEO BigCommerce
При выборе платформы корзины покупок, SEO должно быть одним из ваших главных соображений, если не ваше мнение № 1. Если ваш сайт электронной коммерции не имеет первоклассного SEO, ваш рейтинг в поисковых системах - и ваша прибыль - пострадают. Как генеральный директор и основатель одной из крупнейших в Лос-Анджелесе компаний, занимающихся веб-дизайном и SEO, я снова и снова являюсь свидетелем того, как SEO может создать или сломать успех бизнеса.

Комментарии

3. Как я могу сделать SEO максимально простым и безболезненным?
3. Как я могу сделать SEO максимально простым и безболезненным? Если вы владелец магазина SupaDupa, вы можете дышать спокойно - вы уже на полпути. Мы хотим, чтобы вы добились успеха, а это значит, что мы уже сделали массу вещей, которые, как мы знаем, поисковые системы любят видеть в онлайн-магазинах, поэтому вам не нужно о них беспокоиться. Если вы еще не используете SupaDupa, посмотрите, предлагает ли ваша платформа электронной коммерции эти две важные функции:
Как вы думаете, SEo лучше, чем Google Awords и другие платные медиа, такие как Outbrain?
Как вы думаете, SEo лучше, чем Google Awords и другие платные медиа, такие как Outbrain? Это просто вопрос разных подходов для разных рынков? Если вы не знаете, с чего начать составление бюджета для кампании, посмотрите на предлагаемые виды SEO-услуг и начните исследование. Поговорите со специалистами в обеих областях и особенно поговорите с другими компаниями о своих стратегиях. Предприятия, которые уже выполняют свою работу и пользуются определенным успехом.
Как сделать хороший SEO в Google?
Как сделать хороший SEO в Google? 1º-Оптимизация заголовков и метаописаний Заголовок или заголовок используется для описания темы страницы. Оно должно быть коротким, лаконичным и привлекательным и должно включать основное ключевое слово, естественно, и на каждой странице должен быть только один заголовок. Идеальная длина заголовка не должна превышать 65 символов. Мета-описание служит дополнением к названию и очень важно, поскольку оно влияет на
Итак, что вы можете сделать, чтобы ваше мобильное приложение отображалось в списках поисковых систем?
Итак, что вы можете сделать, чтобы ваше мобильное приложение отображалось в списках поисковых систем? Создайте целевую страницу или микросайт для начала. Наличие присутствия в Интернете является отправной точкой в ​​использовании трафика, поступающего в ваше приложение. Чем больше деталей у микросайта, тем лучше. Если у вас есть блог, связанный с вашим продуктом и целевой страницей, даже лучше.
Как видео влияет на SEO и продажи?
Как видео влияет на SEO и продажи? # инфографика 5 (100%) 4 голоса Визуальный контент популярен, эффективен для SEO и маркетинга; Но знаете ли вы, как видео влияют на SEO и продажи ? в Саламанка Позиционирование сайта Мы поговорим о преимуществах этого типа контента и о том, почему
Вы можете увидеть, что мой URL, мой заголовок, мои заголовки и другие, которые я намеренно сделал, содержат ключевые слова "как сделать SEO веб-сайт"?
Вы можете увидеть, что мой URL, мой заголовок, мои заголовки и другие, которые я намеренно сделал, содержат ключевые слова "как сделать SEO веб-сайт"? Если посетители ненавидят ваш сайт, они уйдут сразу же после того, как они придут ...Пользовательский опыт, в настоящее время поисковые системы достаточно развиты, чтобы распознавать, какие сайты обеспечивают хороший
SEO тексты: Как мне написать SEO текст максимально выгодно для Google?
SEO тексты: Как мне написать SEO текст максимально выгодно для Google? SEO написание текстов - это больше, чем просто уделение внимания хорошей плотности ключевых слов в наши дни. Google говорит, что нужно уделять гораздо больше внимания качеству контента, чем хорошо написанному контенту. Хотя это то, что мы думаем о Интеллектуальный Интернет Тем не менее, этот хорошо оптимизированный
Вопрос № 7: Как нам найти лучшую местную компанию SEO для нашего бизнеса?
Вопрос № 7: Как нам найти лучшую местную компанию SEO для нашего бизнеса? Есть несколько вопросов для рассмотрения и пути для их решения. Но, прежде чем тратить время на поиск хорошего местного агентства SEO, имейте правильные ожидания. Ниже приведено несколько квалификаций, которые мы просим наших клиентов, которые вы захотите задать себе (поскольку хорошее местное агентство SEO не будет работать ни с кем): Кого вы пытаетесь достичь? Какие места нуждаются
Могу ли я сделать мой SEO сам?
Могу ли я сделать мой SEO сам? Краткий ответ на этот вопрос: да, каждый может заниматься своим SEO. Однако, если бы это было так просто, мы уверены, что вы бы сейчас не читали эту страницу. В Дапа Маркетинг Мы не претендуем на все ответы и магический трюк, который мгновенно даст вам желаемый результат. Однако есть причина, по которой вы попали на эту страницу, и не только потому, что мы находимся на вершине результатов
Как оценить качество вашей SEO стратегии?
Как оценить качество вашей SEO стратегии? Существуют различные инструменты и ключевые элементы, когда дело доходит до измерения качества разрабатываемой стратегии SEO . Ниже приведены основные из них: Инструменты
Итак, как вы используете SEO, чтобы получить максимальную отдачу от контента вашего бизнеса?
Итак, как вы используете SEO, чтобы получить максимальную отдачу от контента вашего бизнеса? Как вы используете свои ключевые слова, чтобы сделать свой бизнес видимым? Главное, чтобы ваши ключевые слова были правильно размещены как на вашей веб-странице, так и за ее пределами. 1. Название Самая важная часть вашего контента - это первая часть, которую каталоги поисковых систем ищут при поиске на вашем сайте. Ваш заголовок - это краткое, интересное описание того, что обсуждается

Com/?
Com/?
Com/?
Дружественным ?
3. Как я могу сделать SEO максимально простым и безболезненным?
3. Как я могу сделать SEO максимально простым и безболезненным?
Как вы думаете, SEo лучше, чем Google Awords и другие платные медиа, такие как Outbrain?
Это просто вопрос разных подходов для разных рынков?
Как сделать хороший SEO в Google?
Как сделать хороший SEO в Google?

Вход