Go to Top

Учебна програма по Web-Design

Учебна програма:

1. Въведение.

Представяне на курса и съпътстващите онлайн ресурси.
Преглед на развитието на WWW и технологиите зад нея.
Структура на един Уеб сайт.
Какво е domain, hosting, Уеб ресурс, URL, IP адрес?
Да подредим бъркотията от понятия: WebDesign, Front-end или client-side разработка?
Back-end или server-side приложения?
Sublime Text, Brackets, Atom модерните
инструменти за създаване на код.
За какво и как ще използваме codepen.io?

2. Основи на HTML.

Структура на една Уеб страница.
Какво е HTML и HTML5?
Синтаксисът е в основата на всичко.
Doctype, head и body секции.
Елементи в head секцията. Мета информация за документа.
Коментарите, макар и безгласни, могат да бъдат важни.

3. Структуриране на текст.

Работа с параграфи и заглавия.
Елементи: b, strong, i, em, mark, small, del, ins, sub, sup, code, pre, kbd.
Създаване на Уеб документ с разнообразно текстово съдържание.

4. Хипервръзки (линкове) и изображения.

Вмъкване на изображения, разположени върху локален сървър или WWW.
Създаване на хипервръзки (линкове) към WWW ресурси или ресурси, разположени на сървъра.
Създаване на връзка към секция (bookmark) в текущия документ.

5. Списъци и таблици.

Създаване на подредени и неподредени списъци.
Вложени списъци.
Създаване на таблици.
Кога и за какво да използваме таблици?

6. Iframes.

Как да “вградим” съдържание от други страници в нашия документ?
По-голям контрол и безопасност на съдържанието чрез атрибута sandbox.

7. HTML5 мултимедия.

Елементът audio.
Елементът video.
Повече за различните аудио и видео формати и тяхната поддръжка от браузърите.

8. HTML5 форми.

Елементи за въвеждане на информация от потребителя.
Нови възможности в HTML5 за въвеждане и валидиране на email, дата, телефон и пр.
HTML5 ColorPicker (без JavaScript).
HTML5 files upload.

9. HTML и Семантичния Уеб.

Семантични елементи в HTML5.
Тенденции и развитие.

10. Въведение в CSS.

Какво е CSS и как допълва HTML.
Inline, internal или external CSS?
Структура на CSS правилата.
Наследяване на CSS правила. Какво е “каскадното” в CSS ?

11. Селектори в CSS3.

Селектори за елементи.
Селектори за class и id.
Селектори за атрибути.
CSS комбинатори.
Селектори за псевдокласове.
Селектори за псевдоелементи.
Създаване на падащи менюта (вертикални и хоризонтални) от списък чрез CSS.

12. Стилизиране на елементите в страницата чрез CSS3.

Запознаване с основните CSS свойства за оформление на текст, шрифт, цвят, фон и рамка.
Абсолютни и релативни мерни единици.
Стойности за цветове.

13. Да влезем в кутията или the CSS box model.

HTML елементът разгледан като кутийка.
Основни CSS свойства за оразмеряване на “кутийките”.

14. Да излезем от кутията или как браузърът подрежда HTML елементите.

Блокови и поредови елементи.
Свойството display и новите модели в CSS3.
Позициониране на елементите свойства position и float.
Пренареждане на елементите чрез свойството z-index.
CSS Layouts примери и добри практики.

15. CSS3 визуални ефекти и анимации.

Специални ефекти с textshadow.
Специални ефекти с boxshadow.
Да направим от текста лого, единствено със CSS3.
Раздвижване на елементите със CSS3 animation и transition ефекти.

16. Накратко за HTML5 canvas и SVG графики.

17. Въведение в JavaScript.

Какво е JavaScript? А EcmaScript?
Защо не бива да бъркаме JavaScript с Java.
Какво можем да правим с JavaScript?
Как и кога браузърът изпълнява JavaScript.
Къде и как да включим нашия скрипт?

18. JavaScript основни синтактични елементи.

Структура на програмата.
Коментари и добри практики за тяхното използване.
Променливи, типове данни.
Оператори.
Условни изрази.
Цикли.
Функции.
Обекти.
Създаване на семпъл калкулатор.

19. Как да променяме и създаваме HTML елементи чрез JavaScript.

Накратко за DOM.
Достъпване на HTML елементите чрез JavaScript и DOM.
Промяна на съдържанието на елементите.
Създаване и изтриване на HTML елементи.
Игра: познай числото!

20. Как да променяме CSS свойствата на елементите чрез JavaScript.

HTML DOM Style Object.

21. Как елегантно да се справим с потенциалните грешките в JavaScript.

Изрази try и catch.
Обработка на изключения: throw exception.
Валидиране на HTML форми със JavaScript.

22. JavaScript и HTML DOM Events.

За какво и как се използват event handlers.
Mouse events.
Keyboard Events
Frame/Object Events
Form Events
Drag Events
Игра: избягай от чудовището!

23. Обработка на дати и време. Tаймери в JavaScript.

Работа с таймери: синхронен и асинхронен JavaScript.
Обекта Date и неговите методи и свойства.
Игра: преди колко дни съм роден?

24. Създаване на цялостен front-end на Уеб сайт (електронен магазин).

Планиране на съдържанието и таргет групата.
Изготвяне на Layout за страниците.
Oформление на менютата с CSS3.
Естетична галерия за продуктите чрез HTML5/CSS3/JavaScript
Изготвяне на форми за регистрация и потребителски профил.

25. Повече за добрите SEO практики.

26. WebDesign trends.

Предпроцесори за CSS: Sass vs LESS.
Responsive Web design.
Няколко думи за User Experience Design (UX design).
Бумът на node.js и .js frameworks.

Цена за online курс по „Web-Design“ (с безсрочен достъп до видео уроците):

Цена: 900 лв.

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

Номер на банкова сметка:

IBAN:BG49CECB979010E2257300
BIC:CECBBGSF

Основание за плащане: Online курс по “Web-Design”.

Записване на място в офиса:

София, пл. Славейков 11, етаж 5, административна зала 1.

Работно време: всеки делничен ден от 09:30 – 18:30.

Начин на провеждане на курса:

– Първо се регистрирате в distancionno-obuchenie.eu – тук. Това е нашата платформа за онлайн обучения. В нея, ще можете да гледате учебните видео уроци.

– Информирате ни, че сте направили регистрацията на office@progressbg.net или на тел. 0988 78 4321 – Виолета Станева.

– Ние, Ви отключваме курса за който сте заплатили за безсрочно ползване.

– Имате право на обратна връзка с автора/лектора на видео уроците през първите 6 месеца. Контакт за уговаряне на беседата: 0988 78 4321 – Виолета Станева.

– След успешно преминат тест Ви се издава Сертификат.