Видео этого урока скоро появится
Конспект урока доступен ниже
Финал: сайт-портфолио от идеи до публикации
Соберёшь личный сайт-портфолио целиком: структура, дизайн, адаптация под телефон. Применишь всё из курса: чат, точечные правки, агента и откаты. Опубликуешь результат в интернете и получишь ссылку, которую можно вставить в резюме.
Конспект урока
- 1
Сначала тексты и работы
Собери тексты и картинки до вёрстки: кто ты, что умеешь, три-четыре работы, контакты. Дизайн под готовое содержание собирается вдвое быстрее.
- 2
Каркас одной задачей агенту
Одним заданием попроси скелет всех разделов с навигацией, без украшений. Дальше доводи каждый блок отдельными запросами.
- 3
Собираем дизайн итерациями
Задай палитру, шрифтовую пару и шаг отступов одним сообщением, чтобы стиль был единым. Мелкие правки после этого делай через Cmd+K.
- 4
Проверка на телефоне
Открой F12 и включи режим устройства. Смотри меню, размер кнопок под палец, длинные заголовки и картинки, вылезающие за экран.
- 5
Мелочи, которые видят все
Заголовок вкладки, favicon, описание для соцсетей, кликабельная почта, работающие ссылки на работы. Их отсутствие читается как небрежность.
- 6
Публикация и проверка ссылки
Выложи сайт на бесплатный хостинг статики и открой адрес с чужого устройства. Ссылка, которая не открывается у другого человека, портфолио не является.
Практика
Собери портфолио и опубликуй его, затем открой ссылку на телефоне и пройди по всем разделам. Исправь три самые заметные проблемы мобильной версии.
Сделал? Отметь урок пройденным и переходи дальше