Навигация по сайту

Новости

Реклама

Календарь

Адаптивный сайт - что это и почему?

  1. Вначале я немного припоминаю 🙂
  2. Адаптивный сайт - что это?
  3. Что происходит, когда вы посещаете неотвечающий веб-сайт со своего телефона или планшета?
  4. Как это выглядит на практике?
  5. Почему отзывчивость сайта почти "должна иметь"?
  6. Мобильный и отзывчивый сайт
  7. Как жить? Какой сайт мне выбрать?
  8. Адаптивный и мобильный сайт и SEO. Короткий разговор с Ола Гошиняк ,
  9. Олу, ищет SEO - выигрывает адаптивный или мобильный сайт?
  10. Уже давно вы можете услышать здесь, что Google предпочитает адаптивные / мобильные веб-сайты. Это...
  11. Вы упомянули дублирование контента на мобильном сайте (если один из моих читателей не знает, что это...
  12. Я также встречался не раз и не дважды, чтобы убедить адаптивный сайт ради Google Analytics, поскольку...
  13. Подведем итоги 🙂

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

Если у вас также есть такие сомнения, я немедленно их развею

Вначале я немного припоминаю 🙂

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

И я влюбился! Я влюбился в убийство возможностей, которые дает RWD. Эта любовь длится до сих пор, и я хочу поделиться с вами 🙂

Адаптивный сайт - что это?

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

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

В меньших разрешениях (особенно на телефоне) графика урезается, и приоритетом является:

  • сайт не загружается бесконечно, только как можно скорее,
  • тексты были максимально читабельными,
  • все важные элементы («призыв к действию») были открыты и удобно «постукивать» пальцем.

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

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

Что происходит, когда вы посещаете неотвечающий веб-сайт со своего телефона или планшета?

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

Как это выглядит на практике?

Вот как она будет выглядеть Сайт Ули Фелепа если это ее кодирование Я был бы отзывчивым (рядом вы видите реальную, отзывчивую версию, то есть то, что вы увидите при входе www.urszula-phelep.com с телефона).

com   с телефона)

макет: Михал Якобше

И это будет выглядеть как форма для подписки на рассылку Веб-сайт Lady of Your Time (это ребенок на серой полосе внизу), если нет zakodowałabym это как адаптивный сайт. Подписка на рассылку в этой форме не очень удобна, правда? Рядом с ним вы можете увидеть реальную, отзывчивую форму - ту, которую вы увидите при входе в телефон на www.paniswojegoczasu.pl ,

макет: Михал Якобше

Почему отзывчивость сайта почти "должна иметь"?

Потому что многие люди просматривают Интернет с телефонов или планшетов. Это не маленький процент, как это было раньше. Статистика говорит, что в последнее время число 1 с точки зрения разрешения составляет 360 × 640 пикселей, что является одним из разрешений телефона. Около 21% людей посещают сайты с телефонов с таким разрешением. Это очень, очень много. Вторым по порядку является разрешение 1366х768 пикселей, что является одним из разрешений ноутбука - около 18-19%.

Помахать рукой этим 21% людей - все равно что выстрелить себе в ногу. Так почему же отзывчивость сайта почти ПОЛНОСТЬЮ "должна иметь"? Потому что RWD - не единственный вариант, другой - мобильная сторона (потому что это не одно и то же).

Мобильный и отзывчивый сайт

Что такое мобильный сайт?

Мобильный сайт также меняется в зависимости от того, где вы его посещаете, но ключ здесь не в разрешении, а в устройстве. Мобильный веб-сайт от адаптивного отличается тем, что он похож на «отдельную сущность», имеющую свой индивидуальный адрес, отличный от адреса «основной» страницы (например, для адреса lalala.pl, мобильный адрес - m.lalala.pl или lalala.pl/mobile. ). Этот сайт «вычитает», что вы посещаете его со своего телефона или планшета и перенаправляет вас на мобильный адрес.

Как жить? Какой сайт мне выбрать?

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

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

В теме SEO нет ни одной из моих спецификаций, поэтому я спросил Ola Gościniak, который объяснит вам это намного лучше 🙂

Адаптивный и мобильный сайт и SEO. Короткий разговор с Ола Гошиняк ,

Ола Гошиняк

Он пишет блог Я интерактив , Влюбленная в WordPress (очевидно, с взаимностью), она также занимается SEO и любит новые технологии. Он пишет, преподает и консультирует группу поддержки для женщин на ФБ «Мы интерактивны» , создает онлайн-курсы и проводит тренинги и мастер-классы. Она нашла свое хобби в обучении тому, как самостоятельно создавать сайт мечты и добавлять крылья каждый день.

