Всегда интересно, когда ты впервые пытаешься освоить новый навык. Особенно кодирование.
Однако, если у вас нет практики, вы забываете большую часть того, что узнали. Поэтому в какой-то момент вы понимаете, что вам нужно практиковать то, что вы узнали. Иначе вы все это забудете.
Вот тут-то и нужны проекты. Проекты - это хороший способ применить на практике то, что вы узнали. И поверьте, вы хотите поработать над некоторыми проектами. Вы можете использовать проекты, чтобы продемонстрировать, над чем вы работали.
Для новичка выбор проектов, соответствующих вашему текущему уровню знаний, может быть сложной задачей. Вы можете выбрать проект. Тогда проект становится слишком большим, чтобы его можно было реализовать с использованием ваших нынешних ноу-хау. По крайней мере, это то, через что я прошел в этом познавательном путешествии.
Я курировал несколько проектов, которые, как я считаю, подходят, даже если ваши знания ограничиваются только HTML и CSS. Эти проекты доступны на популярных обучающих веб-сайтах, где вы найдете дополнительную информацию о том, чем вы будете заниматься.
7 проектов, которые стоит попробовать, даже если вы просто знаете HTML и CSS
Напишите дань уважения тому, кем вы восхищаетесь, и опубликуйте на веб-странице. Этот проект будет включать работу с добавлением изображений, ссылок, списков и абзацев. Для создания этого проекта потребуется знание HTML. Однако вы можете использовать немного CSS, чтобы проект выглядел лучше.
Формы полезны при сборе данных в Интернете. Этот проект будет в основном проверять ваши навыки на всевозможных материалах. Это проверит ваши знания форм и структуры вашей веб-страницы. Форма не требуется для отправки каких-либо данных.
Это наращивание со страницы дани. Для создания этого проекта потребуется знание html / html5.
3. Создайте целевую страницу продукта
Это проверит ваши знания как HTML, так и CSS. Вам потребуется попрактиковаться в создании столбцов и выравнивании элементов внутри столбцов. Вам также потребуется выполнить базовое редактирование изображений, например. обрезка и изменение размера для создания идеальных изображений для вашей веб-страницы.
Вам потребуются глубокие знания HTML / CSS.
4. Создайте страницу технической документации
Для этого потребуются некоторые знания HTML, CSS и начальной загрузки или JavaScript. Основная идея такова: когда вы нажимаете на любую тему слева, она загружает этот контент справа.
В настоящее время я пытаюсь реализовать этот проект, и я опубликую последний проект, как только он будет завершен.
5. Создайте веб-страницу личного портфолио
Вы будете практиковать все навыки, которые вы узнали в HTML и CSS. Вам также необходимо знать, как обрезать изображения и изменять их размер. Если у вас нет вариантов, используйте GIMP. Он бесплатный, с открытым исходным кодом и доступен для Windows и Linux.
Если вы спешите сделать портфолио, вы можете прочитать статью Брайана о создании онлайн-портфолио с использованием готовой темы / шаблона.
Да, вы видели это много раз. Но можете ли вы это воспроизвести. Простая страница google.com со значками, логотипом Google, текстовым полем и двумя кнопками. Вы можете сделать страницу google.com похожей. В этом проекте вы делаете вид, будто google.com не работает как google.com.
Вам нужно знать как HTML, так и CSS.
7. Страница результатов поиска google.com
Вы создадите страницу с форматом результата поиска Google. Ваша страница должна иметь обычные 10 результатов и переход к следующим страницам внизу.
Это обновление базовой страницы google.com выше. Однако вы сможете повторно использовать часть кода в этом проекте.
Кроме того, сделайте так, чтобы страница выглядела немного, но функциональность не должна быть проблемой прямо сейчас.
Заключение
Если вы хотите изучить основы HTML, вы можете ознакомиться с моим кратким вводным уроком по HTML.
Вы сделали базовый проект, когда изучали HTML и CSS? Если вы все же поделитесь ими ниже и помогли другим учащимся найти «простые», но сложные идеи, которые стоит попробовать.
