Как перепроектировать свой сайт WordPress (и сохранить свой SEO)

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

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

Зачем перепроектировать ваш сайт?

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

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

Шаги для перепроектирования сайта WordPress

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

1. Планируйте потребности в редизайне

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

Общие цели для редизайн веб -сайта часто включают такие вещи, как:

• Лучшие баллы Veb Vitals (более быстрые сайты лучше для всех)
• Улучшенные коэффициенты конверсии (будь то подачи формы, покупки продуктов или любое другое ключевое действие на вашем сайте)
• Улучшенное вовлечение пользователей, измеряемое такими вещами, как время задержки и скорость отскока
• Создание масштабируемой системы проектирования, которая упрощает создание будущего контента
• Добавление новой функциональности для улучшения пользовательского опыта (например, отзывы клиентов, более быструю проверку, лучший способ показать видео или более легкую навигацию)

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

2. Создайте постановочный сайт

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

Siteground предлагает один из самых простых способов создания постановки с вашего существующего веб -сайта.

Поставленный сайт - это клон вашего веб -сайта, который «живет» во временном URL. Он полностью отделен от вашего живого сайта, поэтому между ними нет помех.

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

3. сохранить SEO и технические детали

Редизайн может повлиять на ваш SEO. Поисковые системы создают свои индексы на основе существующей структуры сайта. Слишком много изменений заставит Google выбросить страницы из своего индекса и запустить процесс снова и снова. Вот почему я рекомендую провести полный аудит вашего существующего сайта. Используйте консоль поиска Google, чтобы определить высокопроизводительные страницы, ошибки для сканирования и рейтинги ключевых слов. Экспорт этих данных поможет вам установить контрольные показатели для сравнения вашего переработанного сайта и удержать вас от слишком сильно изменять основы вашего сайта.

Обязательно делайте каждый из них для каждого редизайна:

1. Сохранить существующие URL. Следите за каждой страницей и публикуйте на своем веб-сайте, в том числе страницы CMS-построенные (подумайте о таксономиях и страницах магазинов). Мне нравится иметь электронную таблицу всего. Вы можете посмотреть на свои сайты на 95% страниц вашего сайта.
2. Настройка 301 перенаправления для любых страниц с изменением URL (очень важно - некоторые плагины сделают это автоматически).
3. Что касается 301S, держите свои предыдущие перенаправления нетронутыми. Возможно, вы также захотите очистить любые необходимые 301 (404s не плохие, но используйте 301, если страница движется).
4. Перенесите свои теги заголовка и мета -описания. Вы можете изменить их, но вы, конечно, не хотите их терять, если этого не сделаете.
5. Держите любую дополнительную схему, используемую на ваших страницах (больше, чем то, что создано по умолчанию из вашего плагина SEO). Это боль - воссоздать схему, когда вы просто забыли ее сохранить (также используйте таблицу для этого).
6. Держите свою структуру заголовка нетронутой, потому что поисковые системы используют ее для контекста. Вам разрешено вносить изменения в контент, но просто знаете, что они могут повлиять на ваш предыдущий SEO.

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

4. Используйте Divi для редизайна WordPress

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

Теперь у вас есть сотни вариантов при выборе темы для редизайна WordPress. Тем не менее, нет ничего лучше для проектирования веб -сайта, чем Divi. Я не видел строителя страниц для WordPress, давал пользователям столько вариантов дизайна (независимо от того, являются ли они новичком или кто -то очень опытный в CSS).

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

Если вам нужно немного больше помощи, у Divi есть стартовые сайты, разработанные нашей командой профессиональных веб -дизайнеров. Вы также можете использовать наш проверенный и верный AI-Builder для чего-то более индивидуального. Лучшая часть обоих вариантов заключается в том, что каждый дизайн является дивизионным, что означает, что все в редакторе Divi.

При ограниченном бюджете? Divi на самом деле является одним из самых доступных инструментов веб -дизайна на рынке. Вы получаете полноценный инструмент дизайна, облачное хранилище, помощник по искусственному искусству, VIP-поддержку (и больше, чем я готов внести в это предложение) за 7,42 доллара в месяц.

Получите Divi для редизайна

5. Создайте свои страницы и шаблоны

Начните с настройки своих глобальных цветов и шрифтов . Вы можете установить свою основную цветовую палитру и пары шрифтов прямо в вариантах темы Divi или настройке темы WordPress.

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

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

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

6. Оптимизируйте свой сайт для производительности

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

Дивинг

Более ранняя версия Divi 5 Alpha, которая сократила время загрузки страниц в четырех

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

Получите Divi для редизайна

Cloudflare CDN

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

Получите CloudFlare

Нитропак

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

Получите нитропак

7. Следуйте контрольному списку перед запуском

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

• Корректируйте все контент : проверьте опечатки, грамматические ошибки и все, что требует пристального взгляда, чтобы поймать (мне нравится использовать ИИ здесь для ловли определенных вещей).
• Обзор изображений и медиа : Убедитесь, что все изображения и видео отображаются правильно и оптимизированы.
• Мобильное тестирование : тестируйте каждую страницу на мобильных устройствах и планшетах, чтобы гарантировать, что адаптивный дизайн работает, как и ожидалось. Мы живем в 21-м веке, поэтому обязательно протестуйте сверхуровневые дисплеи.
• Тестирование поперечного браузера : Проверьте свой сайт в разных браузерах (Chrome, Firefox, Safari, Edge), чтобы обеспечить совместимость.
• Выполните ползание на сайте : если вы можете, используйте бесплатную версию ScreamingFrog, чтобы ползти на вашем сайте и посмотреть, нужно ли устранить какие-либо очевидные ошибки перед закладкой.
• Установите аналитику : прямо перед запуском - отличное время для настройки аналитики. Обязательно установите события конверсии, чтобы вы могли действительно увидеть, как поступает ваш переработанный сайт.

8. иди вживую

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

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

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

Редизайн WordPress сделан правильно

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

Попробуйте Divi

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

Застать

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