Начало | Видеосоветы

Главная » Новости сайта »Начало

12:50 Начало
Всегда хочется поставить начальную точку. Эта заметка появилась самой первой. Начато редактирование сайта 23.09.2013 Да, был совершенно другой, примитивный, но романтический дизайн сайта с воздушным шариком. Его мы и поместили здесь. Ностальгия, ничего не поделаешь. 1.08.2015 - закончен переход на новый шаблон сайта. Кроме красивых картинок в заставке, изменилась вся идеология дизайна - от фиксированной верстке мы перешли к адаптивному (responsive) шаблону. Как известно, такой подход делает просмотр удобным на различных, в том числе и мобильных, устройствах. Применение готовых решений UCOZ, конечно, упростило задачу, но пришлось повозиться и с самим шаблоном и с компоновкой многих страниц. В общем, задача усложнилась, так как теперь пришлось проверять страницы на соответствие с требованиями Google (speed test): Адаптируйте размер контента для области просмотра Используйте удобочитаемые размеры шрифтов Настройте область просмотра Откажитесь от плагинов Увеличьте размер активных элементов на странице. И всё это пришлось сделать. Результат пока радует, хотя необходимо время и сотни проверок, что бы появилась полная уверенность. Паралельно, выявлялись маленькие тонкости, связанные с адаптивным шаблоном и с особенностями HTML `<img width="20" src="/.../start.jpg" height="20 /> и <img src="/.../start.jpg" style="width:20px; height:20px;> дадут один и тот же результат в фиксированном дизайне и совершенно разный при использовании тега viewport` <meta name="viewport" content="width=device-width, initial-scale=1.0"> Фокус заключается в масштабировании рисунка браузером при изменении разрешения экрана. Задание размеров рисунка в виде style (2-й вариант") действительно фиксирует размеры рисунка, а в первом случае рисунок масштабируется. Вообще, с рисунками возникает наибольшее число трудностей. При фиксированном дизайне можно ориентироваться на самый "маленький" размер экрана компьютера и все расчеты строить исходя из этого. При этом редко приходится менять размеры изображения. В адаптивном варианте стоит помещать изображения в контейнеры и применять max-width для свойств. Да и добиться, что бы картинка находилась в центре страницы - дело хитрое. Многие любимые советы не работают. Прежде всего нужно сделать float: none; Затем, проанализировать сам размер картинки. Хорошо, если он больше, заданного в max-width;, ну, а если нет - то этот параметр нужно переопределить. Достигли ли мы совершенства? Конечно нет. Ну, будем работать.
Категория: Новости сайта \| Просмотров: 1169 \| Добавил:

Всего комментариев: 0

Добавлять комментарии могут только зарегистрированные пользователи.
РЕГИСТРАЦИЯ ВХОД