Современный стиль вёрстки. Как правильно верстать?
Здравствуйте, друзья!
Я верстальщик, можно сказать уже с каким-то небольшим опытом. До сих пор я верстал в основном либо лендинги, либо не очень сложные многостраничники. В последнее время нечаяно мне попались фрагменты из курсов, где рассказывают про профессиональную вёрстку. Там говорится про Retina-Ready, SVG и SVG спрайты, оптимизацию сайта, про сборщики, таск менеджеры и так далее. Вот я никак не могу понять, возмём для примера относительно новый элемент picture. Получается, что для одного изображения мне нужно написать довольно большой фрагмент кода, если я хочу чтобы сайт был оптимизированным, подготовленным для Retina дисплеев и ещё адаптивным(всм. что для разных разрешений напимер я могу загрузить разные размеры одного и того же изображения). Вот я не могу понять, насколько это применимо сейчас например на фрилансе. Нужно ли каждый проект, неважно лендинг это или многостраничный сайт, написать в таком стиле? Я конечно понимаю что всё зависит от желаний заказчика, но мне мучает ещё один вопрос. Сегодня в рынке очень много заказов различных лендингов, а на простые лендинги(например, демонстрация товара) могут зайти пользователи практический с любого устройства. Там не скажешь конкретно много заходят например с андроида или с айфона? Получается, если ты хочешь быть и "выглядеть" профессиональным, скажем, верстальщиком - то тебе нужно практический каждый сайт написать в таком стиле. Тогда почему на многих, так сказать, хороших сайтах этого нет? И как тогда реализовать по другому например поддержку и ретина экранов, и вместе с этим, поддержку например webp и чтобы ещё всё это было оптимизированно?
Спасибо что прочитали до конца. Ещё заранее спасибо за ответ.
Хочу услышать мнение разных специалистов по этому поводу. Кому не лень и интересна эта тема, буду рад услышать и ваше мнение.
Весь вопрос в том, сколько вам платят за работу и сколько времени есть на ее выполнение.
Я смею считать себя профессионалом. Но это не мешает мне писать и выкатывать в продакшн неоптимизированный код, если на то есть причины (деньги/время).
Сергей delphinpro, спасибо за мнение. Короче говоря, если всё подытожить, получаеться что всё зависит от конкретного проекта. Я правильно понял? Если заказчик говорит что нужен хороший, оптимизированный код, то можно и нужно заморачиваться, если же нет - то просто писать "обычный" код.
Самвел Арутюнян, если вам оплатили Х часов и вы успеваете в эти Х часов написать оптимизированный код - пишите. Если заказчику нужен оптимизированный код и вам для этого нужно Y часов - вы должны попросить оплату за Y часов и написать требуемое.
Выглядеть профессионалом - это круто. И даже можно для портфолио сделать парочку крутых проектов.
Но в конечном итоге вы работаете ради денег. По деньгам и смотрите.
Про то, делать что-то или нет - как минимум это либо есть в требованиях заказчика, либо вы как исполнитель делаете это в первую очередь для того, чтобы показать свой профессионализм, чтобы поднять свою стоимость за час. Естественно не каждый заказчик захочет платить, но тут уже сможете ли вы ему объяснить почему так нужно делать
Там говорится про Retina-Ready, SVG и SVG спрайты, оптимизацию сайта, про сборщики, таск менеджеры и так далее.
Сборщики, таск менеджеры это все таки про более менее крупные/средние проекты. Это больше относится к разработке, не все заказчики требуют это. Таск менеджеры вы можете просто для себя использовать - приучат к организованности рабочего процесса.
Почитайте про плюсы svg, часть вопросов отпадет сама собой. Будете ли вы этим заниматься - к вам вопрос. Иконки тоже кто-то должен переводить в svg, например. Обычно это делают дизайнеры. Время - деньги, мимолетные заказчики на фрилансе не любят отдавать деньги. Вывод делай сам.
Получается, что для одного изображения мне нужно написать довольно большой фрагмент кода, если я хочу чтобы сайт был оптимизированным, подготовленным для Retina дисплеев и ещё адаптивным(всм. что для разных разрешений напимер я могу загрузить разные размеры одного и того же изображения).
В чем плюс svg - не нужно загружать много размеров.
Там не скажешь конкретно много заходят например с андроида или с айфона?
А как же яндекс.метрка и другие похожие сервисы, например? Там можно отслеживать это.
Тогда почему на многих, так сказать, хороших сайтах этого нет?
Дело в бизнесе - не все фирмы могут себе позволить быстро что-то менять, есть возможно более приоритетные задачи.
Огромное спасибо за развёрнутый ответ.
Что касается четвёртого пунтка - я говорил именно про растровые изображения. Про вектор и так уже понятно, что svg решает много вопросов. Про пятый пункт - я имел ввиду перед созданием сайта не сможешь сказать, ну если конечно это не конкретная тематика. Например, новости про Apple по логике должны заинтересовать людям с устройствами Apple, но на лендинг про какой то "общий" товар - например окна для дома могут зайти пользователи с любого устройства. Конкретно можно узнать, да, но только после определённого времени после публикации сайта.
либо вы как исполнитель делаете это в первую очередь для того, чтобы показать свой профессионализм
Я про это и говорил. Что например вы думаете по этому поводу? Насколько часто по вашему заказчики будут смотреть на именно такой стиль вёрстки? Я вот думаю, по моему, после всей этой информации можно держать в портфолио и простые какие нибудь проекты, и сложные тоже(всм. со всеми этими новыми технологиями). Потом уже по усмотрению каждого определённого заказчика.
Про я так понимаю, тема довольно нераспространенная, или я не совсем хорошо искал, но всё же. Хочу узнать что думают другие по этому поводу. Ещё раз спасибо за ответ.
Сборщики проектов в любом случае упростят вам жизнь при верстке (если взять например простые вещи: автоматическое обновление страницы при любом изменении кода, оптимизация стилей и тд) т.е корректно настроенные сборщики сделают большую рутинную работу за вас. Это плюс как никак если отходить от классических методов. Эти средства вы можете, а точнее должны использовать в любом проекте.
От себя скажу, что в простых проектах не сильно замарачиваюсь в оптимизации. Как правило оптимизация кода, картинок и применение svg иконок.
Если заказчик просит по максимуму выжимать, приходится делать иногда что то странное ради результата.
Здравствуйте. Спасибо за ответ. Наверное я немножко неправильно сформулировал свои мысли, поэтому вы подумали что я спрашиваю и про сборщики. Со сборщиками я работаю, я даже скажу своё мнение - они не совсем уж и связаны с вёрсткой, они просто упрощают работу верстальщика, делают много всего, чего самому делать, я бы сказал, нельзя)) Вообщем, я понял что всё зависит от заказчика и от самого проекта. Просто мой вопрос про некоторые вещи, которые реально очень сильно упрощают работу клиента с сайтом, и это конечно нужно заказчикам, но на многих сайтах, в которых они скажем так должны были быть - их нет. Я вот никак не мог понять - это сейчас стандарт вёрстки или всё же нужно ориентироваться на клиента. Ответ на свой вопрос я получил. Ещё раз спасибо за помощь)
Простой
Средний
