Эти 5 игр научат вас, как создать веб-сайт

Эти 5 игр научат вас, как создать веб-сайт0

Составьте краткое изложение этой истории. Вот краткое изложение содержания истории, основанное на фактах: Вот упрощенная версия содержания истории: Вот беззаботный взгляд на содержание истории: Исследуйте другую точку зрения: Покажите мне факты Объясните это так, будто мне 5 лет Дайте мне беззаботный пересказ

Создание веб-сайта с нуля может быть полезным. Однако, поначалу изучение его создания может показаться сложным. Вам необходимо знать HTML, CSS и JavaScript. Вам также следует иметь некоторые знания в области дизайна интерфейсов, чтобы упростить навигацию по вашему сайту.

Многие полагают, что для освоения этих навыков потребуется обширное чтение кода, просмотр технических руководств на YouTube или прохождение курсов по каждому предмету. Все эти методы обучения эффективны, но многие люди, включая меня, считают, что ими трудно заниматься. Это связано с отсутствием практической практики с этими методами.

Что приводит меня к предложению уникального способа обучения, который может сделать его более интерактивным, «игровым» предметом. Игра в игры для практики различных предметов, таких как дизайн и программирование, может помочь с запоминанием. Это также может повысить готовность, когда вы применяете свои знания в реальных сценариях. Вот почему я изучаю пять игр, которые могут помочь вам получить знания о навыках, необходимых для создания веб-сайтов.

5 Отправляйтесь навстречу приключениям вместе с Codedex!

Эти 5 игр научат вас, как создать веб-сайт1

Одной из первых вещей, которую вам нужно будет изучить для создания веб-сайтов, является язык программирования HTML, что означает «язык гипертекстовой разметки». Этот язык формирует способ, которым текст, изображения и другие медиа-данные размещаются в цифровом виде. HTML обычно лучше всего представляется с помощью кода CSS и JavaScript, о котором я расскажу далее в этой статье.

Хотя Codedex охватывает множество языков, это один из немногих ресурсов, который обучает программированию HTML в игровой форме. В этой программе вы будете играть в различные игры, называемые «квестами» для получения опыта. В квестах вам нужно написать код в скрипте в центре экрана, с аннотацией, описывающей концепцию упражнения слева от кода. Справа находится терминал, который будет отображать результат квеста, который является выводом написанного вами кода. С каждым успешно выполненным квестом тем больше опыта вы получите, который можно использовать для разблокировки более сложных квестов более сложных концепций HTML.

Я нашел макет этой игры привлекательным, так как три элемента «объяснение», «сценарий» и «вывод» находятся на одном экране. Мне также нравится непринужденный подход к обучению, так как вы можете получать EXP в своем собственном темпе без каких-либо «наказаний», которые даются вашему персонажу за неправильное написание кода. Эта снисходительная природа в некоторой степени придает Codedex ощущение «уюта», так как вы можете не торопясь изучать предметы в нем.

4 Designercize предлагает вам увлекательные дизайнерские задачи

Эти 5 игр научат вас, как создать веб-сайт2

«Дизайн» — один из самых важных моментов при создании веб-сайта. Каждый популярный веб-сайт имеет свой собственный уникальный облик. Например, в Google легко найти информацию в поисковой системе по базовому текстовому макету результатов, где заголовки больше, чем текст описания записей. То, как вы проектируете то, что видят ваши пользователи, имеет наибольшее значение, когда вы хотите, чтобы больше пользователей оставались на вашем сайте.

Designercize — это не онлайн-игра, с которой вы взаимодействуете, как с другими записями в этом списке; однако она разработана как шаблон для создания игр/практических упражнений. Сайт генерирует задачи, которые следуют спецификациям, таким как сложность и время, чтобы побудить вас разрабатывать веб-страницы по определенным темам, чтобы помочь различным демографическим группам. Записи «design», «for» и «to help» генерируются случайным образом, что делает менее предсказуемым то, что вы получите дальше.

Простой дизайн Designercize можно применять во многих ситуациях. Это может быть самостоятельная практика собственных навыков, соревнование между друзьями или даже соревнование для потенциальных кандидатов на найм. Открытый характер его использования заставляет меня настоятельно рекомендовать это приложение как новичкам, так и экспертам в области веб-дизайна.

3 Узнайте, как не следует разрабатывать веб-сайт с помощью User Inyerface

Эти 5 игр научат вас, как создать веб-сайт3

Пользовательский интерфейс (UI) сложен, но кажется обманчиво простым. UI — это дизайн того, как пользователи взаимодействуют с приложением. Где нажимать, на что смотреть, как перемещаются вещи и многие другие вопросы, основанные на действиях, рассматриваются в этой области. По моему мнению, это самая сложная вещь для изучения в веб-разработке из-за того, насколько непредсказуемыми могут быть пользователи.

