Создание сайта с нуля. Урок 12 - Начинаем верстать шапку

Это 12-й урок по созданию сайта под ключ на заказ. Сегодня мы приступаем к адаптивной HTML верстке шапки сайта.

Таймкоды:
00:00 Начало урока
00:38 Настройки проекта для верстки
07:24 HTML верстка логотипа, меню и телефона

[andreywebdesign]

Красава вообще! Я уроки твои обожаю. На bootstrap молюсь теперь, благодаря твоим урокам))
Желаю тебе, Джедай Вёрстки, творческих успехов и чтоб семья была крепкая, хорошая. Твой труд бесценен!

[cryptoOptimist]

Очень крутые видео Так хочется научится этому Но думаю это так все нереально тяжело ! столько знать нужно всего

[ooqrvzc]

Хочу сказать что это настолько простой урок, что я прошёл его всего то с пятого раза

[lmi]

Алексей, вам удобно компилировать Sass в слепую? Можно поставить в стартовой шаблон _optimized_gulp_sass плагин gulp-notify, который будет сообщать об спешной компиляции Sass :) Возможно вам это и не нужно, но новичкам пригодиться.

[kcijbtq]

Я напишу, как я решаю проблемы, пишу для таких же новичков, как и я сама, поэтому не претендую на то что всё правильно делаю, но иногда мне это помогает, очень надеюсь, что кто-нибудь дополнит этот коммент и поделится своими знаниями, итак:
1- внимательно (прям по секундам) просмотрите кусок где не понятно, если все равно не понятно, то попробуйте погуглить наверняка об этом написана более подробная статья или видосик.
2- посмотрите командную строку (вы её открыли когда запускали gulp), там прописывается каждое ваше сохранение и если где то вы совершили ошибку, то наверняка там отразится
3- перезагрузите компьютер
4- откройте файл из папки ready_html скопируйте участок в котором работает Алексей, и вставьте его в свой файл.
Если всё равно не работает, то ещё раз перезагрузите компьютер.
5- если вы всё перепробовали и всё равно не получается и вы на 100% уверены, что код написан правильно, то удалите все файлы и переустановите программы, только удалите все файлы, включая и папку урока.
Вот и всё, надеюсь, что эти алгоритмы кому нибудь пригодятся )))
Удачи

[ysuuunl]

Огромное спасибо за ответ. Запустил из папки gulp и так же в sublime text - ура значок изменился. Решил перенести шрифты в папку со шрифтами и прописать путь как в уроке - сначала значок не пропадал при том, что шрифты из папки были уже удалены. После повторного запуска gulp удалился. И теперь какие бы манипуляции не проводил все равно не работает иконка. Если вам не трудно подскажите пожалуйста где можно почитать про нюансы работы с сервером gulp. заранее спасибо.

[akzhanonggar]

у меня размер логотипа не меняется, файрбаке показывает width: 98px зачеркнутый, размеры не меняется , попробовал написать заново, всё ровно не получилось, помогите разобраться буду очень рад

[sadmaneg_]

Люди, не могу решить проблемы с bg-top.jpg. Ни в какую фон не появляется, все миллион раз перепроверил. По видео не понятно как начальник исправил проблему

P.S. Решил проблему, искало по адресу css/img/ . Т.е. я перекинул пока папку img в css, и все заработало, но надо понять причину, почему оно сначала в css захоидт

[bibigylbylbyl]

22:26 в Bootstrap 4 push и pull меняются на order. У меня получилось следующее:

<div class="col-md-2 order-md-2">
телефон
</div>
<div class="col-md-8 order-md-1">
меню
</div>

[fabrizio_pisani]

как вариант можно использовать синтаксис sass:

header
background:
color: tomato
size: cover
position: center

[valerkakirpich]

Алексей, не подскажите? В определённый момент localhost перестал запускаться. Не понимаю почему. Когда я удаляю квадратные скобки и то что в них есть в галп-файле в строке gulp.task('browser-sync', ['styles', 'scripts'], function(), то всё работает, но так и не понял на что это влияет. Верстаю пока так, просто хотелось бы понять скажется ли это как то в дальшейшем?

[wbfmntn]

Подскажите, пожалуйста. Такая проблема, кто знает как ее решить?

WARNING: [Bourbon] [Deprecation] em is deprecated and will be removed in 5.0.0.
Обновил пакеты все ровно ошибка

[petrozubar]

Доброго времени суток!
Очень интересует вопрос, каким образом на свет появилась папочка "_optimized_gulp_sass", для всех ли проектов она используется, и как ее самому вообще создавать?
Большое спасибо за ответ и автору - за прекрасные уроки!

[AlexsandrOmel]

Один момент, на счет Emmet, его не только надо установить, но и зажимать Tab?!
Потому, у меня только так работает. В целом курсы толковые. Спасибо!

[InformationTechnology-hzfo]

У меня почему то все слова прописными не подскажите в чем может быть причина?

[zimandima]

кто расскажет что не так, делал все по уроку, ошибка после запуска gulp в проекте:
"Error in plugin 'sass'
Message:
sass/header.sass
undefined".

[zdsrovm]

Здравствуйте! А что значит "." перед "main-head"?

[zolotarov]

Скажите пожалуйста, какой способ все таки лучше? Распаковка скачанной библиотеки Font-awesome и дальнейшей ее распаковки по корневой папке, или же установкa ее с помощь консольной команды ~$ bower i font-awesome?

[mostbetuz]

Здравствуй Алексей что делать если картинка меньше 1920 px
у надо что бы она занимала всю ширину, потому что когда смотришь на моб устройстве то справа белый фон выглядывает .
Спасибо за уроки !

[vectura]

Алексей, здравствуйте, подскажите пожалуйста

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

CONVERT CALL:
convert -type TrueColorMatte -channel RGBA -size 32x32 -alpha transparent xc:none -fill "#808080FF" -draw "circle 15, 16 8, 10" Text 3\Packages\User\Color Highlighter\icons\808080FF"
convert error:
'utf-8' codec can't decode byte 0x8d in position 0: invalid start byte

Как дилентанту подскажите, в чем беда? Почему стили не работают? И при чем тут кодировка?