xmoonlight

1. Составить словарь (один-ко-многим): бренд -> товары бренда
2. Через нечёткий поиск (поиск подстроки с произвольным окончанием) находим нужную строку и правая часть будет модификацией товара.
3. Задаём нужный порядок 3-х частей: бренд, товар бренда, модификация.

PS: Советую подобные вещи формировать динамически на основе данных из БД из разных колонок, чтобы больше с этим не сталкиваться...

Я пользуюсь рабочим и хорошо зарекомендовавшим планом действий:

1. Выучите основные принципы грамматики - здесь.
   
2. Всегда переводите каждое незнакомое предложение по словосочетаниям через любой переводчик, если смысл теряется - переводите слова отдельно, чтобы корректно перевести.
   
3. Переведите пару-тройку документаций API с английского на русский (перевода которых ещё нет на русском, но имеющие большую популярность и комьюнити).
   Очень важно: сделать это максимально корректно и литературно.
   Так, чтобы это было всем понятно без чтения исходного английского текста (для сверки верной трактовки перевода).
   

HR - лишь подбирает кандидатуры присланных резюме по ряду критериев.
Принимает решение - руководитель отдела, а он даёт задачу оценки резюме своим подчинённым/специалистам. А уже они смотрят на код и сообщают свой вердикт потенциала соискателя своему руководителю, а уже он - говорит HR-у: подходит/не подходит человек.

1. Цель: показать свои навыки использования инструмента кодирования логики (ЯП).
2. ЦА: Кодеры-коллеги и тимлиды.
3. Содержание: при запуске проекта, его код должен корректно работать и за максимально короткое время решать поставленную задачу конечным образом (без явных упущений и возможных доработок кода), быть правильно структурированным и хорошо документированным.

Портфолио (аккаунт) на github.com - будет лучшим вариантом!

CREATE TABLE `category` (
  `id` int(10) UNSIGNED NOT NULL AUTO_INCREMENT,
  `parent_id` int(10) UNSIGNED NOT NULL,
  `path_id` int(10) UNSIGNED NOT NULL,
  `related` JSON,
  `name` varchar(255) NOT NULL,
  `status` tinyint(1) NOT NULL,
  PRIMARY KEY (`id`),
  INDEX (`parent_id`)
);

Создаём отдельную таблицу category_path:
id | {path:[CATEGORY-ID-LEVEL-1, CATEGORY-ID-LEVEL-2, ...., CATEGORY-ID-PARENT, CATEGORY-ID-CURRENT]}

Сохраняем связанные/похожие категории (их ID) по-необходимости:
{related:[CATEGORY-ID-X, CATEGORY-ID-Y, ..., CATEGORY-ID-N]}

Это поможет за один-два запроса по ID:
1. Выводить "хлебные крошки"/breadcrumbs
2. Получить глубину вложенности категории за один запрос по ID
3. Выводить иерархию только до текущей категории (без "погружения" в нераскрытые ветки, что значительно будет экономить CPU сервера).
4. Сделать выборку похожих категорий для дальнейшего поиска и вывода похожих предложений.
5. Получить ID для всех подкатегорий (и, как следствие, их количество) ниже любого узла для подсчёта кол-ва предложений в нужной ветке (включая похожие категории, по-необходимости).

Вёрстка вёрстке - рознь!
Чтобы иметь возможность получать хорошие заказы при большой конкуренции, нужно иметь 4-5 валидно свёрстанных и действующих/"живых" шаблонов для разных типов сайтов с достаточно сложными элементами наполнения.
Верстать - могут все, верстать качественно - единицы!
Хотите верстать профессионально и за достойную оплату - изучайте и нарабатывайте опыт.
PS: Проверять можно по этому списку.

Ответ в лоб: всё дело в заинтересованности и ответственности (циферки в договоре).

Начните чтение с вики

ЯП и веб-разработка не имеют ничего общего между собой.
ЯП - это инструмент, реализующий логику работы алгоритма через написание кода.
Веб-разработка - это применение различных наборов веб-технологий (общепринятых правил для обмена информацией в интернете), позволяющих выносить логику работы алгоритма в сеть для возможности удалённой работы с сетевым приложением, запущенном на удалённом устройстве (например, на веб-сервере).

Ничто не мешает разрабатывать интернет-сервис на том языке программирования, который Вы уже знаете. Если хотите влиться в общий поток - учите PHP.
В плане корректного отображения в браузерах на клиентских устройствах, необходимо будет изучить гипертекстовую разметку (HTML5), создание каскадных таблиц стилей (CSS) и javascript (для обработки событий DOM-структуры веб-приложения браузером).

Советую так составить документацию:
1. Создайте "чистый" пустой("белый лист") шаблон-заготовку (без сторонних библиотек и с возможностью скачать его в архиве) и кратко опишите структуру шаблона (включая разметку сетки и её поведение по-умолчанию при различных разрешениях).
2. Опишите формат секции(-й) для подключения сторонних библиотек и их самих: для чего они нужны и в каких случаях их необходимо применять. (можно добавить подключение всех и закоментировать в "чистом" шаблоне-заготовке и выложить в доп.архиве)
3. Создайте каталог всех элементов шаблона: слева - сам объект, справа - исходный код.
4. Отдельно опишите основные, наиболее часто используемые стили и их доп.модификаторы.

1. Я бы взял свой лисапед includeHTML, предварительно создав разные типы блоков в формате HTML и их настраиваемые свойства в базе данных.
2. Затем загружал бы на front и после внесения изменений пользователем, полностью выгружал бы DOM-структуру в шаблон и/или сохранял бы в базе: id шаблона, всю иерархию блоков и настройки каждого блока.

For Windows ONLY!
Советую Folder Guard.
Read-Only:
1. На все файлы в домашних директориях, кроме процесса openserver и file-manager'a (которым работаете для редактирования кода и т.д.).
2. На папки доверенных приложений (openserver и file manager) для любого исполняемого кода - расширения *.exe,*.dll,*.bat,*.cmd, *.scr и т.д.

Процентов 95%, что там 302 редиректы в роутере из-за закрывающего слеша или его отсутствия в индексе поисковой системы.