Перейти к содержимому

Как открыть верстку на телефоне

  • автор:

Как посмотреть исходный код страницы сайта на планшете/телефоне с ОС Android?

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

Воспользуемся мы обычным браузером, а также правилом, которое работает и на компьютере. Для этого в адресную строку браузера перед url добавьте «view-source:»:

Как посмотреть исходный код страницы сайта на планшете/телефоне с ОС Android?

и нажмите «Поиск» или «Перейти». После чего вы сможете наблюдать исходный код сайта

Как посмотреть исходный код страницы сайта на планшете/телефоне с ОС Android?

Помимо этого способа, исходный код сайта в Android можно посмотреть с помощью специальных программ, которые мы разобрали в этой статье.

Как просмотреть локальный сайт на телефоне?

Я сделал сайт и адаптировал его под все устройства, но он, как вы понимаете, только на компе. (и в гите) На хостинг заливать буду позже.
Вопрос: Как мне открыть свой сайт на телефоне (пощупать, понажимать, в общем, проверить его перед заливом на хост?) В интернетах толковой инфы не нарыл (хотя искал прилично). Пробовал вариант через ipconfig узнать айпи локальной сети, в итоге набрал на телефоне, а телефон ушёл в вечную загрузку. Отключал брандмауэр, делал сеть домашней, ничего не получается. Что же мне делать?

Отслеживать
81k 9 9 золотых знаков 78 78 серебряных знаков 135 135 бронзовых знаков
задан 17 дек 2020 в 15:09
дмитрий петрович дмитрий петрович
153 2 2 серебряных знака 7 7 бронзовых знаков

В конфигурационном файле вашего локального HTTP сервера нужно создать запись, так чтобы ваш сайт был доступен по локальноой сети по локальному IP адресу вашей серверной машины (обычно это 192.168.0.XXX). Ваш мобильный телефон должен быть в той-же локальной сети (например по WIFI).

17 дек 2020 в 16:23

browsersync.io Поставьте ее себе и открывайте на здоровье. Кроме того есть экстеншены для браузеров. Их тыщща и один вариант. Загуглите тему.)

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

Хозяйке на заметку: Если вы работаете на телефоне или планшете и вам нужно посмотреть код страницы или найти что-то в коде HTML, выполните следующие простые действия:

  1. Откройте требуемую страницу в Google Chrome на телефоне или планшете
  2. Допишите в начало адреса страницы “view-source:” и нажмите [Enter] (перейти)
  3. Выберите в меню (три точки справа) пункт “Найти на странице”
  4. Введите нужный текст для поиска

Screenshot_20181111-083339

Телефон вместо компьютера

