Осваиваю фронт-энд. Изучать какой-то курс мне скучно. Поэтому решил привязать изучение к прикладной задачке. Например сделать страницу о себе.
Зачем и для кого делаю?
- Для себя. Пробую сделать своими руками и разобраться в верстке
- Для клиентов. Не нужно кидать 33 ссылки на работы. Хочется собрать все в одном месте
Что хочу видеть на сайте
1. Фото. Люди любят людей
2. Описание себя и задач. Краткое, емкое и приземленное
3. Ссылки на контакты. Чтобы быстрее связаться и задать вопрос
4. Портфолио. Посмотреть, что уже было сделано и какие результаты получены.
Понятно, что показать все выше можно разными способами и вариантами. Мне главное, сделать это максимально просто и самому.
Внутренний критик: а чего не использовать конструкторы?
Да, я думал о них, но понимаю что это было бы:
- Неинтересно. Собрать на конструкторе можно что угодно и за 5 минут
- Моя цель — понять, нравится ли мне фронт-энд. А для этого нужно начать делать своими руками.
Делать все с нуля без свежей практики сложно. Поэтому я возьму готовые примеры из статей КОДа и попробую адаптировать их под себя:
- Как сделать страницу о себе))
- Как сделать страницу под разные экраны
Первая версия главной
Главная с ПК вышла странной :-) Весь контент сместился к левой стороне. Но самое главное — что все ссылки и моменты из начальных задач работают: переходы на блог, контакты, написать письмо и статьи из портфолио.
Главный косяк на мобильной версии — дрыганье страницы из стороны в сторону
С телефона все выглядит аккуратнее. Но и тут не без косяков — страница не должна кататься будто ячейка в таблице. В остальном я доволен.
Планы на следующую версию
1. Исправить верстку. Убрать «катания» страницы
2. Добавить карточки или фото кейсов. Есть классные примеры — Ира Усиченко, Максим Ильяхов, Женя Лепехин
3. Сделать рассылку и добавить блок с подпиской