Несмотря на непредсказуемость, есть несколько вещей, которых следует избегать в дизайне пользовательского интерфейса, которые могут раздражать пользователей. Многие примеры таких элементов показаны в игре User Inyerface. Этот цифровой эксперимент на первый взгляд кажется сломанным, но по мере навигации по сайту вы поймете, что его «баги» заложены в дизайне. Кнопки, которые ничего не делают, случайные всплывающие окна, которые уводят вас от выполняемой задачи, и раскрывающиеся меню с ужасной навигацией — вот лишь несколько примеров проблем, которые ставит перед вами сайт.

Как бы мне ни было больно от этого сайта, я настоятельно рекомендую посетить его хотя бы один раз, чтобы понять, что делать при разработке пользовательского интерфейса вашего сайта. То, что вы изо всех сил пытаетесь сделать в этой игре, следует помнить, когда вы внедряете аналогичные функции на свои собственные веб-сайты. Через разочарование, User Inyerface учит вас, почему наличие функционального пользовательского интерфейса сделает ваш веб-сайт более приятным для пользователей.

2. Сформулируйте свое владение JavaScript с помощью Elevator Saga

Эти 5 игр научат вас, как создать веб-сайт4

Возвращаясь к языкам программирования, используемым в веб-разработке, давайте поговорим о том, что такое JavaScript (JS). JS используется для разработки поведения динамического контента на веб-сайтах, такого как движущийся текст, видео и т. д. Из-за своего сложного синтаксиса и объема информации, которую необходимо знать без помощи Интернета, этот язык считается самым сложным для изучения из трех языков веб-разработки.

Задача «геймифицировать» этот сложный для изучения язык была взята на себя разработчиками Elevator Saga. Их игра предлагает вам найти решения вопросов, которые следуют общей структуре: «Перевезти X человек за X секунд или меньше» в визуальной симуляции лифта. Единственный способ решить эти вопросы — написать код JS. Для этого требуются некоторые знания синтаксиса. Однако не бойтесь, так как игра предоставляет вам базовый код программы и API, который предоставляет полезные команды для использования.

Что мне больше всего нравится в Elevator Saga, так это сообщество, которое сформировалось для нее. На форумах игры другие пользователи делятся своими решениями вопросов и пытаются найти наиболее эффективный способ завершения своих подсказок. Я обнаружил, что мне больше нравится видеть, что другие смогли открыть в этой игре, чем программировать собственные решения.

Эти 5 игр научат вас, как создать веб-сайт5

1. Создайте историю с помощью кода в Coding Fantasy

Эти 5 игр научат вас, как создать веб-сайт6

В завершение этой статьи я хотел бы рассмотреть CSS, что означает «Каскадные таблицы стилей». CSS используется для стилизации внешнего вида HTML-кода на веб-страницах. Это позволяет вам сделать их более аккуратными и настроить внешний вид текста на веб-страницах. Его легко изучить, и он считается краеугольным камнем развития Всемирной паутины.

Чтобы помочь изучить CSS, я настоятельно рекомендую некоторые приключенческие игры от Coding Fantasy. В их ролевых играх (RPG) вы пишете CSS-код, чтобы перемещать свою группу по карте плиток и атаковать врагов. В Flex Box Adventure вы играете за короля Артура, который сражается с тремя злыми братьями. В то время как в их другой CSS-игре, Grid Attack, вы отправляетесь на благородный квест, чтобы спасти мир. В обеих играх вы используете «силы CSS Grid», чтобы побеждать врагов и выполнять миссии.

Эти милые приключенческие игры — увлекательный способ изучить CSS через жанр RPG. Его простой подход исходит из целевой аудитории сайта, состоящей из молодых учеников, но я считаю, что в Coding Fantasy могут играть и люди постарше, желающие узнать, как разрабатывать веб-сайты в ностальгическом ключе.

Создание веб-сайтов очень полезно для личного и профессионального роста. Однако развитие этих навыков может быть сложным, особенно для тех, у кого нет опыта программирования. Но, надеюсь, эти пять игр сделают процесс обучения проще и интереснее!

Валентин Павлов/ автор статьи
Страсть Влентина к играм началась с Resident Evil, и с тех пор он не переставал играть в хоррор-игры. Пишет экспертные руководства для самых сложных игр и обзоры для самых громких релизов. Является магистром журналистики и имеет степень бакалавра лингвистики. Любимые игры: GTA 5, Silent Hill 2, Call of Duty: Modern Warfare 2, Heavy Rain, Metro 2033 и другие.
Понравилась статья? Поделиться с друзьями:
Добавить комментарий