Вообще на эту заметку меня сподвигла статья в Ферре “Почему смартфон так и не заменил компьютер, хотя нам давно это обещали“, которую я прочитал за утренним кофе. Вообще, я во многом не согласен с Денисом Поповкиным, автором статьи. Наверное, потому, что телефоны УЖЕ заменили компьютеры. И это легко увидеть. Автор подходит со своей колокольни, со своей проблематикой, но мне она кажется довольно однобокой. Если в общем говорить о том, чем является “работа на компьютере”, то можно выделить следующие пункты:

  • Работа на работе (офис, бизнес-задачи)
    • Коммуникации (почта, всякие мессенджеры, Скайпы, совещания и т.п.)
    • Документооборот (документы, таблицы, формы)
    • ERP / CRM (клиенты, задачи, финансы, бизнес-процессы)
    • Специализированный софт (ну тут уже зависит от темы)
    • Коммуникации (почта, мессенджеры)
    • Презентации и демонстрации
    • Документооборот
    • Коммуникации (мессенджеры, Скайпы и т.п.)
    • e-Commerce (шоппинг)
    • Интернет и развлечения
    • Хобби (например, фотография, видео, кодирование и т.п.)
    • Редко, ведение домашнего хозяйства (финансы, планирование и т.п.)

    Вот, пожалуй, и всё.

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

    Ну а первые два пункта, думаю, всё зависит от направленности бизнес-задач. Конечно же, фотошоп или какой-нибудь CAD на телефоне запустить очень и очень проблематично, если вообще возможно, но все остальные задачи решаются легко, хотя и немного непривычно первое время. Например, я уже не раз и не два отправлялся в командировки на неделю и более вообще без ноутбука, планшет, мышка и хорошая BT-клавиатура (это важно!) вполне заменяют рабочее место.

    20181025_083510-01

    Ведь первоочередная задача в работе — это не специализированный софт, а всё же коммуникации, а они как раз на мобильных устройствах более-менее полно реализованы.

    Всевозможные ERP / CRM — опять же, зависит от реализации. У нас в компании худо-бедно наша система работает с мобильника (хотя клиенты и жалуются, что не очень удобно. Мы это слышим и что-то даже исправляем). Про всякие 1С молчу, это — харам, мы не пользуемся!

    Далее, автор пишет:

    Следующий момент – сами приложения. Казалось бы, да – можно напечатать текст даже на смартфоне. Хорошо, но нам ещё нужно подобрать изображения для статьи, обрезать их под нужное соотношение сторон и ширину пикселей, а потом вставить в админку CMS.

    Ребята, открою вам страшную тайну: у вас CMS — говно! Нормальные CMS давно и успешно решают любые задачи, связанные с публикацией либо полностью автоматически (“обрезать их под нужное соотношение сторон и ширину пикселей”), либо великолепно это делают с любого устройства. Например, эту заметку я пишу хоть и на десктопе (большей частью), но и на телефоне, в том числе:

    Так что, проблема в конкретной CMS, а не в возможности удобной работы. У Ферры самописка из разряда “Самостряп-303”, ну и если разработчики не предусмотрели таких функций — то это проблемы коллектива Ферры.

    Специализированный софт — вот это да. Для меня специализированным софтом является прежде всего IDE для написания софта и работы с сайтами (собственно об этом и заметка), и вот здесь не все так гладко. Нет, сама IDE есть на планшете и мобильнике, но из-за особенностей клавиатуры и мышки Android писать софт не совсем удобно. Хотя допускаю, что я просто не настроил клавиатуру должным образом.

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

    Например, вот такой нехитрый набор позволяет легко проводить лекции и презентации. В Московском Политехе я вот так недавно отчитал трехмесячный курс. В набор входят:

    1. Современный смартфон
    2. Доп.аккумулятор с подставой для смартфона
    3. HDMI-донгл Miracast для трансляции презентации и экрана на любой проектор или ТВ-панель
    4. Кликер для презентации с лазерной указкой
    5. Складная клавиатура с тач-панелью
    6. Резервный Powerbank на случай длительных занятий (более 4 часов)

    Все это весит менее 500 гр. и легко помещается в маленькую сумку или барсетку.

    В качестве резюме можно сказать, что ПК, конечно же, полноценно телефон пока не заменяет, но львиную долю задач на смартфоне или планшете вполне можно делать и делать успешно. Важно лишь правильно подобрать софт.

    Как просматривать разрабатываемый сайт через телефон?

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

    • Вопрос задан более трёх лет назад
    • 2594 просмотра

    2 комментария

    Простой 2 комментария

    SmthTo

    Rustam Bainazarov @SmthTo Куратор тега Вёрстка
    Browsersync.

    delphinpro

    Сергей delphinpro @delphinpro Куратор тега Вёрстка

    Подключаем комп и телефон к одной локальной сети, запускаем browserSync и не только смотрим сайт в телефоне, но еще и синхронно с компом (скролл, нажатия кнопок/ссылок и т.п.).

    Решения вопроса 0
    Ответы на вопрос 7
    Сергей Горностаев @sergey-gornostaev
    Седой и строгий
    Просто сделать локальный сервер доступный по Wi-Fi и подключаться к нему с телефона.
    Ответ написан более трёх лет назад
    Комментировать
    Нравится 11 Комментировать

    Vlatqa

    Ответ написан более трёх лет назад
    Нравится 8 2 комментария

    hzzzzl

    doroshenko_magic
    ^ вот это самое простое решение

    rockon404

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

    itsjustmypage @itsjustmypage

    Browsersync в npm для сборщика
    https://www.youtube.com/watch?v=cj29XdGzNt8
    https://www.browsersync.io/
    Не только просматривать, но и взаимодействовать одновременно на всех устройствах (скроллить, кликать, заполнять формочки, вот это всё).

    Ответ написан более трёх лет назад
    Нравится 5 2 комментария

    Kublyakov

    можно даже просто из консоли запустить

    Eridani

    Пожалуй, лучший способ

    Как один из вариантов —
    В зависимости от ОС установить или андроид студию, или Андроид студию + xCode.
    И создавая самые разные симуляторы — можно проверить верстку в реальных (относительно) условиях, с локального сервера

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *