Как правильно и быстро верстать сайты
HTML-код
- Опубликовано: 16 июл 2016
- Все курсы в одном комплекте: wd-m.ru/bundle
Создание сайта от А до Я: goo.gl/ankxq9
Всем привет, друзья. Сегодня мы затронем очень важную тему - быстрая и правильная HTML верстка макетов. Углубимся в проблему, разберем все возможные способы ускорения верстки без потери в качестве на всех этапах. Данный вопрос интересует очень многих веб-разработчиков, интересовал и меня, когда я уже углублялся более серьезно в веб-разработку.
Статья «Как правильно и быстро верстать сайты»: webdesign-master.ru/blog/html...
ВКонтакте: jediweb
Телеграм: t.me/jediweb
Дзен: dzen.ru/jediweb
💥 Все курсы в одном комплекте 👇👇👇
webdesign-master.ru/bundle_courses
Благодарен автору за данный канал! Прям безгранично! 70% имеющихся навыков и знаний, которые у меня накопились за небольшой промежуток времени, я получил с этого канала. Что позволило мне понять логику и алгоритм работы , помогло найти первую full-time работу и первые заказы с бирж freelance. Спасибо Автор за труды и время которое ты уделяешь для таких newbie как я!)
Давно подписан на Ваш канал, слежу за обновлениями, реально качество производимого контента очень выросло. Динамика, слог, информация, смотрел с большим удовольствием. Респект!
Побольше бы таких видео на ютубе. 25 минут, а столько полезной инфы. Сохранил его себе в закладки уже 3-ий раз пересматриваю и потихоньку начинаю использовать технологии и методы из этого видео. Отлично, автору респект!!!
Просматриваю это видео на протяжении месяца уже несколько раз - каждый раз увеличиваю свою продуктивность, благодаря услышанному, что возможно пропустил!
Удивительное видео попалось в рекомендациях)).
Ставлю лайк, оформляю подписку) Хоть и большинство тем я уже проехал, но кое-что отложил в полочку полезного)). Так же буду начинать с вами учить gulp. Спасибо за годный контент! Очень круто, продолжайте.
А остальным скажу, ребята кто начинает не бросайте, кто уже в теме не думайте что прогресс остановился - всегда развивайтесь.
Супер! Научился у Вас очень многому! Спасибо! Очень доступно, а главное правильно все разжевали! Я имею в виду не только данное видео, но и все Ваши плейлисты. Теперь это уже настоящая "библия" верстальщика.
Вот что называется качественный контент. Тонна благодарности.
С учётом времени на прокрастинацию :D Запомню выражение
Отличное видео! Благодарю.
Сам долгое время занимаюсь версткой и все никак не дойду до некоторых вещей, что озвучены в видео. Надеюсь, эта инфа подтолкнет меня к развитию :)
Идея для нового видео. Как создать простенький сайт совсем новичку. И спасибо за ваши видео.
Я бэкэнд разраб, который решил расширить свои профессиональные навыки до фронта. И видео уроки на этом канале, это одни из лучших и понятных гайдов по дизайну-верстке сайтов. Автору канала большое спасибо!
Интересная подача информации. Всё по делу. Респект!
Чего только стоят: "в кармане бублик", "горячая вода по трубам"...;)
С шуток про колбасу и психоанализ проорал, понял что тип нормальный и надо подписаться
Обновил страницу и новый видос! Круто. Лайк не глядя, а завтра посмотрю.
Спасибо за новый видос =)
Столько нужной полезной информации за 25 мин уложил! Супер)
четко все так, по полочкам, спасибо! Это очень здорово, когда дизайнер соблюдает все то, что ты описал в конце видео, тогда работа только в удовольствие. А чаще всего так все выглядит, что дают тебе макет, а там видно, что дизайнера вообще не колышет что будут делать с его макетом в дальнейшем, ну или видно что, что то старался сделать, но не до конца и решил, что и так сойдет:) типа главное деньги за дизайн получить, а дальше я умываю руки:)
Боже,так этого не хватало,огромное спасибо вам🔥🔥🔥
Огромное спасибо! очень давно Хочу заниматься этим ремеслом) еще со школы) Но все ведут по неправильному пути) тут Вы рассказали все ясно и понятно) мне еще многое предстоит изучить! Огромное спасибо за помощь, таким же как я !
Всё четко и по делу, отдельное спасибо за перечень условий правильной подготовки psd-макета к верстке.
Очень часто приходится задаваться вопросами, почему верстальщик должен парится в фотошопе...
И постфактум о том, что перфект-пиксель не имеет особого смысла в responsive-верстке - это именно то, что нужно знать каждому менеджер/дизайнеру, который контролирует верстальщика) Буду скидывать это видео, если дизайнер будет не согласен)!
Видосы четкие, ждём новых!
Большое спасибо, как всегда качественный материал.
Респект! все по делу, без воды. Недостающее звено.
Очень грамотно! Автору респект!))
Спасибо за видос и "колбасное" выражение)
Молодец, без воды, четко и ясно. Спасибо за проделаную работу.
Извлек для себя много полезной инфы! Спасибо)
Отличный урок! Спасибо
Спасибо за полезную информацию.
Спасибо большое за такой подробный рассказ!
Спасибо, очень полезное видео. Получил много новой информации. Удачи.
СПАСИБО! Очень полезная информация
Очень круто, огромное спасибо!
Спасибо за хорошее, информативное видео.
Благодарю за видео. Было полезно!
Спасибо большое за видео!
Спасибо, дружище.
Всё очень круто, спасибо
Достаточно все понятно, и мало пустой болтавни.
Зачетное вступление )
ахахах) класс) вдумчиво и медленно я делала первые месяца 4, потом на то же самое у меня уходило пару часов а не неделя) все верно)
Много пока непонятного, но выглядит убедительно.
Спасибо за видео!
Спасибо большущее за видео. Скачал себе на ноут, буду смотреть изредка чтобы не сбиваться с курса :)
И че как успехи
Шикарно :)
Спасибо за видео! Было интересно.
Подскажите, какие программы использовались? Фотошоп? Sublime Text? Шрифт не Fira Code?
А чем видео записывали и нажатия на клавиши? Понравилось, что внизу экрана показывается кнопка, которая была нажата, мощно!
И ещё одно: где можно взять этот и подобные макеты для тренировок?
Отличное видео!
чётко и интересно
Ахха, про нытиков и бублик в точку попал)))
Полезное видео, спасибо!
Хороший материал)))))
В продолжении было бы интересно, как установить и настроить zurb, на него jekyll, подключать генерируемые коды и т.д.
Сколько ж всего надо знать и уметь!!! На это уйдут годы!!!
это только так кажется
Спасибо за видео
спасибо полезное видео.
Я занимаюсь фулл-стак веб разработкой (Angular 2, meteor.js, ASP MVC, SharePoint и т.д.). Верстать разумеется тоже умею. Сколько не работаю, дизайн разрабатывал отдельный человек. Решил сделать интересный пэт-проект (веб приложение) и под это дело изучить веб дизайн. Но вот незадачка, изучение фотошопа и рисование дизайна оказалось для меня слишком скучной затеей - не мое это. Есть ли какие инструменты по-проще, для создания дизайна "на коленке"? Не хочется на лету делать верстку но и не хочется на процес дизайна тратить кучу времени, так как я больше кодер чем дизайнер. Thx :)
красавчик!!! Лайк и подписка!!))))))
Класс!
Спасибо за видео. Почти все использую, более того, есть своя сборка gulp, где уже встроены Jade шаблоны. И многое импортированы и подключено, так как тянется из проекта в проект. На счет выгрузки и графики слышали про zeplin? Сейчас выгружаю в него PSD макет. Оч удобно и четко. Советую посмотреть в эту сторону, и хотелось бы видео от вас по zeplin.
У тебя суперский голос
Thank you very much! Awesome!!!
Какая сейчас средняя стоимость дизайна 1 страницы сайта или ленда ? И стоимость верстки 1 страницы?
Спасибо !
Непонятно из видео, нужно ли делать предварительный веб-дизайн для сайта на WordPress?
Канал у тебя тоже бомба
Ты крутой, я бы хотел учиться у тебя в школе на очном обучении.
Колбасу лучше вовсе не кушать...))))
Почему, в колбасе тоже иногда есть мясо, видимо из-за несчастного случая на производстве, но всё же)
отлично! Можете сказать сколько сейчас стоит Ваша верстка например landing page мин-макс?)
просто супер
Блин, делал по ходу видео конспект, и только в конце понял, что есть текстовая версия видео для возвращения к рассмотренным вопросам.
ничего страшного
подскажите, пожалуйста как установить jekyll на foundation. А лучше уроки по foundation запишите. Хорошо рассказываете.
А что делать если шрифты рендерятся в браузерах по разному? они смещаются на 1 пиксел по вертикали.
класс
Меня всегда интересовал вопрос, ты как-то говорил что сначала нужно поработать за небольшие деньги но набить руку. Ты имеешь в виду админом сайта или что-то в том роде?
Классный урок! Можешь сделать урок про CMS на php и MySQL?
На счет режимов наложения, в css есть свойство background-blend-mode
можно скачивать полостью готовый сайт, допустим взял шаблон, переделал на свой манер, но как изменить ссылки, допустим взял продажник, на его сайте ссылка ведёт в одно место, как мне изменить исходный путь путём подмены ссылки?
пользуешься ли ты less препроцессором и почему?
Автор, скажи как ты в эммете настроил lorem для кириллической "рыбы"?
loremru + TAB
Спасибо.
А что потом с этой версткой делать? Это же получается просто шаблон,нужен еще и движок чтобы это был полноценный сайт.Такой шаблон можно на любой движок поставить или как это работает?
Можно осуществить посадку на CMS или Фреймворк. Я после вёрстки осуществляю посадку на Modx Revolution. Посмотрите серию уроков "Создание сайта под ключ". В этом бесплатном курсе мы создаём дизайн, верстаем и осуществляем посадку на CMS Modx с админ-панелью для Настройки и наполнения сайта: ruclips.net/video/5osJMAnzwkE/видео.html
Привет а курсы есть у тебя... За ранее спасибо
Можно ли вместо bootstrap использовать css grid ? (Я новичок)
Сколько же ты этому учился
Отличное видео, спасибо! Алексей, скажите пожалуйста, а по унисону будут еще видео? Или курс. А то инфы ни где нет, кроме этого канала :)
Спасибо. У нас же есть исчерпывающее видео по Unyson. Там практически вся база.
Да просто думал, может вы на нем что-то делать будете, чтоб так сказать посмотреть на живую реализацию проекта в нем. Кстати Вы сами, какой фрейм для тем вп предпочитаете?
Я работаю преимущественно с MODx Revolution. Но если в мире существовал бы только один WordPress, я использовал бы Unyson.
Понял, спасибо :) я вот тоже все хочу на модекс перейти, но пугает то, что в случае острой необходимости быстрого решения не будет возможности решить ее при помощи готовых плагинов. :) но однажды я это сделаю))
Если нужна работа с БД - это уже back-end. А так все супер
Добрый день! узнал от вас от такой штуки sass, ищу решение как установить его на windows7 видел у вас например используется gulp а видел другие видео, что устанавливают sass с compas скачивают его с сайта руби, посоветуйте по какому пути пойти с компасом или gulp и почему?
Да особо разницы то и нет.
Всем привет!!! может подскажете площадку для "фриланса", а то жуть как хочется попробовать свои силы, а на работу без опыта не берут(((?????
fl ru, kwork
капец... чувак как к тебе в падаваны попасть?
Сколько пытаюсь верстать - НЕ МОЕ, я больше предпочитаю backend..... Пересмотрел туеву хучу видео по вёрстке и т.д, сколько не пытался, не получается. У кого-то может и наоборот. Всем начинающим и опытным побольше проектов и терпения)
а еще лучше взять бутстрап или другой фреймворк и разрабатывать на базе него. В них уже куча мелочей, таких как сетка, вертикальный ритм, масштабирование картинок и тп учтены.
о, новый макет!
скоро ждать нового джедая верстки?
Это "Создание сайта под ключ" и он уже сверстан в уроках :-)
подскажите название вашей темы в sublime?
Называется Space Gray.
packagecontrol.io/packages/Theme%20-%20Spacegray
Максимально похоже на это github.com/ptraceur/OneDarkMaterial, если не ошибаюсь, комменты выше фуфел
Если я не ошибаюсь, но работа с базой данных это уже бэкенд, а не фронтэнд?
Да. Но там все очень взаимосвязано и понимать такие вещи нужно.
Где брать начинающему разработчику практику касательно верстки?
Egor M ну например в интернете. Скачал psd макет и вперёд.
Что за тема/цветовая схема у саблайма стоит?
One Dark Material - Theme
Докторская за 900 бомба
Можна создать в фотошопе типу макроса , что б автоматизировать действия
А что за тема у sublime?
ruclips.net/video/qlueo6wFikM/видео.html
Как определить где ставить маргин а где паддинг ?
Как сделать, чтобы Шапка сайта была поверх всех окон, а при увеличении страницы Шапка теряла способность быть поверх всех окон?
display: fixed
Что это за особый сорт докторской колбасы аж за 900 рублей?:)
Есть определённые производители, которые ещё пока что делают качественные продукты. Попробуйте поискать на прилавках вашего супермаркета и почитать состав колбас.
@@wdm, Будет гайд на колбасу?
Aninao позже.
Верстка скоростная когда на скоростях)))