Тестовое задание верстальщику

Для выполнения задач тестовое пространство будет предоставлено. Запрашивайте индивидуально.

Задача 1: popup с формой

• Страница с белым фоном.
• На странице произвольным шрифтом который не предустановлен по умолчанию в ОС Windows (можно подключать любой шрифт Google) 888 раз написано словосочетание «test task #1 «. Словосочетание вывести в цикле через php.
• Перед текстом в произвольной форме размещены:
  1. Кнопка (button) с текстом «УТП 1»
  2. Ссылка «УТП 2»
  3. span «УТП 3»

клик по которым должен приводить к вызову popup-окна с формой. В форме должно быть скрытое поле, которое собирает информацию о том, по какому из элементов был совершен клик.

• Клик вне формы или по крестику закрытия окна формы должен приводить к закрытию формы.
• В форме должно быть 2 видимых поля (имя и телефон), а также чекбокс согласия с правилами конфиденциальности. Поле телефона и чекбокс должны быть обязательными для заполнения. При наличии решения по валидации/контроля заполненности следует прикрепить обычно используемое/рекомендуемое Вами решение.
• В конце страницы вставить текст «Все права защищены, 2019-2021», причем второе число должно подтягиваться автоматически (php date Y).

Задача 2: сборка страниц через include

• Создать 4 страницы которые должны отображаться по адресам (значком * помечаю что до адреса — путь к Вашему тестовому пространству):
  1. */
  2. */page/
  3. */thanks/
  4. */other/
• На каждой из 4х страниц вывести произвольный тематический уникальный заголовок Н1.
• Создать php файл с навигацией по страницам. Подключить этот файл с навигацией ко всем 4м страницам (php include) таким образом, чтобы навигация работала на всех 4х страницах корректно.

Задача 3: карточка товара (отверстать адаптивно)

в процессе.

Задача 4: одноэкранный адаптивный сайт

в процессе

Суть задачи: сверстать на первый взгляд простую страницу, так чтобы она была 100% в высоту на любом из используемых устройств.

Сложность: нужно учитывать особенность устройств на iOS и Android, в т.ч. поведение нижней/верхней панели управления браузера.

подложка андроид + iOS

Задача 5: pixel perfect

в процессе

Сверстать страницу pixel perfect. При сдаче работы указать, какую именно программу использовали.

Вариант (просто вариант, не рекомендация) — плагин для хрома: https://chrome.google.com/webstore/detail/perfectpixel-by-welldonec/dkaagdgjmgdmbnecmcefdhjekcoceebi