Изучая очередные материалы по возможностям ускорения сайта, обнаружил одну интересную технику, позволяющую сократить количество подгружаемой мелкой графики, и не мелкой тоже, но больше всего данное решение подходит именно к мелкой графике, а точнее к иконкам. Техника эта заключается в замене графических иконок и других возможных изображений символами из импортированного шрифта.
Рассматривая разные варианты оптимизации скорости сайта, в том числе путем сокращения запросов к серверу, наткнулся на одно интересное решение. Мы все используем буллеты для оформления списков, меню и т.д. Как оказалось можно не только делать буллеты, вставляя символы через content, но и рисовать полноценные треугольные средства CSS.
Продолжая осваивать адаптивную верстку, как элемент адаптивного дизайна, решил написать про медиа-запросы или медиазапросы, в оригинале media-queries. Как мы помним из теоретических основ адаптивной верстки и адаптивного дизайна, медиа-запросы это одна из основных концепций данной технологии и без ее глубокого понимания освоить адаптивную верстку просто не получится.
Все большую популярность в веб разработке получает кроссбраузерная адаптивная верстка. Тема эта большая и практически неисчерпаемая, так как постоянно появляются новые HTML теги, идеи и решения. Чтобы не отставать от прогресса и понимать, как устроена адаптивная верстка, попробуем разобраться в основах адаптивного дизайна и адаптивного сайтостроения.
Очередное небольшое решение из мира верстки и CSS. Любой верстальщик регулярно сталкивается с маркированными списками и маркерами для этих списков, которыми можно красиво стилизовать эти списки, особенно если это пункты меню. Списки выглядят круто и вроде больше ничего не надо дорабатывать, пока не появляется многострочный пункт, когда переносящийся текст начинает выглядеть некрасиво.
В последнее время все чаще встает необходимость в момент верстки задавать фиксированную ширину для пунктов меню. Почему в последнее время спросите вы? Не так давно начал осваивать адаптивную верстку, одна из концепций которой позволяет (а иногда вынуждает) задавать ширину в процентном соотношении. Плюсы подобного подхода в том, что при любом разрешении экрана мы получим именно тот размер, который нами был запланирован. Больше никаких непонятных переносов при изменении размера экрана.
Несомненным трендом конца того и началом этого года является ускорение работы сайта. Если раньше ускорение работы сайта рекомендовалось специалистами по usability, мол, медленно работающий сайт отпугивает пользователя, то сейчас об ускорении работы сайта начали говорить seo оптимизаторы. Есть мнение, что скорость работы сайта уже учитывается поисковыми системами с целью оценки качественности и авторитетности сайта. Возникает вопрос, как мы можем простыми средствами сократить время загрузки сайта?
Любой разработчик рано или поздно сталкивается с тем, что дизайнер в ходе создания макет импортировал в него "небезопасный" шрифт, и соответственно мы столкнемся с тем, что у некоторых пользователей шрифт будет не тем, какой планировал дизайнер. А значит теряется не только целостность задуманной дизайнером картинки, но и кроссбраузерность верстки.