Олу, ищет SEO - выигрывает адаптивный или мобильный сайт?

Оба эти подхода верны, если мы хотим позиционировать сайт.

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

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

Уже давно вы можете услышать здесь, что Google предпочитает адаптивные / мобильные веб-сайты. Это правда или ложь? 🙂

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

Совместимость вашего сайта можно проверить здесь: search.google.com/test/mobilefriendly ,

Проверьте свой веб-сайт и позаботьтесь о его адаптации к требованиям Google. На что обращают внимание?

  • Правильное отображение сайта - все ли элементы понятны и видны?
  • Удобство - все ли ссылки кликабельны, чтобы можно было выбрать ссылку пальцем?
  • Скорость - сайт загружается быстро и не "кушает" перевод? (оптимальное время загрузки 1-3 секунды).

макет: Михал Якобше

Вы упомянули дублирование контента на мобильном сайте (если один из моих читателей не знает, что это такое, я предположу, что это дублированный контент из одного места в сети в другом месте, также в пределах одного веб-сайта, например на двух страницах) , Является ли тот факт, что дублирование контента на мобильном сайте больше не является такой «катастрофой», как это было раньше, вы можете сделать что-то, чтобы УБЕДИТЬСЯ, что вы не чувствуете его последствий?

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

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

Анализ мобильного сайта в Google Analytics не должен быть более сложным. Мы можем настроить ваши отчеты так, чтобы данные собирались на одном аккаунте. Мы сделаем это в настройках раздела «Администрирование», используя представления и фильтры. Это в основном вопрос правильной конфигурации.

Подведем итоги 🙂

Как и Ола, я также отвечаю за адаптивные сайты и создаю сайты для своих клиентов.

Это по нескольким причинам:

  • Адаптивный веб-сайт более дружелюбен в таком повседневном «общении» - его удобнее редактировать, потому что редактирование происходит только на одной странице, а не на двух, как это обычно происходит на мобильном сайте.
  • Хотя забота о SEO и аналитике в Google Analytics не так важна на мобильном сайте, для менее опытного человека конфигурация GA в этом отношении может оказаться не легкой задачей, и чем проще, тем лучше 🙂
  • Мне больше нравится эффект плавного изменения страницы в зависимости от разрешения, в котором она просматривается, чем «жесткая» мобильная страница. Мне также нравится то, что упоминал Ола - что адаптивный веб-сайт меняется не только на телефоне или планшете, но и на компьютере, когда мы уменьшаем окно браузера.

То есть:

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

У вас уже есть адаптивный / мобильный веб-сайт? Вы хвалите ее в комментарии? Давайте сделаем вечеринку с комментариями или - как мне нравится это называть FB - связывание за кофе 🙂

Похожие

