Наличие многоязычного сайта не только фокусируется на переводе контента на разные языки, но также локализует дизайн и макет веб-сайта в соответствии с культурой целевого языка.
Согласно статье OneSky App, 52% сайтов в мире говорят на английском языке, но только 25% из них могут охватить всех пользователей в Интернете. Таким образом, локализация имеет потенциал для увеличения охвата пользователей.
В этой статье мы обсудим, что такое локализация сайта и как локализовать дизайн и верстку в несколько этапов. Продолжайте читать эту статью до конца!
Прежде чем приступить к локализации дизайна и макета, убедитесь, что вы знаете причины, по которым дизайн необходимо адаптировать к языку страны назначения.
Вот несколько причин, по которым дизайн и макеты следует адаптировать и локализовать.
Узнав, почему вам необходимо локализовать дизайн и макет вашего веб-сайта, мы обсудим несколько шагов, которые вам необходимо предпринять для локализации вашего сайта, включая следующие.
Первым шагом в локализации веб-сайта является обеспечение единообразия дизайна и макета веб-сайта, даже если доступ к нему осуществляется с разных языков. Это не только гарантирует, что он включает визуальные элементы, но также упрощает работу пользователей и обеспечивает ясность навигации.
Поддерживая единообразие дизайна, веб-сайт становится основным каналом передачи отличительных элементов и идентичности бренда. Согласованные цвета, типографика и другие элементы дизайна помогают создать сильный и запоминающийся имидж бренда.
Пример реализации согласованности веб-дизайна можно увидеть на изображении ниже. Первое изображение — когда вы заходите на сайт Airbnb на английском языке, а второе — на корейском.
Как видно ниже, макет, навигация, расположение кнопок и значки остались такими же, как и раньше.
Выбор цвета — это один из этапов локализации веб-дизайна, поскольку в нескольких странах существуют различия в интерпретации цвета. Например, если вы находитесь в некоторых частях Соединенных Штатов, желтый может показаться вам ярким и веселым цветом.
Однако в индийской культуре желтый цвет считается символом удачи, а не просто приятным цветом.
Несмотря на это, еще неизвестно, соответствует ли местный цвет цвету фирменного стиля. Обычно небольшие изменения в цветовой палитре бренда могут быть очень яркими.
Следующий шаг – убедиться, что кнопка сохранения языка легкодоступна и проста в использовании.
Разместите кнопку сохранения языка на видном месте, например, вверху или внизу страницы, и обеспечьте единообразное размещение на всех страницах перевода сайта. Это помогает пользователям легко найти возможность переключения языков.
На переключателе языка используйте значки или символы, которые визуально обозначают сохранение языка. Это может быть символ флага, значок глобуса или название языка. Правильная иконография может дать мощные визуальные подсказки.
Например, на следующем изображении есть кнопка переключения языка со значком флага и названием страны в правом верхнем углу.
При доступе к сайту на английском или немецком языке кнопка остается в правом верхнем углу.
Адаптация языковой раскладки справа налево является одним из способов локализации дизайна. Для тех из вас, кто ориентируется на пользователей, использующих такие языки, как арабский, иврит и т. д., сайт должен учитывать направление письма справа налево. Другие элементы, такие как навигация, кнопки и другие, следует поменять местами.
Как в примере ниже на сайте Facebook. На изображении ниже показаны сайты Facebook на английском и арабском языках. Вы можете видеть, что написание контента на арабском языке осуществляется справа; это адаптируется к процедуре написания арабского языка.
Используйте изображения, которые подходят и соответствуют местной культуре каждого целевого рынка. Это помогает укрепить доверие местных пользователей.
Следующий пример по-прежнему взят с веб-сайта Coca-Cola, который предоставляет полный целевой язык. На этот раз оно пришло из Кореи. В этой локализации он использует изображения, на которых изображена страна Корея, а именно одна из популярных женских групп Кореи.
Когда вы находитесь в процессе локализации дизайна и макета вашего веб-сайта, важно убедиться, что даты и другие технические форматы соответствуют местным предпочтениям. Потому что это повлияет на визуальное оформление сайта.
Например, формат даты в Индонезии — ДД/ММ/ГГГГ, а в Америке — ММ/ДД/ГГГГ.
Не только дата, но и формат валюты также должен быть адаптирован к языку страны, используемой в данный момент.
Один из примеров применения технической локализации вы можете увидеть на веб-сайте Airbnb, где представлены различные варианты валюты.
Как и на следующей странице, при переводе на арабский и итальянский языки существуют различия. Переведен не только контент, но и внесены валютные корректировки.
Следующее, что не менее важно, — формат номера телефона. В каждой стране, безусловно, есть свой формат телефонного номера. Чтобы локализовать свой веб-сайт, вы можете создать отдельный код телефонного номера для каждого существующего языка.
Например, на следующем изображении коды телефонных номеров различаются при переводе на английский и немецкий языки.
Наконец, убедитесь, что вы используете шрифты, совместимые со всеми выбранными вами языками.
Если все языки, которые вы отображаете, используют латиницу, проблем, скорее всего, не возникнет. Однако при включении на ваш сайт языка с кириллицей или языка с письмом справа налево (RTL) не все шрифты поддерживают этот тип алфавита.
Поэтому необходимы некоторые корректировки. Начало — добавить поддержку языков RTL в ваш CSS-код. Это может привести к изменению шрифта, когда посетители переключаются с языка с письмом слева направо (LTR) на язык с письмом справа налево (RTL).
Хорошая рекомендация — использовать коллекцию шрифтов, а не один шрифт для всего сайта. Используя наборы шрифтов, вы можете производить замены, если первый шрифт не подходит для определенного языка.
Зная пошаговую инструкцию, на этот раз мы попробуем локализовать дизайн и верстку с помощью Linguise .
Linguise — это служба перевода , которая может автоматически переводить контент на более чем 85 языков, которые вы можете выбрать. Помимо этого, Linguise также поддерживает множество функций, которые помогают локализовать веб-сайты. Так как же локализовать дизайн и верстку веб-сайта? Вот шаги.
Linguise управляет процессом локализации, предлагая автоматическое обнаружение контента. На этом этапе платформа сканирует ваш сайт, определяя текст и элементы, требующие перевода.
Этот автоматизированный процесс помогает сэкономить время и обеспечивает полный обзор всего локализуемого контента.
Одним из шагов к локализации дизайна и макета является обеспечение легкости поиска кнопки переключения языка и ее единообразия во всех языковых переводах.
Linguise позволяет настроить переключатель языка в соответствии с вашими потребностями. Для настройки вы можете пройти через Linguise > Настройки > Отображение языковых флагов.
На следующем экране вы можете настроить форму значков, например, рядом, всплывающее или раскрывающееся меню.
Затем вы также можете выбрать положение кнопки переключения языка, которая будет отображаться на веб-сайте. Полные инструкции можно прочитать в разделе «Настройка переключателя языка» на панели управления.
Если контент был переведен автоматически, вы можете отредактировать перевод, если что-то не подходит, с помощью живого редактора . Эту функцию можно использовать для локализации содержимого, содержащегося в проекте.
Например, мы хотим изменить код номера телефона с предыдущего +01 на +49 в разделе адреса, потому что мы переводим на немецкий язык.
Если да, то выберите «Сохранить», чтобы сохранить изменения. С помощью живого редактора пользователи могут напрямую локализовать сайт, выбрав его на главной странице Интернета.
Это результат локализации, проведенной в живом редакторе, а именно изменения кода телефонного номера страны.
Локализацию можно выполнить не только через живой редактор, редактируя перевод напрямую. Чтобы максимизировать локализацию, вы можете воспользоваться функцией правил перевода, которая активирует перевод.
С помощью функции перевода вы можете локализовать контент, который не хотите переводить, и оставить его оригинальным. Например, доставка переводов по URL, по строкам или по страницам.
Вы можете найти эту функцию в Linguise > Правила . Как показано на следующем изображении, это пример использования текста правил перевода для замены.
Здесь мы заменим слова «Mes podcasts» на «Ma musique», которые будут применяться каждый раз при переводе на французский язык.
Наконец, вы также можете локализовать свой сайт с помощью переводчика. Linguise позволяет добавлять и настраивать переводчиков на сайт, который вы хотите локализовать.
Добавить его довольно просто: перейдите на Linguise > Участники > Пригласить нового участника.
Функция добавления нового участника позволяет локализовать ваш веб-сайт с помощью более профессионального переводчика. Чтобы результаты локализации могли больше соответствовать культурным предпочтениям каждой целевой страны.
Это объяснение того, как локализовать дизайн и макет веб-сайта. Из этой статьи вы также лучше поймете, что такое локализация веб-сайта, чем отличается перевод и преимущества локализации веб-сайта.
Поняв важность локализации веб-сайта, пришло время локализовать его, чтобы охватить более широкую аудиторию.
С помощью Linguise вы можете локализовать дизайн и макет веб-сайта с помощью различных замечательных функций, таких как правила перевода, живой редактор и даже возможность добавлять переводчиков.
Зарегистрируйте аккаунт Linguise бесплатно на 1 месяц и локализуйте сайт, переведя до 600 тысяч слов!
Получайте новости об автоматическом переводе веб-сайтов, международном SEO и многом другом!
Не уходите, не поделившись своей электронной почтой!
Мы не можем гарантировать, что вы выиграете в лотерею, но можем обещать интересные информационные новости о переводах и периодические скидки.
