Polytech-soft.com

ПК журнал
1 просмотров
Рейтинг статьи
1 звезда2 звезды3 звезды4 звезды5 звезд
Загрузка...

Создать тест на html

Создание учебного теста с ответами при помощи HTML и JavaScript

В статье описывается последовательное создание учебного теста. Если вы не хотите читать о программировании, то сразу переходите в раздел с инструкциями по изменению теста и его загрузки.

Создание простого теста

Развитие информационных технологий и дистанционного образования приводит к необходимости создания электронных учебных тестов. Многие учителя и преподаватели сталкиваются с проблемой создания учебных тестов. Главная сложность решения данной задачи в том, что при создании таких электронным материалов требуется знание HTML и jаvascript.

Как решить эту проблему. Учитель может воспользоваться онлайн конструктором тестов или же попытаться создать тест самостоятельно на основе использования шаблона. Именно второй вариант мы рассмотрим в данной статье.

Мы сформируем простой шаблон, который можно будет потом размножить на несколько файлов и каждый превратить в отдельный тест.

Допустим имеется несложный математический тест, состоящий из нескольких задач по математике:

Примеры нужно вывести на экран и дать ученику возможность ввести ответ, дальше сравнить ответ с правильным и показать ученику процент правильно выполненного задания.

Сначала создадим HTML код задач:

Напротив каждой задачи учебного теста мы подставили поле для ввода текста. Подробнее о различных полях в HTML читайте в статье по ссылке. В конце мы добавили кнопку, при нажатии на которую должна произойти проверка того, что набрал ученик в ответах текста.

Обратите внимание на идентификаторы “z_1”,”z_2” и “z_3”. Если вам нужно добавить задачу 4, то нужно просто скопировать последнюю строку с задачей, заменить условие и в поле идентификатора написать “z_4”.

В последней строке мы покажем результат выполнения заданий после проверки.

На следующем этапе нужно создать jаvascript код, который сравнит то, что набрал ученик с правильными ответами и подсчитает процент выполнения задач.

pr_otv_zadachi_1 = 55;
pr_otv_zadachi_2 = -9;
pr_otv_zadachi_3 = 85;

Первые три строки будут содержать правильные ответы. Четвертая и последующие задачи в тест добавляются путем копирования последней строки с ответом, подстановки числа 4 вместо 3 и указанием правильного ответа.

Теперь нужно узнать то, что ввел ученик в ответах. Для этого используем следующий код.

otv_uch_1 = document.getElementById(‘z_1’).value;
otv_uch_2 = document.getElementById(‘z_2’).value;
otv_uch_3 = document.getElementById(‘z_3’).value;

Четвертая задача будет означать новую строку с заменой цифр 3 на 4.

Далее нужно сравнить ответы ученика с правильными ответами. Если ответы будут совпадать, то за каждую задачу теста нужно добавить 1 балл.

ball = 0;
if(otv_uch_1 == pr_otv_zadachi_1) <
ball +=1;
>
if(otv_uch_2 == pr_otv_zadachi_2) <
ball +=1;
>
if(otv_uch_3 == pr_otv_zadachi_3) <
ball +=1;
>

Для добавления задачи 4 вам потребуется скопировать последние три строки и заменить цифры в них на 4.

Теперь нужно посчитать процент правильных ответов.

В этой строке мы указываем сколько всего задач в учебном тесте. Если вы добавили еще, то нужно исправить эту цифру.

procent_vip = ball/vsego_zadach * 100;

Затем нужно вывести ответ на экран.

Вот и все. Теперь объединим весь код в одну HTML страницу.

Тест из нескольких задач по математике

MnogoBlog

как создать сайт на wordpress, настроить и оптимизировать wordpress

Как создать тест или опрос на JavaScript

Здравствуйте, давайте создадим тест и опрос на html, который будет состоять из 3 вопросов и 6 ответов в каждом из них и обработаем их результаты с помощью javascript.

