Угловое SEO сделано правильно с рендерингом на стороне сервера [Live Demo]

Зачем беспокоиться об Angular SEO? Разве Angular не поддерживается Google?
Как справиться с угловыми проблемами SEO
Техническое руководство: угловой SEO-ориентированный пример SPA с Universal
1. Настройка структуры проекта с использованием Angular CLI
2. Создание первого углового компонента
2.1 Пересмотр списка товаров
3. Перечисление продуктов приложения
4. Добавление маршрутизации в приложение Angular
5. Создание компонента продукта
6. Интеграция функций корзины покупок
7. Использование Angular Universal для SEO
7.1 Установка Angular Universal
7.2 Редактирование клиентского приложения
7.3 Настройка сервера
7.4 Сборка и запуск приложения
GitHub repo & live demo
Заключительные мысли

В спешке? Пропустить техническое руководство или же живое демо ,

Сканирование и рендеринг JavaScript в Google все еще остается неясной проблемой.

Противоречивые утверждения и эксперименты встречаются по всей сети.

Так что это значит?

Как разработчик, вам НУЖНО оптимизировать сайты, созданные с использованием популярных JS-фреймворков для SEO.

Имея это в виду, вот третья часть нашей текущей серии выпусков JavaScript Frameworks:

Создание предварительно визуализированного приложения Vue.js
Применение React SEO с Next.js ,
Здесь я буду заниматься Angular SEO.

Точнее, мы создадим рендеринг серверного SPA Angular с использованием Universal .

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

Настройка Angular проекта.
Создание угловых компонентов.
Включение функции электронной коммерции в нашем SPA.
Используя Universal, чтобы сделать наше угловое приложение SEO-дружественным

Это должно быть весело!

Зачем беспокоиться об Angular SEO? Разве Angular не поддерживается Google?

угловатый JS-фреймворк с открытым исходным кодом, разработанный инженерами Google в 2010 году.

Это здорово, чтобы завершить стек без головы или любой JAMstack в этом отношении. Но он все еще разделяет общие проблемы SEO, известные JavaScript-фреймворкам.

Одностраничные приложения JS добавляют контент на страницы динамически с помощью JavaScript. Это не оптимально для SEO: сканеры, скорее всего, не будут запускать код JS, таким образом, не сталкиваясь с фактическим содержанием страницы.

Начиная с 2018 года, по слухам, Google может сканировать и отображать страницы, заполненные JavaScript, читая их, как это делают современные браузеры. Хотя цитаты из гиганта сам по себе заставляю меня не так оптимистично

«Времена изменились. Сегодня, пока вы не запрещаете роботу Googlebot сканировать ваши файлы JavaScript или CSS, мы обычно можем отображать и понимать ваши веб-страницы, как современные браузеры».

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

«Иногда JavaScript может быть слишком сложным или загадочным, чтобы мы могли его выполнить, и в этом случае мы не можем отобразить страницу полностью и точно».

В то время как Google изо всех сил пытается представить ваш JS, он все равно превосходит всех других поисковых и социальных сканеров (Facebook, Twitter, LinkedIn). Оптимизация рендеринга вашего приложения, таким образом, принесет пользу вашей деятельности на этих каналах!

Это слишком много неиндексированного контента JavaScript, чтобы оставить его на столе.

Как справиться с угловыми проблемами SEO

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

→ Получить как Google

Если у вас уже есть общедоступное приложение Angular, перейдите на Google Search Console и беги Просмотреть как Google на страницах, которые нуждаются в индексации. Он расскажет вам, что могут или не могут получить доступ Google-боты.

Это даст вам представление о том, какие области нуждаются в SEO-работе.

Способы сделать это на самом деле не отличаются от того, что мы уже видели в Vue или React, но инструменты делают.

→ Предварительный рендеринг

Это довольно просто. JavaScript отображается в браузере; Статический HTML сохраняется и возвращается сканерам. Это решение отлично подходит для простых приложений, которые не зависят от какого-либо сервера. Это проще в настройке, чем рендеринг на стороне сервера, тем не менее, с отличными результатами SEO.