Что такое AdBlue?
AdBlue представляет собой раствор мочевины в воде, который очищает выхлопные газы и удаляет вредные загрязнители, включая оксиды азота (NOx), из которых оксид азота (NO) и диоксид азота (NO2) являются наиболее вредными. Было обнаружено, что оба газа способствуют возникновению респираторных и сердечных проблем у людей, а также влияют на экологические проблемы, такие как образование смога и кислотные дожди. AdBlue содержит около 67,5% деионизированной воды и 32,5% мочевины. Мочевина получена
Что делать, если не удается отключить NFC на Android
... что после установки нового ПЗУ по умолчанию служба NFC будет включена на Android, и вы не сможете ее отключить - кнопка станет серой, а через некоторое время NFC снова будет включен. Что с этим делать? В то время как NFC кажется интересным, то же самое обслуживание этой функции, включенной в фоновом режиме, может
Калибровать себя или комиссию?
... этом этапе объясните, что следует понимать под «надзором»? Прежде всего, оно начинается с момента, когда контрольно-измерительное оборудование вводится в организацию, и заканчивается в момент его вывода из эксплуатации. Такое наблюдение должно гарантировать, что используемое оборудование всегда дает правильные показания и может использоваться в процессе измерения. В частности, контроль включает калибровку (калибровку), то есть процесс, подтверждающий соответствие показаний устройства и используемых
Какой домашний кинотеатр купить?
... иемник это сердце и мозг любой системы домашнего кинотеатра. Он не только принимает и передает видеосигналы, но и управляет динамиками. Каждый год производители превосходят друг друга в улучшении параметров и возможностей своих устройств. Используя наш опыт в отрасли, мы помогаем вам преодолеть заросли решений и лозунгов. Наши специалисты собрали базовые знания о AV ресиверы что значительно упростит выбор такого
Плазма, автоген или лазер?
Существует много разных способов резки металла с использованием процессов термической резки. Мы сосредоточимся на трех основных процессах: лазер, аутоген и плазма. Каждый из этих процессов подходит для других потребностей резки. автоген Он использует химическую (экзотермическую) реакцию между
Как выбрать USB-адаптер Wi-Fi для ноутбука
Если вы купили ноутбук в течение последних пяти лет, возможно, на нем уже установлена ​​приличная карта Wi-Fi. Но если вы испытываете некачественное соединение, слишком долго ждали буфера Netflix или пропустили этот последний шаровый шар из-за задержки, то, возможно, пришло время подумать
Звукоизоляция салона автомобиля. Можете ли вы улучшить их самостоятельно?
... чтобы ослабить закрученные винты между пластиковыми пазами. Этот препарат также подходит для смазывания шарниров педалей. Шум также может исходить изнутри двери. В них много деталей - замки, направляющие для окон, цилиндры для управления их окнами или жгуты проводов. Если вы обнаружите нежелательные звуки в дверях, это невозможно - вам нужно снять боковые панели и проверить, что гудит. Устранение шума обычно заключается в затягивании и правильной фиксации элементов. Вы также
Как правильно прикрепить номерной знак?
... это правильно. Правильно установленный, он будет постоянно означать нашу машину и выдерживать все вибрации. Посмотрим, как прикрепить номерной знак. Почему важна правильная фиксация платы? Если номерной знак прикреплен недостаточно хорошо, нам грозит не только внезапное
Раздел: Свечи, Пробники - Как и когда мы заменяем свечи зажигания
... и, Зонды Патрон: NGK Свеча зажигания Европа Свечи зажигания, как и все компоненты автомобиля, подвержены износу"> Отдел: Свечи, Зонды Патрон: NGK Свеча зажигания Европа Свечи зажигания, как и все компоненты автомобиля, подвержены износу. Однако, если свеча из-за износа при длительном использовании, механического повреждения или по какой-либо другой причине перестает выполнять свою задачу, будет сложно запустить транспортное средство и легко повредить двигатель. Поэтому во время
Как подобрать девушку: женский гид для парней
Рис. Джейк Льюис Если вы слишком долго сидите в Интернете, вы можете прийти к выводу, что молодые парни в настоящее время живут в двух лагерях: сверхчувствительные моллюски ищут настоящую любовь на краудфандинговых сайтах и ​​гости, для которых флирт означает облажаться и выкрикивать угрозы изнасилования через дорожный конус. девушки на улицах. Конечно, это не на 100 процентов верно, но кажется, что
Зарядное устройство - это гаджет, который пригодится любому водителю?
Низкие температуры означают, что запуск двигателя после холодной ночи становится проблемой для автомобиля, особенно для его аккумулятора. Это всего лишь один элемент, но когда наступит поздняя осень, а после нее зима и природа победят только те водители, которые смогли должным образом защитить себя. Те, кто читал наш предыдущий пост о готовим аккумулятор к зиме они

Комментарии

