sergey

это в gulp указывается так путь к исходникам и папкам css файлов, как пример по изображениям: img: 'src/img/**/*.*'

это здорово, но просто нереально:) времени на это нет

устал читать, купи, скачай, поставь и работай с phpStorm и не знай себе горя и проблем.

Это все в js делать?

Сейчас код выглядит следующим образом, и при адаптивном меню открывается только первый пункт, остальные не срабатывают

<?php if ($categories) { ?>
	<div class="container">
		<a class="toggleMenu" href="#">Menu</a>
		<ul class="nav_menu">
			<?php foreach ($categories as $category) { ?>
			<li><?php if ($category['children']) { ?><?php } ?>
				<a href="<?php echo $category['href']; ?>"><?php echo $category['name']; ?></a>
				<?php if ($category['children']) { ?>
				<?php for ($i = 0; $i < count($category['children']);) { ?>
				<ul>
					<?php $j = $i + ceil(count($category['children']) / $category['column']); ?>

					<?php for (; $i < $j; $i++) { ?>

					<?php if (isset($category['children'][$i])) { ?>
					<li>
						<a href="<?php echo $category['children'][$i]['href']; ?>">
							<?php echo $category['children'][$i]['name']; ?></a>
					</li>
					<?php } ?>


					<?php } //for  i < $j ?>

					<?php } //for ($i = 0; $i < count ?>

				</ul>
				<?php } // if ($category['children']) #8 ?>
			</li>
			<?php } // foreach ($categories as $category) ?>
		</ul>
		<div>
			<?php } ?>

Да, 100% photoshop у тебя на Ubunte работать не будет, проверено временем, но для верстки тебе будет достаточно, вот видео с установкой релиза на Ubuntu https://www.youtube.com/watch?v=wjmQJckOATM

codepen.io/search/?depth=everything&limit=all&orde...

Не знаю сколько там занимает дизайн, а верстка+программирование подобного образца 10-14 дней. Вообще странно что вы попытались все навесить на одного. Дизайнеру свое, а фронтенду остальное. В студии ситуация выглядит так: дизайнер + верстальщик + программер (и тогда % разделил бы 40%/ 30%/ 30% в течении 14 дней)

Открыть Google, там информации по данному вопросу бери не хочу, есть даже видеоинструкция по установке Linux второй ОС (базис Windows)

Все возможно, если есть желание и цель + интернет. Учишь по 4-6 часов в день HTML/CSS, далее принимайся за js. Ну а дальше все что понадобится фронт-энду в повседневной работе.
Это и препроцессоры, и таск-менеджеры и взаимодействие библиотек и фреймворков. Ну и напоследок, конечно же понадобится практика в конторе, без нее никак не закрепить и не обкатать выученный материал.

Есть направление frontend, а есть backend. И объединять их, или учить и то и другое: не имеет никакого смысла, потому как будешь знать чуток там, а чуток там. Ты или здесь, или по ту сторону баррикад. И не важно фриланс это или офис.

Adobe Photoshop 6 бери и пользуйся

Совет дам такой: побольше практики, но не просто тупого кода, а ищи грамотный, смотри на youtube там очень много каналов по верстке (sorax, looftblog, master-css, webdesign master, magisters, psd to html и т.д.) Смотри, повторяй каждый день и результат будет. Макеты выбирай попроще, наловчишься, тогда уже бери сложнее. Вообще зайди и зарегистрируйся на https://htmlacademy.ru, получай ежемесячно 3 классных макета на проверку знаний и верстай себе. И еще пока не знаешь базиса зачем тебе sass? Твоя структура файлов должна сейчас выглядеть так: папки css и img и индексный файл index.html, со временем подключишь папку js, когда выучишь javascript. И лишь тогда компиляция, препроцессоры и менеджеры сборок.

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

В том же сборщике gulp есть плагины для сжима и оптимизации изображений: imagemin, imagemin-pngquant. Просто и никакой магии.