Для угловой визуализации, я предлагаю посмотреть на Prerender.io ,

→ Рендеринг на стороне сервера

Вот что я сделаю здесь.

Я буду использовать SSR, используя Угловой универсальный ,

Проще говоря, это будет запускать Angular на бэкэнде, так что при выполнении запроса контент будет отображаться в DOM для пользователя.

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

Мы исследовали эти два метода в этом Vue.js видеоурок , Содержание также относится к Angular!

Означает ли использование этих методов, что вы внезапно окажетесь на вершине SERP ? Хорошо, может быть. Скорее всего, хотя? Нету. Есть много других SEO-соображений: отличный мобильный UX, связь HTTPS, карта сайта, отличный контент, обратные ссылки и т. Д. Эта почта перечисляет пару советов SEO в своем заключении!

Техническое руководство: угловой SEO-ориентированный пример SPA с Universal

Предварительные условия

Базовое понимание одностраничных приложений (SPA)
Базовые знания Машинопись [необязательный]
Учетная запись Snipcart (навсегда бесплатно в тестовом режиме)

Настройка среды разработки

Установите Angular CLI глобально, используя следующую команду:

npm install -g @ angular / cli

Я использую sass в своем проекте. Если вы решите сделать это и у вас его еще не установлено, то:

npm установить -g sass

1. Настройка структуры проекта с использованием Angular CLI

Создайте свой проект с помощью Angular CLI.

ng new my-app --style = scss --routing

Заметили, как я добавил стиль и аргумент маршрутизации в команду?

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

Как только это будет сделано, перейдите в каталог проекта и обслуживайте свой проект.

cd my-app ng serve

Теперь проект должен отображаться локально по адресу: http: // localhost: 4200 /

2. Создание первого углового компонента

Как и многие современные веб-библиотеки или платформы, Angular использует систему компонентов.

В Angular каждый компонент, кроме основного приложения, представляет собой каталог, расположенный в src / app /, содержащий три файла: файл TypeScript, файл стилей и файл HTML.

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

Используйте встроенную команду Angular CLI для генерации новых компонентов:

ng генерировать компонентные продукты ng генерировать компонентные продукты

2.1 Пересмотр списка товаров

Перед редактированием компонентов необходимо создать структуру данных для продуктов.

Создайте файл product.ts непосредственно в папке src / app / и присвойте ему все необходимые свойства.

класс экспорта Product {id: string; имя: строка; цена: номер; вес: число; описание: строка; }

Также создайте mocked-product.ts в том же месте. Этот файл импортирует класс Product и экспортирует массив Product.

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

import {Product} из './product'; export const ПРОДУКТЫ: Product [] = [{id: "ac-1", название: "Центральный кондиционер", цена: 5000,00, вес: 900000, описание: "Держите весь офис в прохладе с помощью этого центрального кондиционера." }, {id: "ac-2", название: "Оконный кондиционер", цена: 300,00, вес: 175000, описание: "Идеально подходит для охлаждения комнаты или маленькой квартиры". }, {id: "ac-3", имя: "Вентилятор", цена: 10.00, вес: 2000, описание: "Недорогой, но эффективный способ не дать своим коллегам жаловаться на жару". },]

3. Перечисление продуктов приложения

Хорошо, продукт успешно издевался! Теперь давайте перечислим наши продукты на главной странице. Для этого откройте products.component.ts и добавьте:

import {Component, OnInit} из '@ angular / core'; импортировать {PRODUCTS} из '../mocked-products'; @Component ({селектор: 'app-products', templateUrl: './products.component.html', styleUrls: ['./products.component.scss']}) класс экспорта ProductsComponent реализует OnInit {products = PRODUCTS; constructor () {} ngOnInit () {}}

Как видите, каждый компонент Angular импортирует класс Component из базовой библиотеки Angular. @Component ({}) - это функция декоратора, которая помечает класс как угловой компонент и предоставляет большую часть его метаданных.

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

Сделайте это сейчас, удалив все сгенерированные в шаблоне основного приложения (app.component.html) и добавьте соответствующий тег:

<приложение-продукты> </ приложение продукты>

Как только это будет сделано, если вы посетите веб-сайт, вас должны встретить с:

Теперь давайте изменим файл products.component.html для перечисления продуктов, используя директиву репитера Angular * ngFor и рули ({{}}) для привязки данных из вашего класса к шаблону.

<h2> Продукты </ h2> <ul * ngFor = "пусть продукт из продуктов"> <li> {{product.name}} </ li> </ ul>

4. Добавление маршрутизации в приложение Angular

Давайте превратим этот магазин в одностраничное приложение, используя встроенную маршрутизацию Angular.

Поскольку вы добавили аргумент --routing при создании проекта, вы можете перейти непосредственно в app-routing.module.ts и преобразовать его в следующий код:

импортировать {NgModule} из '@ angular / core'; import {Routes, RouterModule} из '@ angular / router'; import {ProductComponent} из './product/product.component'; import {ProductsComponent} из './products/products.component'; const route: Routes = [{путь: '', компонент: ProductsComponent}, {путь: 'product /: id', компонент: ProductComponent}]; @NgModule ({импорт: [RouterModule.forRoot (маршруты)], экспорт: [RouterModule]}) класс экспорта AppRoutingModule {}

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

Вы можете видеть, что я добавил заполнитель: id, который можно будет найти в компоненте продукта для отображения нужного продукта.

Также важно инициализировать маршрутизатор, добавив RouterModule.forRoot (route) в импорт модуля.

После этого вы можете заменить тег компонента в шаблоне приложения (app.component.html) на тег <router-outlet>:

<Маршрутизатор-розетка> </ маршрутизатор-розетка>

Тег router-outlet будет отображать соответствующий путь, указанный в массиве маршрутов. В этом случае корневой каталог будет отображать представление для компонента Products.

Теперь вы можете добавить routerLink ='lativePath 'вместо любого атрибута href =' path 'в тегах <a>. Например, вы можете обновить файл products.component.html примерно так:

<h2> Продукты </ h2> <ul * ngFor = "разрешить продукт из продуктов"> <li> <a routerLink="/product/ averageумыproduct.id‹ угр."> {{product.name}} </ a > </ li> </ ul>

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

5. Создание компонента продукта

Теперь давайте создадим компонент сведений о продукте. В свой файл TypeScript product.component.ts добавьте следующий код:

import {Component, OnInit} из '@ angular / core'; импортировать {ActivatedRoute} из '@ angular / router'; import {Location} из '@ angular / common'; импортировать {PRODUCTS} из '../mocked-products'; import {Product} из '../product'; @Component ({селектор: 'app-product', templateUrl: './product.component.html', styleUrls: ['./product.component.scss']}) класс экспорта ProductComponent реализует OnInit {products = PRODUCTS; URL: строка; продукт: продукт; конструктор (частный маршрут: ActivatedRoute, частное местоположение: местоположение) {const id = this.route.snapshot.paramMap.get ('id'); this.product = this.findProductById (id); this.url = `https://snipcart-angular-universal.herokuapp.com/$ {this.location.path ()}`; } ngOnInit () {} findProductById (productId: string): Product {return this.products.find (product => product.id === productId); }}

Выше я импортировал ActivatedRoute и Location из Angular. Это позволит вам получить productId из URL и получить текущий путь непосредственно в конструкторе.

Мы также импортировали наш массив поддельных продуктов, извлекли текущий продукт с помощью идентификатора из маршрута с помощью find () и добавили префикс URL к источнику запросов сервера.

Теперь давайте обновим шаблон компонента (product.component.html), чтобы отобразить необходимую информацию и создать кнопку покупки, совместимую с Определение продукта Snipcart ,

<div class = "product"> <img src = "../ assets / images / {{product.id}}. svg" alt = "{{product.name}}"> <h2> {{product.name }} </ h2> <p> {{product.description}} </ p> <button class = "snipcart-add-item" [attr.data-item-id] = "product.id" [attr.data -item-name] = "product.name" [attr.data-item-url] = "url" [attr.data-item-price] = "product.price" [attr.data-item-weight] = " product.weight "[attr.data-item-description] =" product.description "> Купить ({{product.price}} $) </ button> </ div>

