В данной проектной работе был создан одностраничный сайт, помогающий студентам найти способы и подходы для более эффективного обучения.
Сайт разбит на независимые блоки согласно методологии БЭМ, что позволяет использовать код повторно в любом другом месте, не переписывая его:
- Блок header, там даже есть анимация.
- В блоках description и oakley представлены небольшие, но интересные статьи.
- В techniaues есть несколько полезных техник для обучения, я пользуюсь последней из них.
- Video для прокрастиниции заказывали?
- Feynman рекомендует не забывать выученное.
- Если Вы любите статистику и цифры, блок digits специально для Вас.
- Если Вам этого мало, в блоке khan есть ссылка на книгу "Весь мир - школа". Джордж Лукас рекомендует.
- В блоке kaufman можно найти 10 принципов обучения от Джоша Кауфмана.
- Блок resourses подскажет, где найти лайфхаки и прочие полезности для обучения. N+1 меня как Википедия, зашел на одну страницу, а в итоге читаешь о том, как Генетики научили клетки растений выполнять логические операции.
- Footer. Без него никуда.
Для создания этой страницы были использованы следующие инструменты:
- Флексбокс - с его помощью можно гибко управлять элементами во флекс-контейнере.
- Позиционирование - дает возможность управлять взаимным расположением элементов в потоке.
- Псевдоклассы - благодаря ним можно изменять стили элементов, реагируя на действия пользователя.
- iframe, в который можно поместить видео с YouTube или других источников.
- Трансформации и плавные переходы - они изменяют стиль элементов плавно.
- Кейфреймы и анимации - для создания CSS-анимаций с помощью ключевых кадров.
В дальнейшем к этой странице планируется добавить форму обратной связи с помощью тегов
. Это необходимо для получения отзывов и комментариев к данному проекту для дальнейшего усовершенствования страницы.