Для того чтобы узнать какой товар (услуга) пользуется наибольшим спросом на данный момент времени применяют различные опросы и тесты.
Как только вы сможете проанализировать результаты тестов и опросов – начинайте рекламировать ваш товар (услугу) – лучше всего для этого подойдет Яндекс.Директ – идеальная площадка для размещения рекламы на просторах Рунета. Ежедневно эту сеть посещает свыше 5 миллионов пользователей в России и других странах СНГ, поэтому частотность показов релевантных объявлений достаточно высокая. А для того чтобы ваша реклама была максимальна эффективна, то лучше всего обратиться по настройке Яндекс.Директа к профессионалам от Direct-UP – dircet-up.ru. Удачного вам бизнеса!

1. Создаем тест на JavaScript:

Тест будет состоять из 3 вопросов, вы можете установить правильный ответ в каждом из вопросов и в зависимости от набранных баллов перенаправить посетителя на разные страницы.

Читать еще:  Исправитель ошибок по русскому языку

Рассмотрим код первого вопроса:

Здесь правильный ответ помечен значением value2, все остальные имеют значение value1.

Теперь давайте посмотрим на простой оператор if, который мы используем в JavaScript, чтобы найти сколько же набрано правильных ответов в тесте:

В принципе, мы проверяем только значение value2 и в зависимости от его количества выставляем оценку.

После того, как мы узнали оценку, то можем перенаправить посетителя на разные странички, в зависимости от результата:

Например, перенаправить посетителя на страничку /ocenka2.html.

Вот готовый код файл index.html:


2. Создаем простой опрос на javaScript:

Рассмотрим код первого вопроса:

Затем мы повторяем этот шаблон для каждого вопроса.

Теперь давайте посмотрим на простой оператор if, который мы используем в JavaScript, чтобы найти ответ с наибольшим значением:

В принципе, мы проверяем, что сумма всех ответов со значением value1 выше суммы других возможных вариантов, а также что она выше 0.

Мы выполняем одинаковую проверку для каждого значения.

После того, как мы знаем, самое высокое значение, мы можем использовать этот результат, например, чтобы перенаправить посетителя на разные url:

Так если в большинстве вопросов был выбран ответ под цифрой 1, то result = value1 и соответственно посетитель попадет на страничку value1.html.

Создать тест на html

Ссылки
На странице содержатся ссылки на ресурсы, где можно найти разнообразные тесты программы для их обработки.

Пример1
Пример интерактивного теста по теме Электромагнитная индукция.

Итак, вы решили создать собственный интерактивный тест в виде Интернет страницы на основе шаблона. Шаблон содержит 6 вопросов к каждому из которых предлагается 4 варианта ответов. Как изменять количество вопросов в статье описано, изменение количества ответов не затрагивается. Вы должны уметь копировать, сохранять, переименовывать файлы. Копировать рисунки из документов, изменять их реальный размер и сохранять в виде файла (при условии, что вы будете использовать рисунки)
Необходимо понимать, что для изменения инетернет страницы необходимо открыть ее код (называют HTML код). В этот код внедрена программа, ее необходимо немного изменить только при условии, что вы изменяете количество вопросов. Эта задача доступна любому пользователю, но необходима аккуратность, пунктуальность, эта инструкция и конечно, ваша природная сообразительность. Приступим:

