Создать мобильную версию сайта можно тремя способами:
- Сделать отдельный сайт для мобильных устройств на поддомене;
- Создать мобильные приложения под популярные мобильные ОС (iOS, Android, Windows Phone);
- Использовать адаптивную верстку на сайте.
Со вторым пунктом всё ясно: если вы умеете программировать под мобильные платформы, то это не составит труда, а если нет — нужно заплатить денег профессионалам.
Теперь что касается первого и третьего пункта. Тут нужно смотреть на формат вашего сайта. Если ваш веб-проект представляет собой некий сервис, например, почтовый сервис, как Mail.ru, или социальная сеть, как Вконтакте или Facebook, то несомненно лучше использовать отдельный поддомен и отдельную версию сайта для мобильных платформ. Если же вы, к примеру, ведете блог, то лучше использовать адаптивную верстку.
Мобильная верстка
Основные принципы создания мобильной версии сайта:
- Мобильная версия делается на отдельном поддомене (например, m.vk.com);
- Создается версия сайта, полностью адаптированная под мобильные экраны (как правило, для ширины экрана меньше 620px);
- На основном сайте при загрузке страницы детектируется браузер пользователя, ширина экрана, и исходя из этого применяется решение о перенаправлении пользователя на мобильную версию.
Если говорить об адаптивности мобильной версии под мобильные устройства, то нужно учитывать, что элементы на экране должны быть достаточно большого размера, разнесены между собой. При верстке необходимо использовать «резиновую» сетку (это означает, что размеры элементов должны меняться в зависимости от размера экрана). Этих принципов стоит придерживаться при проектировании мобильной версии.
КАК СОЗДАТЬ ФЕЙК САЙТ ВК
Определить браузер и ширину экрана пользователя на основном сайте можно, например, с помощью PHP-скрипта. Пример такого скрипта вы сможете найти на detectmobilebrowsers.com.
Адаптивная верстка
Основные варианты использования адаптивной верстки:
-
Использование CSS3 Media Queries (в стилях сразу указываются все необходимые данные для нескольких вариантов разрешения экрана). Пример:
Таким образом, в зависимости от типа вашего сайта можно выбрать подходящий тип поддержки мобильных устройств. При верстке мобильной версии может оказаться полезным сервис от Google: PageSpeed Insights, который укажет на ошибки и недочеты при разработке.
Смотрите также:
- Как проверить мобильную версию сайта
- Что выбрать: мобильная версия vs адаптивный дизайн?
- Использование мета-тега Viewport
- Блочная верстка
Источник: nubex.ru
Создание сайта на Github — это просто!
Как БЕСПЛАТНО сделать сайт. Конструктор сайтов ВКонтакте.
Если Вам нужен сайт, состоящий из ряда статических страниц, то Github — лучшее решение. К статическим сайтам можно отнести сайт-портфолио, сайт-визитка, каталог продукции и любые другие, содержащие в себе текст, теги, изображения и иные компоненты мультимедиа (видео, аудио).
Преимущества создания сайта на Github
При работе с хостингом от Github, можно сразу отметить несколько существенных преимуществ:
- Вам не потребуется покупать и ежегодно оплачивать домен;
- Вам не потребуется вносить ежемесячный платеж на оплату хостинга;
- Вы сможете сразу продемонстрировать свою работу клиентам;
- Многие веб-разработчики и заказчики, которые не по наслышке знают о github, с уважением отнесутся к вам, увидев в конце популярное «github.io».
Этап первый: регистрируем аккаунт
Попробуем создать сайт вместе. Переходим на сайт Github и в форме, состоящей из трех полей вводим будущий username, email и пароль.
Далее мы увидим страницу приветствия. Все необходимое уже будет стоять, достаточно просто нажать кнопку Continue для продолжения регистрации.
На следующей странице располагается небольшой опрос, но этот шаг можно пропустить, кликнув на skip this step
Не забудьте заглянуть на почту, там Вас будет ждать письмо с просьбой верифицировать аккаунт.
Этап второй: создаем репозиторий
После регистрации вы попадете на стартовую страницу. Чтобы начать проект, необходимо кликнуть на Start a project.
И Вас сразу перекинет на страницу по созданию репозитория. Настройки просты: достаточно ввести имя репозитория (имя будущего домена), в нашем случае это tpvesrtak.github.io, установаем галочку около «Initialize this repository with a README» и жмём Create repository. Description заполнять не обязательно.
Все, репозиторий создан.
Этап третий: наполняем сайт
Создание одного лишь репозитория недостаточно. Важно наполнить его файлами, иначе при переходе по ссылке, вида username.github.io мы увидим следующее:
Это именно то, что сгенерировалось в файл README и теперь отображается на сайте. Что нужно сделать, чтобы сайт выглядел так, как мы хотим? Во-первых, на вашем компьютере, должны быть подготовлены файлы для загрузки. Иначе говоря — нужен готовый, сверстанный сайт.
Если сайт готов, то необходимо на странице репозитория нажать на кнопку Upload files.
Далее вы попадете на страницу, куда достаточно перенести файлы для загрузки. Но помните, сюда можно скидывать что-угодно, только не папки. Как создавать папки — будет описано ниже.
В блок Commit changes писать, что-либо не обязательно. Гитхаб понимает, что вы пытаетесь сделать и уже за вас описывает действие. Это много увидеть на скриншоте. Жмем Commit changes.
Итак, мы загрузили 2 файла. Теперь необходимо создать 2 папки: css и font. Рассмотрим на примере создание папки для css. Для этого необходимо нажать на кнопку Create new file.
И мы попадаем на страницу создания файла. Чтобы сделать папку для нового файла, мы должны написать в верхнем поле следующее: css/
Помните, слеш обязателен!
После css/ можно написать слово empty. Выглядеть все это будет так:
Все, больше ничего писать не нужно, просто жмем зеленую кнопку внизу Commit new file. После этого мы сразу же попадаем в папку css, куда необходимо загрузить все файлы css. Как это сделать — мы уже знаем. Файл empty можно удалить.
Аналогичную операцию повторим и с папкой font и ее файлами.
Когда все необходимые файлы будет лежать на хостинге Гитхаба, процесс можно считать завершенным.
Этап четвертый: любуемся сайтом
Самая ожидаемая часть. Смотрим на результат по ссылке: https://tpverstak.github.io
Надеюсь, статья будет полезна многим, т.к. создавать сайты на Github просто, а самое главное — бесплатно!
Источник: tpverstak.ru
Сайт на конструкторе, CMS, фреймворке или собственная разработка — что лучше?
Заказчик обращается в агентство, чтобы ему разработали сайт. Каким образом это реализуют — вопрос второстепенный. Главное, чтобы уложились в бюджет и сделали сайт удобным для пользователей, легким в управлении и безопасным.
У подрядчика в ответ на запрос клиента есть масса предложений. Рассмотрим, в каких случаях есть смысл создавать сайт на массовой CMS, а когда лучше пойти по пути уникальности.
Все сайты делятся на три типа
Сайты, функциональность которых задаётся программистами с помощью языков программирования или фреймворков.
Созданные на CMS — системах управления сайтом (коробочных или самописных).
Собранные с помощью онлайн-конструкторов.
Сайт состоит из внешней и внутренней части. Внешняя — это дизайн и контент, внутренняя — это база данных и административная панель. При сборке сайта с помощью конструктора нужно позаботиться только о контенте — остальное продумали за вас. При разработке сайта на CMS необходимо создать только внешнюю часть — дизайн, сверстать его и «натянуть на движок». А при самостоятельной разработке придётся создавать и всю начинку.
Промежуточный вариант между CMS и ручной разработкой — самописные системы управления контентом. В этом случае сначала с нуля создается скелет функций, а затем решение становится типовым, и уже на его основе создаются похожие сайты. Как правило, самописные CMS используются для решения довольно узких задач.
Проведём аналогию с автомобилем
Сайт на самописных CMS — авторский автомобиль, который затем воспроизводится.
Разработка на фреймворках — сборка машины с помощью готовых работающих узлов и запчастей.
Собственная разработка — это создание машины с нуля, изобретение.
Сайт на коробочной CMS или конструкторе — универсальный серийный каркас автомобиля с приложенным набором инструментов и комплектующих.
По сути, мы видим переход от штучного продукта к рыночному, от индивидуального — к массовому производству. Причём у каждого варианта свои преимущества и недостатки.
Конструктор
Это самая простая технология создания сайта — страницы создаются по готовому шаблону. Вы можете выбрать любой из каталога, добавить нужные блоки и элементы, а после заполнить своим контентом.
Есть платные и бесплатные версии. Они отличаются богатством функционала.
Бесплатную версию можно использовать, когда нужна страница с базовой функциональностью. Для сборки сайта на конструкторе даже не обязательно искать исполнителя: если есть время, можно сделать сайт самому.
Если поймете, что выходите за рамки базовой версии, переходите на коммерческую. С ней получите дополнительные функции — персональный домен, например.
Популярные конструкторы Рунета: Тильда, Wix, InSales.
Когда подходит
Сайт нужен здесь и сейчас.
Нужен простой и понятный инструмент.
Преимущества
Быстрый результат. Сайт создается из готовых шаблонов — вам нужно только внедрить туда свой контент.
Легко работать. Не нужна команда дизайнеров и разработчиков. Вы получаете услуги хостинга, шаблоны, модули и виджеты недорого или даже бесплатно.
Все оптимизировано. Узкий выбор настроек и принцип шаблонности ограждают от ошибок. Все досконально проверено на тысячах подобных сайтов.
Просто управлять. Можно самостоятельно вносить изменения, не привлекая специалистов.
Недостатки
Нельзя оптимизировать код, потому что обычно к нему нет доступа. Любые баги смогут исправить только разработчики конструктора.
Зависимость от чужого хостинга. Возможность переноса на другой хостинг есть не у каждого конструктора. А если есть — стоит немалых денег.
Нет сложного функционала. Если потребуются программные доработки, придется отказаться от идеи или ждать, пока разработчики за нее возьмутся. Например, вы хотите, чтобы отбивки о заявках приходили на дополнительную почту. Техподдержка ответит, что такой функционал отсутствует, но, возможно, будет добавлен в будущем. Или не будет.
Чужая реклама. Эту проблему можно решить за отдельную плату.
Коробочная CMS
Коробочная CMS — это готовый программный продукт, который помогает управлять контентом и настройками сайта в одном месте.
Бесплатные CMS ограничены по набору функций и технической поддержке, обычно используются для создания личных или небольших сайтов организаций. Нередко имеют проблемы с безопасностью, поэтому для создания серьезных проектов не рассматриваются.
Коммерческие CMS — это мощные, универсальные системы для разработки разных типов сайтов с защитой и техподдержкой.
У вас возникнет логичный вопрос, в чем разница между конструктором и коробочной CMS? С помощью CMS можно расширять функциональность своего сайта (для этого существуют различные плагины и модули), тогда как возможности конструктора ограничены четким набором инструментов.
Популярные бесплатные коробочные CMS: Joomla, Drupal, WordPress, ModX. Платные: 1С Битрикс, Shop Script, NetCat, UMI.CMS.
Когда подходит
Вам нужно проверенное решение.
Важен расширенный функционал.
Вы готовы разработать дизайн и сверстать контент своими силами.
Преимущества
Популярность. Коробочные CMS широко известны среди диджитал-специалистов. И чем популярнее CMS, тем проще найти или заменить команду разработки.
Легко изучить и настроить стандартный сайт. Не нужно знать языки программирования.
Подключаемые модули. Можно расширять возможности за счёт плагинов.
Техническая поддержка.
Компании-разработчики поддерживают собственные продукты.
Полноценная документация. Для коммерческих коробочных CMS легко найти всю сопутствующую документацию.
Есть API. Готовые платформы имеют проработанный интерфейс прикладного программирования, который позволяет интегрировать ресурс с другими сервисами.
Недостатки
Невысокая производительность. Это плата за универсальность. В движке заложены широкие возможности, что дополнительно нагружает сервера.
Ограниченная функциональность. Как правило, у каждой CMS своя специализация, которую, впрочем, можно расширить за счёт редакций.
Избыточность некоторых модулей. Большая часть возможностей может вообще не использоваться.
Уязвимость. Поскольку основная масса коммерческих сайтов сделана на популярных коробочных версиях CMS, именно на них направлены атаки.
Самописная CMS
Далее рассмотрим системы управления контентом, разработанные отдельным программистом или студией. Это аналоги массовых CMS, но имеют небольшое распространение, даже если продаются. Могут создаваться на заказ.
Если массовые CMS — это универсальные решения, то самописные версии — продукт индивидуальной разработки. Обычно заточены под решение конкретных задач.
Когда подходит
Готовые решения вам однозначно не подходят.
Вы уверены в разработчике самописного движка.
У вас есть время и деньги на разработку.
Самописные CMS чаще используют для специфических проектов, когда требуется повышенный уровень безопасности, гибкость или, наоборот, простота в работе. Примером могут служить движки, разработанные для онлайн-СМИ. Они лишены громоздкости массовых систем и при этом могут обладать функциями управления контентом, которых нет в обычных движках.
Такие CMS очень кастомизированные. Как правило, обладают специальным интерфейсом, который удобен для редакторской работы. В этом случае переделка обычной CMS обошлась бы дороже и велась бы дольше, нежели собственная разработка.
Преимущества
Нет плагинов и расширений, которые требуют обслуживания и утяжеляют сайт.
Можно продумать функции сайта под конкретный проект.
Ниже вероятность взлома, исходный код будет только у вас и разработчика.
Выше производительность, поскольку нет лишнего кода.
Проще управление — можно включить только те элементы, которые вам необходимы.
Недостатки
Высокая стоимость проекта. Придётся оплачивать услуги опытных программистов или студию.
Привязка к конкретному разработчику. Все обновления и техподдержку придётся проводить через него.
Качество продукта полностью зависит от квалификации исполнителя, а грамотных и опытных профессионалов найти сложно.
Зачастую нет полноценной документации, поскольку проекты изначально строятся под заказ и не рассчитаны на массовое использование.
Сложности с технической поддержкой. Если исполнитель вдруг пропадёт, вы столкнетесь с большими проблемами.
Нет API. Для любой интеграции придётся создавать уникальные решения, что выльется в затраты времени и финансов.
Разработка на фреймворках
В переводе с английского framework — каркас, остов, структура. В разработке это готовая надстройка над «чистым» языком программирования. Фреймворк выполняет две задачи: задает архитектуру и позволяет подключать дополнительные модули и пакеты, за счёт чего можно расширять функциональность проекта.
Фреймворк — это набор отлаженного кода для решения конкретных задач, которые чаще всего стоят перед разработчиками. Если при разработке на CMS вы отрезаете все лишнее, то здесь всё наоборот: «лепите» сами из готовых блоков. Во многих случаях такой подход является более эффективным и оправданным.
На основе фреймворков можно разработать отдельное веб-приложение, сайт и даже CMS. Фреймворки существуют для всех языков программирования, бывают самописными и студийными. Наиболее популярные представители: Yii, Zend Framework, Symfony2, Laravel, Phalcon, Codeigniter, Kohana.
Источник: www.uplab.ru