Сервис удаления неиспользуемого css

Иногда на сайте в файлах стилей присутствует код, часть css правил которых не используется. Чтобы их удалить можно воспользоваться сервисом uncss-online.com

Не применяются css

Правки стилей сайта производятся очень часто. Бывает, что нужно немного изменить цвет, положение, размеры или оформление определенного элемента сайта. Сначала инспектором веб браузера необходимо проверить правильность написания самих css правил:css

Надпись inspector-stylesheet говорит о том, что данное правило добавлено не в css файлах, а вручную через инспектор. Если через инспектор необходимые изменения внешнего вида корректируемого элемента были достигнуты, то далее необходимо эти изменения внести в файл стилей сайта. Читать далее «Не применяются css»

Что такое pixel perfect верстка

Каждый человек, который имеет дело с созданием сайтов рано или поздно сталкивается с его версткой. Верстка сайта — это перенос графического дизайна сайта в html/css. Графический дизайн ранее чаще всего делался в photoshop, теперь же более популярны инструменты вроде figma. Фигма позволяет ускорить процесс верстки, делает его более удобным.

Верстка сама по себе процесс не быстрый. Конечно, все зависит от конкретного исполнителя, от его опыта. Задача верстальщика сделать так, чтобы внешний вид сайта в браузере был точно таким же как на макете. Вот тут мы плавно и подходим к понятию верстка «пиксель в пиксель», которое означает что картинка в окне графического редактора и в окне браузера будут одинаковы до пикселя.

Читать далее «Что такое pixel perfect верстка»

Как инспектором найти hover

Иногда необходимо посмотреть как на сайте сделан hover эффект. Это бывает нужно, чтобы увидеть css правила,  с помощью которых реализуется определенное поведение элемента при наведении на него стрелки мыши.

Но зачастую при просмотре инспектором браузера не удается увидеть эти свойства. Показываются только css правила не связанные с псевдоклассом hover. Сам долго времени тратил на нахождение, пока мне не подсказали, что во всех браузерах при просмотре кода инспектором есть специальная кнопкаhover

Читать далее «Как инспектором найти hover»

Убрать ссылку у текущих пунктов меню

Чтобы убрать на странице циклические ссылки

 

Lazy Load на лендинг

Лендинг представляет собой одностраничный сайт. У него вся информация расположена на одной странице в виде секций. Если одна либо несколько секций содержит большое количество изображений, то для увеличения скорости загрузки сайта целесообразно использовать ленивую загрузку изображений (lazy load). Эта техника заключается в том, что при загрузке страницы помеченные изображения не прогружаются, вместо них показывается заглушка. Когда же пользователь прокручивает страницу до картинки, то вместо заглушки с сервера загружается изображение. Таким приемом можно существенно сэкономить вес загружаемой страницы. Читать далее «Lazy Load на лендинг»

Сертификат нетологии

Когда я только начинал осваивать верстку, то изучая какую-то статью в интернет увидел рекламу, о бесплатной возможности пройти онлайн-курсы в нетологии. По окончании курсов при условии успешной сдачи экзамена должны были дать сертификат. Я был наивен, и считал, что сертификат — это очень важно, и работодатели на человека с сертификатом обратят внимание. Тем более бесплатно, почему нет. До этого я никакие курсы не проходил и с интересом записался. Впоследствии скажу, что бесплатная часть курсов от htmlacademy дала мне гораздо больше, действительно чему-то научила. Но обо все по порядку. Читать далее «Сертификат нетологии»

Лендинг на конструкторе — за и против

Интернет пестрит рекламой, которая обещает человеку, что он абсолютно без каких-либо знаний и денежных вложений создаст сайт за 10 минут. Стоит только набрать «Создать сайт в конструкторе» в поисковой системе — и вас долго будет докучать надоедливая контекстная реклама, расхваливающая на все лады очередной конструктор. Но, как известно, у всего есть свои плюсы и минусы. А также бесплатный сыр бывает только в мышеловке. Человек, который хочет создать лендинг чаще всего желает продавать какой-то товар либо услугу. Деньги на создание сайта он тратить хочет по минимуму. Поэтому в случае разработки лендинга, вариантов действительно два: Читать далее «Лендинг на конструкторе — за и против»

Оптимизация картинок для сайта

Одним из факторов ранжирования сайта в поисковой выдаче является скорость его загрузки. Чем быстрее грузится сайт, тем меньше пользователю необходимо ждать загрузки страницы. Это особенно критично в случае с мобильным интернетом при просмотре сайта с мобильных устройств.  А скорость загрузки естественно зависит от объема передаваемых данных от сервера на котором лежит сайт до устройства пользователя.  И как правило, в общем объеме передаваемых данных доля картинок велика, поэтому проблема оптимизации изображений является актуальной для любого сайта, независимо от его cms. Читать далее «Оптимизация картинок для сайта»

Валидация html css

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

  • Google Chrome
  • Mozilla Firefox
  • Opera
  • Safari
  • Edge и его предшественники IE
  • Всевозможные попытки отечественных интернет-гигантов создать свой браузер. Например, Яндекс.Браузер от яндекса; Амиго от mail.ru и т.д

Браузер отображает пользователю код веб-сайта. И соответственно, чтобы все браузеры одинаково отображали один и тот же код, он должен соответствовать определенному стандарту. Читать далее «Валидация html css»