Рабочая учебная программа учебной практики по дисциплине «Web-программирование и Интернет технологии»



бет2/3
Дата27.11.2023
өлшемі45,86 Kb.
#193699
түріРабочая учебная программа
1   2   3
Байланысты:
РПр уч.практика 301
Konspekt-lektsij-po-distsipline -Osnovy-krosskul-turnogo-obshheniya, философия сессия, Педагогика, Kratkie.konspekty.lekcij..Teoreticheskii.osnovy.logopedii, Kratkie.konspekty.lekcij..Teoreticheskii.osnovy.logopedii, Дәріс 2. Арнайы мектепте қазақ тілін оқытудың принциптері, заңдылықтары, biologiya-pnnen-8-synypa-arnalan--tosan-zhiynty-baalau-tapsyrmalary, «География» п нінен 2-то сан а арнал ан жиынты ба алау тапсырма, 1 аралық бақылау сұрақтары (1), abzhanova sha et zhne et onimderinin tekhnologiiasy, аза стан Республикасыны экономикалы реформаларыны жа ыруы к, 50, 50, Методичка ТСП 1, Темы ДП ВЕБ

Разделы, темы



Результаты обучения

Критерии оценки

Всего часов

Тип
занятия


Структура HTML-документа

Основы HTML-разметки.
Знание о структуре HTML-документа, включая элементы , , , , и <meta>. <br /></td> <td width="175"> <br />Отчет по <a href="/metodicheskie-ukazaniya-k-prakticheskim-rabotam-v2.html">практическим работам </a><br /></td> <td width="137"> <br />2 <br /></td> <td width="117"> <br />Практический <br /></td> </tr> <tr valign="top"> <td width="22"> <ol start="2"> <li/> <br /></ol> </td> <td width="242"> <br />Гиперссылки и якоря <br /></td> <td width="156"> <br />Создание гиперссылок с использованием тега <a>. <br />Понимание разницы между абсолютными и относительными URL-адресами. <br />Использование якорей для прокрутки к определенным частям страницы. <br /></td> <td width="175"> <br />Отчет по практическим работам <br /></td> <td width="137"> <br />2 <br /></td> <td width="117"> <br />Практический <br /></td> </tr> <tr valign="top"> <td width="22"> <ol start="3"> <li/> <br /></ol> </td> <td width="242"> <br />Изображения:тег <img> <br /></td> <td width="156"> <br />Вставка изображений на <a href="/veb-proektirovanie.html">веб-страницу с помощью тега </a><img>. <br />Настройка атрибутов src, alt, width и height. <br /></td> <td width="175"> <br />Отчет по практическим работам <br /></td> <td width="137"> <br />2 <br /></td> <td width="117"> <br />Практический <br /></td> </tr> <tr valign="top"> <td width="22"> <ol start="4"> <li/> <br /></ol> </td> <td width="242"> <br />Таблицы <br /></td> <td width="156"> <br />Создание таблиц с использованием тегов <table>, <tr>, <td>, и <th>. <br />Объединение ячеек с помощью атрибутов rowspan и colspan. <br /></td> <td width="175"> <br />Отчет по практическим работам <br /></td> <td width="137"> <br />2 <br /></td> <td width="117"> <br />Практический <br /></td> </tr> <tr valign="top"> <td width="22"> <ol start="5"> <li/> <br /></ol> </td> <td width="242"> <br />Формы и элементы форм <br /></td> <td width="156"> <br />Создание форм с использованием тега <form>. <br />Добавление различных элементов форм, таких как поля ввода, кнопки и флажки. <br />Основы валидации форм. <br /></td> <td width="175"> <br />Отчет по практическим работам <br /></td> <td width="137"> <br />2 <br /></td> <td width="117"> <br />Практический <br /></td> </tr> <tr valign="top"> <td width="22"> <ol start="6"> <li/> <br /></ol> </td> <td width="242"> <br />Мультимедиа <br /></td> <td width="156"> <br />Вставка аудио и видео с помощью тегов <audio> и <video>. <br />Использование атрибутов controls и source. <br /></td> <td width="175"> <br />Отчет по практическим работам <br /></td> <td width="137"> <br />2 <br /></td> <td width="117"> <br />Практический <br /></td> </tr> <tr valign="top"> <td width="22"> <ol start="7"> <li/> <br /></ol> </td> <td width="242"> <br />Селекторы и свойства <br /></td> <td width="156"> <br />Основы CSS селекторов, включая классы, идентификаторы и элементы. <br />Применение стилей к элементам с использованием свойств, таких как color, background-color и font-family. <br /></td> <td width="175"> <br />Отчет по практическим работам <br /></td> <td width="137"> <br />2 <br /></td> <td width="117"> <br />Практический <br /></td> </tr> <tr valign="top"> <td width="22"> <ol start="8"> <li/> <br /></ol> </td> <td width="242"> <br />Цвет и фон <br /></td> <td width="156"> <br />Выбор цветов с использованием <a href="/zanyatie-6-preobrazovanie-formatov-ip-adresov-raschet-ip-adres.html">различных форматов</a>, включая имена цветов и RGB. <br />Настройка фона элементов с помощью свойства background. <br /></td> <td width="175"> <br />Отчет по практическим работам <br /></td> <td width="137"> <br />2 <br /></td> <td width="117"> <br />Практический <br /></td> </tr> <tr valign="top"> <td width="22"> <ol start="9"> <li/> <br /></ol> </td> <td width="242"> <br />Шрифты и текст <br /></td> <td width="156"> <br />Установка шрифтов и их размеров с использованием свойств font-family и font-size. <br />Выравнивание текста с помощью свойства text-align. <br /></td> <td width="175"> <br />Отчет по практическим работам <br /></td> <td width="137"> <br />2 <br /></td> <td width="117"> <br />Практический <br /></td> </tr> <tr valign="top"> <td width="22"> <ol start="10"> <li/> <br /></ol> </td> <td width="242"> <br />margin и padding <br /></td> <td width="156"> <br />Управление внешними и внутренними отступами элементов с помощью свойств margin и padding. <br /></td> <td width="175"> <br />Отчет по практическим работам <br /></td> <td width="137"> <br />2 <br /></td> <td width="117"> <br />Практический <br /></td> </tr> <tr valign="top"> <td width="22"> <ol start="11"> <li/> <br /></ol> </td> <td width="242"> <br />Рамки и границы <br /></td> <td width="156"> <br />Создание рамок вокруг элементов с использованием свойств border, border-width и border-color. <br /></td> <td width="175"> <br />Отчет по практическим работам <br /></td> <td width="137"> <br />2 <br /></td> <td width="117"> <br />Практический <br /></td> </tr> <tr valign="top"> <td width="22"> <ol start="12"> <li/> <br /></ol> </td> <td width="242"> <br />Позиционирование <a href="/referat-na-temu--himiya-p-elementov-i-ih-biologicheskoe-znache.html">элементов </a><br /></td> <td width="156"> <br />Понимание различных методов позиционирования, включая relative, <a href="/specialenij-inostrannij-yazik-v-sfere-yurisprudencii-acton-sai.html">absolute</a>, fixed и static. <br /></td> <td width="175"> <br />Отчет по практическим работам <br /></td> <td width="137"> <br />2 <br /></td> <td width="117"> <br />Практический <br /></td> </tr> <tr valign="top"> <td width="22"> <ol start="13"> <li/> <br /></ol> </td> <td width="242"> <br />Flexbox <br /></td> <td width="156"> <br />Использование Flexbox для создания гибких макетов. <br />Основы свойств display: flex, justify-content и align-items. <br /></td> <td width="175"> <br />Отчет по практическим работам <br /></td> <td width="137"> <br />2 <br /></td> <td width="117"> <br />Практический <br /></td> </tr> <tr valign="top"> <td width="22"> <ol start="14"> <li/> <br /></ol> </td> <td width="242"> <br />Grid Layout <br /></td> <td width="156"> <br />Создание сложных сеток с использованием Grid Layout. <br />Основы свойств display: grid, grid-template-columns и grid-template-rows. <br /></td> <td width="175"> <br />Отчет по практическим работам <br /></td> <td width="137"> <br />2 <br /></td> <td width="117"> <br />Практический <br /></td> </tr> <tr valign="top"> <td width="22"> <ol start="15"> <li/> <br /></ol> </td> <td width="242"> <br />Анимации и переходы <br /></td> <td width="156"> <br />Создание анимаций с использованием ключевых кадров и переходов между стилями. <br />Основы свойств animation и transition. <br /></td> <td width="175"> <br />Отчет по практическим работам <br /></td> <td width="137"> <br />2 <br /></td> <td width="117"> <br />Практический <br /></td> </tr> <tr valign="top"> <td width="22"> <ol start="16"> <li/> <br /></ol> </td> <td width="242"> <br />Псевдоэлементы и псевдоклассы <br /></td> <td width="156"> <br />Применение стилей к псевдоэлементам и элементам в разных состояниях с помощью псевдоклассов. <br /></td> <td width="175"> <br />Отчет по практическим работам <br /></td> <td width="137"> <br />2 <br /></td> <td width="117"> <br />Практический <br /></td> </tr> <tr valign="top"> <td width="22"> <ol start="17"> <li/> <br /></ol> </td> <td width="242"> <br />Стилизация <a href="/sozdanie-testa-sredstvami-form-google-cele.html">форм и кнопок </a><br /></td> <td width="156"> <br />Улучшение внешнего вида форм и кнопок с использованием CSS. <br /></td> <td width="175"> <br />Отчет по практическим работам <br /></td> <td width="137"> <br />2 <br /></td> <td width="117"> <br />Практический <br /></td> </tr> <tr valign="top"> <td width="22"> <ol start="18"> <li/> <br /></ol> </td> <td width="242"> <br />Медиазапросы и адаптивный дизайн <br /></td> <td width="156"> <br />Создание адаптивных дизайнов с использованием медиазапросов, чтобы страницы корректно отображались на разных устройствах и экранах. <br /></td> <td width="175"> <br />Отчет по практическим работам <br /></td> <td width="137"> <br />2 <br /></td> <td width="117"> <br />Практический <br /></td> </tr> <tr valign="top"> <td width="22"> <ol start="19"> <li/> <br /></ol> </td> <td width="242"> <br />Кроссбраузерная совместимость <br /></td> <td width="156"> <br />Понимание различий между веб-браузерами и как они обрабатывают HTML и CSS. <br />Тестирование и устранение ошибок совместимости для обеспечения корректного отображения в разных браузерах. <br /></td> <td width="175"> <br />Отчет по практическим работам <br /></td> <td width="137"> <br />2 <br /></td> <td width="117"> <br />Практический <br /></td> </tr> <tr valign="top"> <td width="22"> <ol start="20"> <li/> <br /></ol> </td> <td width="242"> <br />Работа на Figma <br /></td> <td width="156"> <br />Использование графических инструментов для создания макетов веб-страниц. <br />Экспорт графических ресурсов для использования в веб-разработке. <br /></td> <td width="175"> <br />Отчет по практическим работам <br /></td> <td width="137"> <br />2 <br /></td> <td width="117"> <br />Практический <br /></td> </tr> <tr valign="top"> <td width="22"> <ol start="21"> <li/> <br /></ol> </td> <td width="242"> <br />Работа с типографикой <br /></td> <td width="156"> <br />Выбор и настройка шрифтов для веб-страницы. <br />Определение размеров и интерлиньяжа текста для улучшения читаемости. <br /></td> <td width="175"> <br />Отчет по практическим работам <br /></td> <td width="137"> <br />2 <br /></td> <td width="117"> <br />Практический <br /></td> </tr> <tr valign="top"> <td width="22"> <ol start="22"> <li/> <br /></ol> </td> <td width="242"> <br />Работа с цветами <br /></td> <td width="156"> <br />Выбор палитры цветов для веб-дизайна. <br />Понимание цветовых моделей и использование цветов в CSS. <br /></td> <td width="175"> <br />Отчет по практическим работам <br /></td> <td width="137"> <br />2 <br /></td> <td width="117"> <br />Практический <br /></td> </tr> <tr valign="top"> <td width="22"> <ol start="23"> <li/> <br /></ol> </td> <td width="242"> <br />Работа с <a href="/svodnaya-kartoteka-periodicheskih-izdanij-vipisivaemih-bibliot.html">компонентами и библиотеками </a><br /></td> <td width="156"> <br />Интеграция готовых компонентов и библиотек (например, Bootstrap) в веб-проекты. <br />Создание собственных компонентов для повторного использования. <br /></td> <td width="175"> <br />Отчет по практическим работам <br /></td> <td width="137"> <br />2 <br /></td> <td width="117"> <br />Практический <br /></td> </tr> <tr valign="top"> <td width="22"> <ol start="24"> <li/> <br /></ol> </td> <td width="242"> <br />Принцип CSS-верстки. <br /></td> <td width="156"> <br />Освоение базовых принципов каскадных таблиц стилей (CSS) и их применение к HTML-разметке. <br /></td> <td width="175"> <br />Отчет по практическим работам <br /></td> <td width="137"> <br />2 <br /></td> <td width="117"> <br />Практический <br /></td> </tr> <tr valign="top"> <td width="22"> <ol start="25"> <li/> <br /></ol> </td> <td width="242"> <br />Макеты на основе обтекаемых элементов. Использование обтекаемых элементов при верстке. <br /></td> <td width="156"> <br />Создание макетов, включая элементы, которые обтекают другие элементы на странице. <br />Использование свойства float и clear для создания обтекаемых элементов. <br /></td> <td width="175"> <br />Отчет по практическим работам <br /></td> <td width="137"> <br />2 <br /></td> <td width="117"> <br />Практический <br /></td> </tr> <tr valign="top"> <td width="22"> <ol start="26"> <li/> <br /></ol> </td> <td width="242"> <br />Решение проблем с обтекаемыми элементами. <br /></td> <td width="156"> <br />Идентификация и устранение проблем с обтекаемыми элементами, такими как схлопывание контейнера и перекрытия. <br /></td> <td width="175"> <br />Отчет по практическим работам <br /></td> <td width="137"> <br />2 <br /></td> <td width="117"> <br />Практический <br /></td> </tr> <tr valign="top"> <td width="22"> <ol start="27"> <li/> <br /></ol> </td> <td width="242"> <br />Позиционирование элементов на странице. <br /></td> <td width="156"> <br />Ознакомление с различными методами позиционирования, включая relative, absolute, fixed, static, sticky. <br />Применение этих методов для точного размещения элементов на странице. <br /></td> <td width="175"> <br />Отчет по практическим работам <br /></td> <td width="137"> <br />2 <br /></td> <td width="117"> <br />Практический <br /></td> </tr> <tr valign="top"> <td width="22"> <ol start="28"> <li/> <br /></ol> </td> <td width="242"> <br />Принципы работы свойств позиционирования. Эффективные стратегии позиционирования. <br /></td> <td width="156"> <br />Понимание концепции адаптивного дизайна и его важности для различных устройств и размеров экранов. <br />Создание адаптивных макетов и резиновых дизайнов. <br /></td> <td width="175"> <br />Отчет по практическим работам <br /></td> <td width="137"> <br />2 <br /></td> <td width="117"> <br />Практический <br /></td> </tr> <tr valign="top"> <td width="22"> <ol start="29"> <li/> <br /></ol> </td> <td width="242"> <br />Адаптивный веб-дизайн. Основы адаптивного веб-дизайна. <br /></td> <td width="156"> <br />Использование медиазапросов в CSS для настройки стилей в зависимости от разрешения экрана. <br />Разработка медиазапросов для адаптивной верстки. <br /></td> <td width="175"> <br />Отчет по практическим работам <br /></td> <td width="137"> <br />2 <br /></td> <td width="117"> <br />Практический <br /></td> </tr> <tr valign="top"> <td width="22"> <ol start="30"> <li/> <br /></ol> </td> <td width="242"> <br />Создание адаптивного дизайна веб-страницы. <br /></td> <td width="156"> <br />Понимание концепции адаптивного дизайна и его важности для различных устройств и экранов. <br />Использование медиазапросов для настройки стилей и макета в зависимости от размера экрана. <br /></td> <td width="175"> <br />Отчет по практическим работам <br /></td> <td width="137"> <br />2 <br /></td> <td width="117"> <br />Практический <br /></td> </tr> <tr valign="top"> <td width="22"> <ol start="31"> <li/> <br /></ol> </td> <td width="242"> <br />Медиазапросы. <br /></td> <td width="156"> <br />Создание медиазапросов с использованием CSS для адаптивной верстки. <br />Настройка стилей и компонентов на разных устройствах, таких как смартфоны, планшеты и настольные компьютеры. <br /></td> <td width="175"> <br />Отчет по практическим работам <br /></td> <td width="137"> <br />2 <br /></td> <td width="117"> <br />Практический <br /></td> </tr> <tr valign="top"> <td width="22"> <ol start="32"> <li/> <br /></ol> </td> <td width="242"> <br />Гибкие сетки. Гибкие изображения. <br /></td> <td width="156"> <br />Освоение принципов гибких сеток для создания адаптивных макетов. <br />Использование процентных и относительных единиц измерения для размеров контейнеров и элементов. <br /></td> <td width="175"> <br />Отчет по практическим работам <br /></td> <td width="137"> <br />2 <br /></td> <td width="117"> <br />Практический <br /></td> </tr> <tr valign="top"> <td width="22"> <ol start="33"> <li/> <br /></ol> </td> <td width="242"> <br />Профессиональная flexbox-верстка. Знакомство с <a href="/laboratornaya-rabota-2-testirovanie-metodom-chernogo-yashika-c.html">методом flexbox-верстки </a><br /></td> <td width="156"> <br />Настройка изображений так, чтобы они масштабировались и адаптировались к разным экранам. <br />Использование атрибута max-width для предотвращения искажения изображений. <br /></td> <td width="175"> <br />Отчет по практическим работам <br /></td> <td width="137"> <br />2 <br /></td> <td width="117"> <br />Практический <br /></td> </tr> <tr valign="top"> <td width="22"> <ol start="34"> <li/> <br /></ol> </td> <td width="242"> <br />Свойства flex-контейнера. Свойства flex-элементов. <br /></td> <td width="156"> <br />Знакомство с методом flexbox-верстки, который обеспечивает гибкое позиционирование элементов. <br />Изучение свойств flex-контейнера и flex-элементов. <br /></td> <td width="175"> <br />Отчет по практическим работам <br /></td> <td width="137"> <br />2 <br /></td> <td width="117"> <br />Практический <br /></td> </tr> <tr valign="top"> <td width="22"> <ol start="35"> <li/> <br /></ol> </td> <td width="242"> <br />Создать интернет-магазин. Часть 1 <br /></td> <td width="156"> <br />Применение знаний по адаптивному дизайну и flexbox-верстке для создания веб-страниц интернет-магазина. <br /></td> <td width="175"> <br />Отчет по практическим работам <br /></td> <td width="137"> <br />2 <br /></td> <td width="117"> <br />Практический <br /></td> </tr> <tr valign="top"> <td width="22"> <ol start="36"> <li/> <br /></ol> </td> <td width="242"> <br />Создать интернет-магазин. Часть 2 <br /></td> <td width="156"> <br />Работа над дизайном, структурой, компонентами и адаптивностью интернет-магазина. <br /></td> <td width="175"> <br />Отчет по практическим работам <br /></td> <td width="137"> <br />2 <br /></td> <td width="117"> <br />Практический <br /></td> </tr> <tr valign="top"> <td width="22"> <br /> <br /> <br /></td> <td colspan="2" width="412"> <br />Итого часов: <br /></td> <td width="175"> <br /> <br /> <br /></td> <td width="137"> <br />72 <br /></td> <td width="117"> <br /> <br /> <br /></td> </tr> </table> <br /><h2> </h2></video></audio></form></th></a></meta>


Достарыңызбен бөлісу:
1   2   3




©engime.org 2024
әкімшілігінің қараңыз

    Басты бет