Заметьте, как я не использовал фигурные скобки для привязки данных в атрибутах HTML?

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

6. Интеграция функций корзины покупок

Теперь давайте интегрируем Snipcart, добавив необходимые скрипты с нашим ключом API в файл index.html, который является нашим основным приложением.

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

<! 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"> </ head> <body> <app- root> </ app-root> </ body> <script src = "https://ajax.googleapis.com/ajax/libs/jquery/2.2.2/jquery.min.js"> </ script> <script src = "https://cdn.snipcart.com/scripts/2.0/snipcart.js" data-api-key = "MzMxN2Y0ODMtOWNhMy00YzUzLWFiNTYtZjMwZTRkZDcxYzM4" id = "snipcn> https: href =»: </ href> </ h> </> .snipcart.com / themes / 2.0 / base / snipcart.min.css "rel =" stylesheet "type =" text / css "/> </ html>

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

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

7. Использование Angular Universal для SEO

Наконец, давайте сделаем наше приложение дружественным к SEO, используя SSR.

В этой демонстрации я буду использовать Node.js Express сервер. Имейте в виду, что на любом сервере можно добавить Angular Universal, если он может взаимодействовать с функцией renderModuleFactory Angular, но конфигурация, скорее всего, будет отличаться от той, которая была продемонстрирована в этом посте.

7.1 Установка Angular Universal

Для начала давайте добавим необходимые инструменты в вашу среду разработки:

Установка npm --save @ angular / platform-server @ nguniversal / module-map-ngfactory-loader ts-loader @ nguniversal / express-engine

7.2 Редактирование клиентского приложения

Теперь, когда у нас есть все необходимые инструменты, давайте отредактируем код на стороне клиента, чтобы разрешить переход между отображаемой страницей на стороне сервера и приложением на стороне клиента. В app.module.ts замените импорт BrowserModule в декораторе @NgModule () следующим кодом:

BrowserModule.withServerTransition ({appId: 'my-app'}),

Поскольку приложение встроено в код на стороне сервера и код на стороне клиента, вам потребуется два пути вывода. Давайте начнем с определения пути вывода для браузера. Для этого отредактируйте outputPath в angular.json.