I – Подготовительный этап
1. Cохраните шаблон (Сохранить) и эту страницу на своем компьютере. ( Теперь можно выйти из сети, и запустить эту инструкцию в режиме автономного просмотра).
2. Подготовьте тест который будете превращать в электронный. Наверняка у вас уже имеется такой напечатанный в любом редакторе например в MS Word.
3. Создайте в удобном для вас месте папку и назовите ее как вам удобно (ФизТест10вар1 и т.п.)
4. Скопируйте в эту папку распакованный шаблон (zagotovka.html) и при необходимости рисунки к тесту. (Напоминаю, что формулы в MS Word являются рисунками.
5. Имена рисунков лучше задавать латинскими буквами и короткими именами например ris2-1.gif
6. Проверьте работоспособность шаблона, запустив его и разрешив заблокированное содержимое. На все вопросы поставьте первый ответ. Вы получите оценку отлично.

II Получаем тест из шести вопросов без рисунков.

1. Не закрывая этой страницы запустите (если закрыли) шаблон. В меню Internet Explorer в окне с шаблоном дайте команду Вид-Просмотр HTML-кода.
2. Откроется текст кода в программе Блокнот.
3. Измените текст этого кода (непосредственно Блокноте) в соответствии с образцом приведенном ниже. В образце, выделенный зеленым цветом текст показывает где именно необходимо изменять, (смысл надписей говорит сам за себя)
4. Найдите выделенный зеленым цветом текст «111111» он идет после команды var res=, и поставьте последовательность правильных ответов.
5. Коричневым цветом выделены комментарии к коду, они не влияют на работу и не отображаются на экране.
6. Сохраните в блокноте файл в подготовленную папку с рисунками выбрав при сохранении Тип файлов «Все Файлы» имя задайте любое (лучше латинскими буквами) и задайте расширение файла html (после имени файла поставьте точку и наберите html Например test1.html) Это необходимо чтобы шаблон zagotowka.html не изменился.
7. Проверьте на работоспособность ваш тест.

Читать еще:  Код ошибки номер 3

Текст в заголовке браузера

Автор » name=Author>

11 онлайн-сервисов для создания тестов

Продолжаем обзор полезных сервисов, которые могут пригодиться при ведении бизнеса. Мы с вами говорили о том, как создавать презентации, обрабатывать бесплатно видео или аудио, работать с текстом или изображениями. Но вот ни разу не обсуждали сервисы для создания тестов онлайн. А ведь если подключить фантазию, то их тоже можно использовать во многих проектах.

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

Во-вторых, тесты можно использовать при приёме на работу новых сотрудников. Наверняка слышали о таком.

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

А теперь собственно о сервисах, которые помогают создавать онлайн-тесты.

Радует, что есть из чего выбирать. И не только англоязычные сайты здесь в помощь, ведь без знания языка в них бывает сложно разобраться, да и расширенный функционал доступен только в платных тарифах. Мы расскажем и об отечественных сервисах, которые ничуть не хуже иностранных и почти всегда бесплатны.

iSpring

iSpring — решение для дистанционного обучения и тестирования сотрудников. Включает конструктор курсов и тестов, а также облачную систему дистанционного обучения. С iSpring у вас появится единый центр управления обучением, работающий 24/7. Сотрудники проходят курсы и тесты, а вы контролируете, как они учатся, растут профессионально и как результаты обучения влияют на бизнес-показатели компании.

Google Forms

Гугл-формы для создания опросов. Конечно, это не совсем онлайн-конструктор тестов, поэтому поговорим о нём отдельно. Если вы создавали опросы при помощи форм, то тут всё понятно: пишешь вопрос, предлагаешь варианты ответов и ждёшь результатов. Однако мало кто знает про бесплатный плагин Flubaroo, который автоматически проверяет ответы респондентов и выставляет оценки по заданным критериям.

Добавьте к привычным гугл-формам

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

Как работают конструкторы тестов?

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

При помощи конструктора тестов создаются разные типы вопросов и ответов:

  1. Выбрать один вариант ответа из нескольких предложенных;
  2. Выбрать несколько вариантов ответов из предложенных;
  3. Вписать недостающие слова в пробелы в тексте;
  4. Написать развернуто свой вариант ответа;
  5. Выбрать верное или ложное утверждение.

Вопросы можно оформлять, вставляя изображения, текстовые документы и даже видео. Чаще всего такая функция доступна в платных версиях, но и без картинок тесты смотрятся достойно.

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

Готовый тест легко встраивается на сайт. Если нет такой необходимости, то сгенерируйте ссылку от теста и поделитесь ею со своими знакомыми в соцсетях. Пригласите участников по электронной почте пройти тест непосредственно в сервисе. Выбирайте то, что нужно для достижения цели.

Англоязычные сервисы

Classmarker удобный конструктор, который поможет создать онлайн-тест за несколько минут как для 5 пользователей, так и для 5000, избавляя вас от рутинной многочасовой работы по подсчету результатов.

Читать еще:  Smtp 535 ошибка

Для образовательных целей сервисом можно пользоваться бесплатно, хотя функционал довольно ограниченный. Так что регистрируйтесь, отмечая на вкладке «Администраторы» (Administrators), «для использования в образовательных целях» (for education use).

Так вы получите бесплатный функционал

В бесплатном тарифе возможно создавать до 100 тестов ежемесячно, то есть 1200 тестов в год. Однако есть определённые лимиты: результаты тестирования не отправляются на электронную почту участникам, невозможно загрузить картинки или файлы при создании теста, вопросы не сохраняются в виртуальном хранилище, их придется вводить каждый раз при работе над новым тестом, недоступна подробная статистика по каждому участнику. Плюс сервис вставляет рекламные объявления в готовый тест. А как вы думали? 🙂

ProProfs подобный сервис, где тоже есть бесплатный тариф с ограниченным функционалом. Переходите на вкладку цены (Pricing) и викторины (Quiz).

EasyTestMaker — ещё один конструктор тестов, который позволяет не только создавать материалы для публикации на вашем сайте, но и выводит список вопросов в формате doc или pdf, готовый для скачивания. Может, кому-то будет интересна такая функция. В бесплатной версии установлен лимит на 25 тестов в год.

Отечественные варианты

Мастер-Тест — простой конструктор, который можно использовать в обучении, он бесплатен и не содержит рекламы. Чтобы создавать тесты, нужно зарегистрироваться как преподаватель. При желании готовый тест можно встроить у себя на сайте или пригласить участников пройти тестирование на сервисе, скинув им ссылку, например, такую.

Банк тестов — бесплатный сервис, где функция создания новых тестов становится доступной после регистрации. Материалы находятся на сайте banktestov.

Твой тест — ещё один бесплатный конструктор тестов. В принципе тут есть все, что нужно для проведения полноценного тестирования. Созданные тесты находятся на сайте, поэтому вы можете самостоятельно создать группу и добавить в неё всех тестируемых (например, участников курса) либо выслать им код и ссылку, по которой они найдут нужный материал.

Test.fromgomel — милый бесплатный сервис для создания тестов онлайн, который трансформирует тест в html, то есть код потом легко вставить на сайт. Это самый простой конструктор, который мы встретили. Зато без лишних заморочек: вводите вопрос и варианты ответов, жмёте кнопку и получаете код теста.

Let’s test — онлайн-конструктор тестов, который позволяет тестировать знания учащихся дистанционно. В бесплатной версии возможно создавать неограниченное количество тестов, но проходить их придётся внутри самого сервиса. Если же есть желание встроить тест к себе на сайт, то приобретайте базовый пакет за 990 рублей/месяц.

Вот так будет выглядеть встроенный виджет на сайте

Находкой стал сайт Online Test Pad, который позволяет создавать тесты, опросы, логические игры и даже кроссворды онлайн. И да, он бесплатный. Из большой коллекции тестов можно выбрать что-то по своей тематике или создать новый тест, а потом получить код для встройки на сайт.

На сайте есть подробная инструкция, а также видеоуроки, так что все обязательно получится!

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

Чтобы создать тест, зайдите на вкладку quiz и вперед

Как работать с Kahoot

Вписываете свои вопросы, добавляете изображения и предлагаете варианты ответов. Указываете, где правильный, а где неправильный вариант. Далее конструктор сгенерирует код — номер теста, — который необходимо использовать для входа в игру, если играть через стационарный компьютер. Если вы используете тест для проверки знаний аудитории, участники могут подключиться к тестированию через смартфоны. Вопрос они будут видеть на мониторе компьютера или ноутбука, а отвечать, используя свой гаджет.

Чтобы было понятно, как это работает, создайте свою учетную запись здесь, а теперь пройдите тест по маркетингу здесь, получив pin теста. Вам придётся использовать два окна браузера: одно для вопросов и вариантов ответов, второе, чтобы нажимать на кнопки. Либо использовать компьютер и смартфон (или другой гаджет).

Ссылка на основную публикацию
Adblock
detector