Go to Top

Курс по Web-Design

Изчерпателна учебна програма предназначена за начинаещи

 

  • Цел на курса по Web-Design с HTML, CSS, JavaScript:

    Запознаване на групата с изключително популярните и може би най-използваните днес, езици за създаване на уеб страници и приложения. Придобиване на една солидна професионална база от познания и умения  за изграждане и поддръжка на динамични уеб страници. Създаване на условия за по-добра реализация  в IT сектора, чрез по-лесно стартиране на професионално развитие, като Front-End Developer.

    В края на обучението си курсистите, ще могат да създават динамични и лесно използваеми уеб страници с добро графично оформление. Техните страници, ще бъдат правилно структурирани за по-лесна оптимизация от търсачките.

    За кого е предназначен курсът:

    Курсът е подходящ, за абсолютно начинаещи, също така и за тези, които имат известни познания и желаят да ги доразвият на професионално ниво.

    Какво е необходимо за участие в курса:

    Необходимо е курсистите желаещи да вземат участие в курса да се запишат, като направят това на място в административния офис на компютърно образователния център „Progress”(пл. Славейков №11. ет.4 )  или по банков път.

    Ползване на личен или служебен лаптоп:

    Тези, които нямат възможност да ползват собствен лаптоп, трябва да заявят за това по email или телефон, за да им бъде осигурен служебен лаптоп/настолен компютър от центъра.

    Мащаб на групата:

    Обучението се провежда в малка ( бутикова ) група, ограничена до 8-м участника, с цел много повече индивидуално внимание на лектора към курсистите по време на практическите упражнения.

    Издаване на Сертификат:

    По време на курса се предвиждат няколко контролни теста. В края на обучението, се представя практически проект. Добрите резултати на курсистите са основание за получаване на Сертификат.

    Хостинг план:

    Безплатен хостинг за всеки един курсист за целите на курса, предоставен от нашите партньори от Суперхостинг, чрез план – “СуперПро” . Повече информация – тук.

    Продължителност на курса:

    Курса е с продължителност от 3 месеца ( 110 учебни часа).

  • Учебна програма на курса по Уеб Дизайн:

    1. Въведение
      1. Представяне на курса и съпътстващите онлайн ресурси.
      2. Да подредим бъркотията от понятия: WebDesign, Front-end или client-side разработка? Back-end или server-side приложения? Full-stack developer?
      3. HTML, CSS, JavaScript – какво можем да правим с тях? Live demo.
      4. За какво и как ще използваме codepen.io?
    2. Настройка на средата. Работа с текстов редактор ( Sublime Text 3)
      1. Sublime Text, Atom, Visual Studio Code, Brackets – модерните инструменти за създаване на код.
      2. Защо да изберем Sublime Text?
      3. Инсталиране
      4. Настройки
      5. The Command Palette
      6. Инсталиране на Package Control и допълнителни пакети
    3. Клиент-Сървър комуникация. Основи на HTTP. Работа с Уеб хостинг.
      1. Как работи Интернет? Клиент-Сървър комуникация. Основни понятия в HTTP (request/response messages, query methods).
      2. Какво е domain, hosting, IP адрес, DNS?
      3. Как да работим с нашия Уеб хостинг: запознаване с контролния панел (CPanel) и реален пример за настройка на акаунт в SuperHosting.bg. Промяна на DNS записи.
      4. Как да „качим“ сайта си на Уеб сърър – реален пример с акаунт на SuperHosting.bg. Настройка на FTP клиент. А защо не и чрез стандартния файлов браузър на Windows?
    4. Въведение в WWW
      1. Преглед на развитието на WWW и технологиите зад нея.
      2. Уеб ресурси, URL/URI
      3. Структура на един Уеб сайт.
    5. Основи на HTML
      1. Структура на една Уеб страница.
      2. Какво е HTML и HTML5?
      3. Синтаксисът е в основата на всичко.
      4. Doctype, head и body секции.
      5. Елементи в head секцията. Мета информация за документа.
      6. Коментарите, макар и безгласни, могат да бъдат важни.
    6. HTML елементи за структуриране на текст.
      1. Работа с параграфи и заглавия.
      2. Елементи: b, strong, i, em, mark, small, del, ins, sub, sup, code, pre, kbd.
      3. Създаване на Уеб документ с разнообразно текстово съдържание.
    7. Хипервръзки (линкове) и изображения.
      1. Вмъкване на изображения, разположени върху локален сървър или WWW.
      2. Създаване на хипервръзки (линкове) към WWW ресурси или ресурси, разположени на сървъра.
      3. Създаване на връзка към секция (bookmark) в текущия документ.
    8. Списъци в HTML
      1. Създаване на подредени списъци.
      2. Създаване на неподредени списъци.
      3. Създаване на вложени списъци? Лесно, ако следваме едно единствено правило.
    9. Таблици в HTML
      1. Кога и за какво да използваме таблици?
      2. Как да създадем таблица в HTML.
      3. Сливане на клетки (cell span) по редове и колони.
      4. Някои забележки относно оформлението на таблиците и HTML5.
    10. HTML5 форми
      1. Елементи за въвеждане на информация от потребителя.
      2. Нови възможности в HTML5 за въвеждане и валидиране на email, дата, телефон и пр.
      3. HTML5 ColorPicker (без JavaScript).
      4. HTML5 files upload.
    11. Въведение в CSS
      1. Какво е CSS и как допълва HTML.
      2. Inline, internal или external CSS?
      3. Структура на CSS правилата.
      4. Наследяване на CSS правила. Какво е „каскадното“ в CSS ?
    12. Селектори в CSS3 – Част1
      1. Селектори за елементи.
      2. Селектори за class и id.
      3. Селектори за атрибути.
      4. CSS комбинатори.
      5. Стилизиране на елементите в страницата чрез CSS32
      6. Запознаване с основните CSS свойства за оформление на текст, шрифт, цвят, фон и рамка.
      7. Да влезем в кутията или the CSS box model.4
      8. HTML елементът разгледан като кутийка.
      9. Основни CSS свойства за оразмеряване на „кутийките“.
      10. Блокови и поредови елементи.
      11. Replaced elements? ,
      12. Групиране на елементи в блок с елемента div.
      13. Групиране на елементи в ред с елемента span.
      14. Мерни единици в CSS34
      15. Абсолютни и релативни мерни единици.
      16. Стойности за цветове.
      17. Color Pallets – или как да генерираме и подбираме подходящите цветове за нашият сайт.
      18. Да излезем от кутията или как браузърът подрежда HTML елементите.6
      19. Накратко за Visual Formatting Model.
      20. Свойството display и новите модели в CSS3.
      21. Позициониране на елементите – свойства position и float.
      22. Пренареждане на елементите чрез свойството z-index.
      23. Селектори в CSS3 – Част 2.
      24. Селектори за псевдо-класове.
      25. Селектори за псевдо-елементи.
      26. Създаване на падащи менюта (вертикални и хоризонтални) от списък чрез CSS.
    13. Iframes
      1. Как да „вградим“ съдържание от други страници в нашия документ?
      2. По-голям контрол и безопасност на съдържанието чрез атрибута sandbox.
      3. Вмъкване на карта в страницата (GoogleMaps и bgmaps).
      4. Вмъкване на Пен от codepen.io.
    14. CSS3 – text/box shadows. Gradient backgrounds.
      1. Специални ефекти с text-shadow.
      2. Специални ефекти с box-shadow.
      3. CSS3 gradient backgrounds.
      4. Да направим от текста лого, единствено със CSS3.
    15. CSS3 transition/animation ефекти
      1. Как работят transitions/animations?
      2. Какво е общото и различното между CSS3 transitions и animations
      3. CSS3 свойството transition
      4. Раздвижване на елементите със CSS3 transition и animation ефекти.
      5. One-page scroll effect with transition and :target pseudo-class.
    16. Въведение в JavaScript
      1. Защо се създава?
      2. Какво е JavaScript? А EcmaScript?
      3. Защо не бива да бъркаме JavaScript с Java.
      4. Какво можем да правим с JavaScript?
      5. Как и кога браузърът изпълнява JavaScript.
      6. Къде и как да включим нашия скрипт?
    17. JavaScript – основни синтактични елементи.
      1. Структура на програмата.
      2. Променливи (Variables)
      3. Прости типове данни (Primitive types)
      4. Коментари и добри практики за тяхното използване.
      5. Оператори.
      6. Условни изрази.
      7. Цикли.
    18. Javascript: масиви и операции с тях.
      1. Дефиниране на масив.
      2. Достъп до елементите,
      3. Масива като обект,
      4. Основни операции с едномерни и двумерни масиви.
    19. Javascript: функции.
      1. Създаване на семпъл калкулатор.
      2. Игра: Морски шах.
    20. JavaScript – обекти.
      1. Обекти.
    21. Как да променяме и създаваме HTML елементи чрез JavaScript
      1. Накратко за DOM.
      2. Достъпване на HTML елементите чрез JavaScript и DOM.
      3. Промяна на съдържанието на елементите.
      4. Създаване и изтриване на HTML елементи.
      5. Игра: познай числото!
    22. Как да променяме CSS свойствата на елементите чрез JavaScript
      1. HTML DOM Style Object.
    23. JavaScript и HTML DOM Events
      1. За какво и как се използват event handlers.
      2. Mouse events.
      3. Keyboard Events
      4. Frame/Object Events
      5. Form Events
      6. Drag Events
      7. Игра: избягай от чудовището!
    24. Обработка на дати и време. Tаймери в JavaScript
      1. Синхронен и асинхронен JavaScript – кратко въведение.
      2. Работа с таймери.
      3. Обекта Date и неговите методи и свойства.
      4. Игра: преди колко дни съм роден?
    25. Създаване на цялостен front-end на Уеб сайт (върху собствен проект или електронен магазин)
      1. Планиране на съдържанието и таргет групата.
      2. Файлова структура и конвенции за имената
      3. Изготвяне на Layout за страниците.
      4. Оформление на менютата с CSS3.
      5. Естетична галерия за продуктите чрез HTML5/CSS3/JavaScript
      6. Изготвяне на форми за регистрация и потребителски профил.
    26. Вместо заключение
      1. Повече за добрите SEO практики
      2. Responsive Web design.
      3. Няколко думи за User Experience Design (UX design).
      4. Бумът на node.js и други .js frameworks.

    Курсов проект:
    По време на обучението, курсистите ще имат възможността да разработят самостоятелно цялостния front-end на Уеб сайт (по зададена или избрана от тях тематика) като курсов проект. Акцентът отново ще бъде поставен върху качествения код, съобразен с актуалните стандарти (HTML5/CSS3/JavaScript (ES5, ES6) ), съвместимостта (cross browser compatibility) и добрите SEO практики.

  • График на курса по „Web-Design с HTML, CSS , JavaScript“.

    Продължителност на обучението – 110 учебни часа ( 3 месеца).

    Местата в групата са ограничени до 8 курсиста.

    Следващите начални дати са:

    08-ми юни 2019г. ( съботно-неделна форма на обучение от 10:30 до 13:30 часа, което са 4 учебни часа с включени 20 минути почивка). Занятията, ще се провеждат всяка събота и неделя. Край на курса: 07-ми септември 2019 г.

    01-ви юли 2019г. ( вечерна форма на обучение от 19:00 до 22:00 часа, което са 4 учебни часа с включени 20 минути почивка). Занятията, ще се провеждат всеки понеделник и сряда. Край на курса: 02-ри октомври 2019г.

    Цена:

    Цена: 690 лв.

    Има възможност за разсрочено заплащане на курса на две вноски. Първата вноска от 400 лева се внася при записването, а втората(290 лева)  в началото на втория месец от обучението.

    Бонуси:

    15% отстъпка при записване на Web-Design Advanced.

    10% отстъпка при записване на друг курс.

    Важно: Компютърно образователен център “Progress” има партньорски отношения с компании от IT сектора ( част от тях може да разгледате – тук ). Курсистите, които са показали отлични резултати по време на съответния курс, ще бъдат препоръчвани, като кандидати за работа на тези компании.

  • Запиши се сега!

    Форма на обучение:

    От къде научихте за нас:

    Записване на курс по Web Design (HTML, CSS, JavaScript):

    • Записването се извършва предварително на място в образователния център или по банков път. При заплащане по банков път, моля погледнете банковата сметка по-долу.
    • Сумата на курса, може да се заплати разсрочено на две вноски. Първата вноска от 400 лева се внася при записването, а втората (290 лева) до 30 дена от старта на обучението.
    • Тези, които нямат възможност да ползват собствен лаптоп, трябва да заявят за това по email или телефон, за да им бъде осигурен служебен лаптоп/настолен компютър от центъра.
    • За нуждите на курса залата е оборудвана с мултимедиен проектор.
    • Предоставят се учебни материали на всеки курсист повреме на обучението (безплатно).
    • Курсистите носят със себе си задължително – тетрадка и химикал. Желателно e курсистите да бъдат в учебния център поне 10 минути преди започване на занятието.
    • В края на курса се държи тест, минаването на който е основание за издаване на Сертификат.
    • Бонус: При записване на следващ курс в образователен център „Progress” курсиста ползва 10% отстъпка.

    Записване по банков път:

    Номер на банкова сметка:
    IBAN:BG49CECB979010E2257300
    BIC:CECBBGSF
    Основание за плащане: компютърно обучение по „Web-Design“

    След, като извършите превода е нужно да ни уведомите на email:[email protected]

    Може да оставите данните на фирмата си в случай, че бихте искали да ви се издаде фактура. Моля, ако имате някакви въпроси, не се колебайте да се свържете с нас. За контакти, натиснете – тук.

  • Преподаватели

    Ива Емилова Попова

    Ива Емилова Попова

    Ива Емилова Попова Магистър-инженер по Компютърни системи и технологии, ТУ-София. Повече от 7 години опит като професионален Уеб програмист в утвърдени IT компании, някои от които са Store.bg, Comptel, Internet Securities и Datamax. Има опит като старши Уеб разработчик и ръководител на софтуерен екип. През последните 2 години работи като консултант и програмист на свободна практика в сферата на Семантичния Уеб, което и позволя всеобхватно да прилага, използва и обогатява уменията си в най-модерните аспекти на Уеб Технологиите. Преподавателската дейност на Ива започва през 2004г., когато започва и обучението си като докторант по „Системи с Изкуствен Интелект“ (профил: Семантични търсещи системи) към ТУ-София. Повече от 7 години води дисциплините „Програмиране в Интернет“„Програмни езици“„Изкуствен интелект и експертни системи“ като асистент към ТУ-София и други висши учебни заведения. Обича да споделя и обогатява знанията си не само с колеги-програмисти, но и с хора неизкушени доскоро в тази област. Твърдо вярва, че програмирането, в частност – Уеб Технологиите, са за всеки и трябва да бъдат разбираеми за всеки.

    Уеб Технологии: HTML5, CSS3, JavaScript (+jQuery, AngularJS, Bootsrtap, Node.js,…)

    Бази Данни: MySQL, MongoDB, Berkeley DB

    Програмни езици: Perl, Python, C++