Ты помнишь из школы, как говорилось, что прикуривать девушку - это треть секса с ней?
Ты помнишь из школы, как говорилось, что прикуривать девушку - это треть секса с ней? Ну, это правда, это треть, которую вы можете сравнить с преждевременным семяизвержением прямо в ее пупок. Ничто в мире не является более странным, чем момент безмолвия, в котором вы пытаетесь закурить сигарету девушке посреди стремительного ветра. Ты бы лучше дал ей эту зажигалку. И не носите с собой марку Zippo, это не 20-е годы, и вы не саркастический детектив.
С того момента, как вы сделали купон в Agito Разве вы не можете перестать искать лучшие возможности?
Если вы думаете, что мы так чертовски сексуальны, что единственный способ поднять нас - это быть в тупике, тогда, может быть, мы просто не будем играть в одной лиге? Кроме того: мы уже слишком умны для этого ! Старые, одни и те же трюки были использованы в течение десятилетия. Большинство наших первых опытов с пикапом среди несовершеннолетних заключалось в том, чтобы проскользнуть в клуб с сидиком, который был в жилете, который убедил нас, что он знаком с хиромантией.
Вопрос в том, готовы ли вы идти на компромиссы; Вы можете жить с немного меньшими циклами синхронизации, меньшей яркостью и меньшим количеством голосовых вызовов?
Вопрос в том, готовы ли вы идти на компромиссы; Вы можете жить с немного меньшими циклами синхронизации, меньшей яркостью и меньшим количеством голосовых вызовов? Если нет, и вы все равно решили пойти и купить телефон, вы можете взять с собой зарядное устройство, чтобы не столкнуться с проблемами с аккумулятором HTC Incredible S.
Почему это не делается центральным процессором?
Почему это не делается центральным процессором? На некоторых машинах это может быть, но это приводит к замедлению как основной обработки машины, так и графики. Автономные видеокарты были выпущены с самого первого IBM PC, который имел автономный адаптер дисплея еще в 1981 году; мощные, современные графические карты для 3D-игр с высоким разрешением и полноцветными играми, выпущенные в середине 1990-х годов, впервые предложенные такими компаниями, как Nvidia и ATI. Звуковая карта - это
Вы предпочли бы иметь обратную связь силы заикания, или педали, которые длится хороший год или два?
Вы предпочли бы иметь обратную связь силы заикания, или педали, которые длится хороший год или два?
Означает ли это, что последнее поколение Vectra - модель C - не стоит интереса?
Означает ли это, что последнее поколение Vectra - модель C - не стоит интереса? Кузов без стилистического «фейерверка», но такой подход может понравиться Vectra C появилась в автосалонах в 2002 году. Автомобиль
Соглашение составлено для бизнесменов-шоферов с комфортом, но что, если мы скажем, что оно имеет магнитный эффект, когда его рубят крышу?
Соглашение составлено для бизнесменов-шоферов с комфортом, но что, если мы скажем, что оно имеет магнитный эффект, когда его рубят крышу? Не веришь нам? Это настоящий пример. Источник: 1 , 2 , 3 ,
Потому что, что приносит самый чистый звук с самыми мощными басами, когда уши начинают болеть или становятся неприятно теплыми через полчаса?
Потому что, что приносит самый чистый звук с самыми мощными басами, когда уши начинают болеть или становятся неприятно теплыми через полчаса? Creative предлагает поддержку геймерам с беспроводной гарнитурой Sound Blaster Recon3D Omega Wireless THX. В дополнение к хорошему звуку, гарнитура должна также обеспечивать хороший комфорт ношения благодаря своим круглым амбушюрам - и все это без проводов и с сертификатом THX. О том, соответствует ли гарнитура Recon3D Omega Wireless THX своему названию
Так что вы делаете со всем этим избыточным внутренним теплом ?
Так что вы делаете со всем этим избыточным внутренним теплом ?! Почему нужно управлять температурой на светодиодах? При использовании мощных светодиодов крайне важно, чтобы вы отводили тепло с помощью эффективного управления температурой. Без хорошего отвода тепла температура соединения (внутренняя) светодиода повышается, что приводит к плохому изменению характеристик светодиода. При увеличении температуры перехода светодиода уменьшается
Что, однако, когда мы только что потеряли единственные ключи?
Что, однако, когда мы только что потеряли единственные ключи? Все, что вам нужно сделать, это вызвать профессионального слесаря, который прибудет на место происшествия через несколько минут и оперативно откроет машину скорой помощи. Не переживайте и постарайтесь открыть такой замок самостоятельно - мы можем серьезно повредить тонкий механизм блокировки автомобиля, сломать сигнализацию или поцарапать или сдавить кузов нашего автомобиля. Стоимость, которую вы несете при вызове специалиста, во много
?�� А знаете ли вы, как снежная сфера невероятно быстро растет?
Что это? При создании сайтов я придаю большое значение тому факту, что страница на телефоне не только разборчива, но и приятна для глаз. Предполагается, что это миниатюрная страница рабочего стола - проще, но не страшнее 🙂 Что происходит, когда вы посещаете неотвечающий веб-сайт со своего телефона или планшета? Происходят ужасные вещи this Чаще всего этот сайт крошечный и абсолютно нечитаемый, и чтение текста или «нажатие» в меню или что-либо еще может быть довольно плохим.

Что происходит, когда вы посещаете неотвечающий веб-сайт со своего телефона или планшета?
Как это выглядит на практике?
Почему отзывчивость сайта почти "должна иметь"?
Какой сайт мне выбрать?
Что это?
Подписка на рассылку в этой форме не очень удобна, правда?
Так почему же отзывчивость сайта почти ПОЛНОСТЬЮ "должна иметь"?
Как жить?
Какой сайт мне выбрать?
Олу, ищет SEO - выигрывает адаптивный или мобильный сайт?