"architect": {"build": {"builder": "@ angular-devkit / build-angular: browser", "options": {"outputPath": "dist / browser", ...

7.3 Настройка сервера

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

Создайте app.server.module.ts в каталоге src / app.

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

Создайте файл main.server.ts в каталоге src /, который экспортирует AppServerModule, который будет действовать как точка входа вашего сервера.

экспорт {AppServerModule} из './app/app.server.module';

Кроме того, создайте файл server.ts в корневом каталоге вашего приложения. Этот файл содержит код сервера Express. Он будет прослушивать входящий запрос, обслуживать запрошенный ресурс и отображать HTML-страницы, вызывая renderModuleFactory (обернутый ngExpressEngine).

// Они важны и необходимы прежде, чем что-либо еще import 'zone.js / dist / zone-node'; импорт 'отражать-метаданные'; import {enableProdMode} из '@ angular / core'; импорт * как экспресс из 'экспресс'; import {join} из 'path'; // Более быстрый сервер выполняет рендеринг с режимом Prod (режим dev никогда не нужен) enableProdMode (); // Экспресс-сервер const app = express (); const PORT = process.env.PORT || 4000; const DIST_FOLDER = join (process.cwd (), 'dist'); // * NOTE :: оставьте это как require (), поскольку этот файл создается динамически из веб-пакета const {AppServerModuleNgFactory, LAZY_MODULE_MAP} = require ('./ dist / server / main'); // Экспресс-механизм импорта {ngExpressEngine} из '@ nguniversal / express-engine'; // Импортируем карту модуля для отложенной загрузки import {provideModuleMap} из '@ nguniversal / module-map-ngfactory-loader'; app.engine ('html', ngExpressEngine ({bootstrap: AppServerModuleNgFactory, провайдеры: [provideModuleMap (LAZY_MODULE_MAP)]})); app.set ('view engine', 'html'); app.set ('views', join (DIST_FOLDER, 'browser')); // TODO: безопасно выполнять запросы данных app.get ('/ api / *', (req, res) => {res.status (404) .send ('запросы данных не поддерживаются');}); // Статические файлы сервера из / browser app.get ('*. *', Express.static (join (DIST_FOLDER, 'browser'))); // Все обычные маршруты используют универсальный движок app.get ('*', (req, res) => {res.render ('index', {req});}); // Запускаем Node-сервер app.listen (PORT, () => {console.log (`Узловой сервер прослушивает http: // localhost: $ {PORT}`);});

Теперь, когда вы настроили сервер, вам нужно будет добавить и обновить файлы конфигурации. Создайте файл tsconfig.server.json в каталоге src.

{"extends": "../tsconfig.json", "compilerOptions": {"outDir": "../out-tsc/app", "baseUrl": "./", "module": "commonjs" , "types": []}, "exclude": ["test.ts", "** / *. spec.ts"], "angularCompilerOptions": {"entryModule": "app / app.server.module # AppServerModule "}}

Настройте файл webpack.server.config.js в корневом каталоге приложения с помощью следующего кода:

Теперь обновите конфигурацию Angular CLI и установите выходной путь сборки сервера, добавив следующий код в angular.json:

"architect": {... "server": {"builder": "@ angular-devkit / build-angular: server", "options": {"outputPath": "dist / server", "main": " src / main.server.ts "," tsConfig ":" src / tsconfig.server.json "}}}

Наконец, добавьте команды build и serve в раздел сценариев файла package.json.

Таким образом, вы сможете сохранить ng serve для обычного рендеринга на стороне клиента и использовать npm run build: ssr && npm run serve: ssr для использования рендеринга на стороне сервера с Universal.

"scripts": {... "build: ssr": "npm run build: клиент-и-серверные пакеты && npm run webpack: server", "serve: ssr": "node dist / server", "build: клиент-и-серверные комплекты ":" ng build --prod && ng run my-app: server "," webpack: server ":" webpack --config webpack.server.config.js --progress --colors " }

7.4 Сборка и запуск приложения

Теперь, когда все настроено, вам нужно идти! Создайте приложение и запустите сервер.

npm run build: ssr && npm run serve: ssr

GitHub repo & live demo

Посмотреть репозиторий GitHub Вот

Посмотреть демо Вот

Заключительные мысли

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

Однако включить Universal в мой проект оказалось сложнее, чем я ожидал; это действительно легко потеряться во всех файлах конфигурации!

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

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

Надеюсь, что это поможет вам правильно настроить Angular SEO! :)

Если вам понравился этот пост, пожалуйста, уделите секунду поделиться этим в твиттере , Есть комментарии, вопросы? Хит раздел ниже!

Что вы думаете о том, как узнать, как установить, как настроить и как использовать Yoast SEO для оптимизации ваших сообщений?
Что вы думаете о том, как узнать, как установить, как настроить и как использовать Yoast SEO для оптимизации ваших сообщений? Обязательно прокомментируйте ниже и ознакомьтесь с содержанием, которое мы подготовили для вас! Нужно оптимизировать ваш сайт для SEO? Познакомьтесь с Oblige - агентство Создание сайта и Цифровой маркетинг , Другие

Если вы ищете агентство цифрового маркетинга в Манчестере, чтобы помочь вам с SEO, почему бы не связаться с нами и не узнать, как мы можем помочь?
Если вы ищете агентство цифрового маркетинга в Манчестере, чтобы помочь вам с SEO, почему бы не связаться с нами и не узнать, как мы можем помочь?

Как часто мы слышим, что SEO мертва, устарела или не так важна, как это было несколько лет назад?
Как часто мы слышим, что SEO мертва, устарела или не так важна, как это было несколько лет назад? Это правда, что индустрия поискового маркетинга постоянно меняется. Постоянные обновления и изменения алгоритмов во всех поисковых системах каждые пару месяцев. Это заставляет задуматься о том, чтобы идти в ногу со временем, и владельцы малого бизнеса и предприниматели могут легко оказаться подавленными. Но проблема не делает практику устаревшей. Использование

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

В последнее время ряд клиентов спрашивают совета о том, как писать статьи по SEO, чтобы соответствовать требованиям Google и быть полезными, а не вредными?
В последнее время ряд клиентов спрашивают совета о том, как писать статьи по SEO, чтобы соответствовать требованиям Google и быть полезными, а не вредными? Хорошая статья по SEO - это только половина работы, потому что другая половина - где она будет размещена. Сегодня мы хотим предоставить ОСОБЫЕ советы, которые вы можете сразу же передать своим авторам и держать свою чуму и голубя в машине так, чтобы они были написаны, а не иначе… 🙂 Ясно, что мы шутим, потому что каждый писатель SEO имеет уникальный

Как Google распознает сущности и как это помогает SEO?
Как Google распознает сущности и как это помогает SEO? 4,7 (93,33%) 3 голос (ов) Google является одной из ключевых задач юридические лица узнаваемый и контекстуальный. В этом посте я хотел бы объяснить некоторые подходы, которые Google может использовать для решения этой проблемы, и как это сделать для

«Зачем говорить о SEO для начинающих, если вы зарабатываете на этом деньги в Интернете, разве это не удар в ногу?
«Зачем говорить о SEO для начинающих, если вы зарабатываете на этом деньги в Интернете, разве это не удар в ногу?» "У вас есть несколько" ранжированных "статей, можете ли вы дать мне бесплатные советы по SEO?" Я знаю, я знаю ... Многие спрашивают себя об одном и том же: Значит, вы зарабатываете деньги на SEO, зачем создавать место для конкуренции? В этом-то и проблема, так как существует множество партнерских мини-сайтов, где эти люди узнали, как создавать

Как недавно, когда клиент спросил меня: «Как насчет использования nofollow и как оно помогает вашему Google Juice?
Как недавно, когда клиент спросил меня: «Как насчет использования nofollow и как оно помогает вашему Google Juice?» Большинство «экспертов» просто хотят заработать Поскольку я ренегат с наклонностями «капитан-спаси-клиента», мне не нравится слышать это - это, вероятно, означает, что «эксперт» просто прочитал несколько или несколько статей в Интернете - подавляющее большинство из которых идет настолько далеко за упрощением, что в них нет «реального» ответа,

Как вы можете улучшить SEO своей компании в поисковых системах, таких как Google?
Как вы можете улучшить SEO своей компании в поисковых системах, таких как Google? • Найм Alicante SEO услуги или веб-позиционного агентства. • Оптимизация вашего текущего проекта с правильными рекомендациями, которые поисковым системам действительно нравятся Хорошие методы или также называют SEO «белых перчаток»! Естественное или органическое позиционирование. • Реализация стратегии онлайн-маркетинга: через статьи, качественные ссылки, комментарии, публикации,

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

Как узнать, какие ключевые слова следует продвигать в новых статьях, если не знаешь, стоит ли и как их оценивать до сих пор?
Как узнать, какие ключевые слова следует продвигать в новых статьях, если не знаешь, стоит ли и как их оценивать до сих пор? Для значимых решений о предстоящих действиях вам нужна информация о том, как развивался ваш нишевый веб-сайт. Отслеживание ранга Так называемый «Rank Tracker» - это еще один модуль Market Samurai. Это позволяет вам контролировать определенные ключевые слова вашего собственного нишевого сайта. Недавно был представлен новый

Зачем беспокоиться об Angular SEO?
Разве Angular не поддерживается Google?
Так что это значит?
Зачем беспокоиться об Angular SEO?
Разве Angular не поддерживается Google?
Означает ли использование этих методов, что вы внезапно окажетесь на вершине SERP ?
Скорее всего, хотя?
ContextReplacementPlugin (/(.+)?
Angular(\\|\/)core(.+)?
ContextReplacementPlugin (/(.+)?