Сборник научных статей Санкт-Петербург 2021

Студенческая секция
Мобильные устройства и смартфоны также изменили представление людей об исполь-
зовании Интернета. В 2007 г. большинство сайтов еще не было оптимизировано под смартфо-
ны. Более того, использование Интернета в мобильном телефоне часто разочаровывало. Это 
подтолкнуло веб-дизайнеров к поискам нового подхода к разработке мобильного веб-дизай-
на. Этот новый рубеж повлек за собой много вопросов. Следует ли уменьшать масштаб сай-
та для мобильного телефона? Стоит ли создавать стандарты для мобильных устройств? Как 
ускорить загрузку и использование веб-страниц с телефонов, чтобы пользователи не тратили 
свой интернет-трафик впустую? Ответ пришел в виде следующих технологий:
1) 960 GridSystem; 
2) Bootstrap и Foundation;
3) адаптивный дизайн сайта.
При создании веб-страниц с большим набором элементов, различных по размерам 
и смыслу, верстка (создание структуры гипертекстового документа на основе HTML-разметки 
с использованием таблиц стилей) таких страниц была очень трудоемкой. Решением этой про-
блемы стало появление техники верстки с использованием модульной сетки. Такие сетки по-
зволяют упростить верстку сайта, поскольку все элементы веб-дизайна разбиваются на отдель-
ные блоки, которые выравниваются по невидимым направляющим линиям. Такие блоки хотя 
и взаимосвязаны друг с другом, но обычно дозволяют независимое редактирование данных, 
что упрощает оформление элементов без нарушения общей структуры веб-дизайна.
С помощью 960 GridSystem – простого способа разработки макетов сайтов с примене-
нием сетки, которая имеет ширину 960 пикселей, появляется возможность создания большо-
го количества вариантов разбивки сетки на столбцы и отступы, используя при этом только 
целые числа. Такие варианты хорошо вписываются в большинство расширений экранов раз-
личных девайсов.
Именно Bootstrap и Foundation стали базой для нового мира мобильного Интерне-
та. Это две конкурирующие между собой платформы для быстрой и удобной разработки 
веб-сайтов, в которую включена оптимизация под мобильные устройства. Они предоставля-
ют возможность разработки сайта с адаптивным и отзывчивым веб-дизайном (
ил. 4
). 
К концу первого десятилетия нового тысячелетия Интернет уже стал частью нашей 
культуры. Фотохостинг Flickr был назван одним из 50 лучших веб-сайтов по версии Times 
в 2009 г. Созданный американской компанией Yahoo, Flickr дал людям возможность хранить 
и публиковать свои фото в Интернете. 
По мере роста использования мобильного Интернета, дизайн под мобильные устрой-
ства стал набирать популярность. В 2010 г. успешный и целеустремленный веб-дизайнер 
по имени Итан Маркотт бросил вызов старому подходу к проектированию дизайна мобиль-
ных веб-сайтов. Вместо создания отдельного сайта для телефонов, он предложил исполь-
зовать один и тот же веб-дизайн, автоматически подстраиваемый под разное разрешение 
экранов. Так был создан адаптивный дизайн. 
С технической точки зрения, мы все еще используем HTML и CSS, так что это ско-
рее концептуальный прогресс. Основное преимущество адаптивного дизайна — это паритет 
контента, то есть использование одного и того же веб-сайта.
В дизайне, ориентированном на развитие конкретного продукта или услуги, использу-
ется систематический подход к SEO-оптимизации (поисковая оптимизация), чтобы помочь 
компаниям рационально тратить время на привлечение нужных посетителей, подталкивать 
их к совершению целевого действия (сделать покупку, оставить заявку и т. д.). Что в свою 
очередь приводит к повышению рентабельности инвестиций и более быстрому росту дохо-
дов. Успешные компании понимают, что их веб-сайт никогда не будет иметь «законченный 
вид». Вместо этого они работают с маркетологами, чтобы иметь гарантию того, что их сайт 
всегда будет актуальным. 

---

702