Crearea de site-uri web pe Webflow - curs 31.900 RUB. de la Uprock, antrenament 4 luni, data de 27 noiembrie 2023.

instagram viewer

TEORIE

Introducere

În această lecție veți afla despre curs și cum va decurge instruirea. Familiarizați-vă cu caracteristicile și scopurile planurilor gratuite și plătite ale Webflow. De asemenea, veți învăța cum să structurați munca pe un proiect de la analiză până la lansare.

• Despre ce este acest curs?
• Cum funcționează cursul
• Planuri și tarife
• Planuri de amplasament
• Planuri de cont
• Revizuirea și analiza aspectului
• Lista de verificare pentru acceptarea aspectului
• Plan de muncă
• Pregătirea aspectului pentru aspect
• Exportați și optimizați imaginile
• Pregatirea altor fisiere

TEORIE

Structura web

În această lecție, vă veți familiariza cu elementele de bază ale unei pagini web și cu principiile aspectului bloc pe care funcționează serviciul Webflow. Cunoștințele de bază vă vor ajuta să înțelegeți terminologia de bază a dezvoltării web. Veți afla ce este o ierarhie de pagini web și în ce constă. Explorați panoul Navigator pentru a înțelege cum este creată și afișată structura elementului în Webflow.

• Aspect bloc și HTML și CSS de bază
• Ierarhia elementelor site-ului
• Panoul de navigare
• Practică: planificarea structurii site-ului

TEORIE

Crearea si publicarea proiectelor

În această lecție, veți învăța cum să vă înregistrați pe site-ul Webflow și să creați un proiect, să aflați limitările privind numărul de proiecte și pagini dintr-un proiect. Veți înțelege ce moduri de operare există în serviciul Webflow. Și, de asemenea, aflați cum să vă activați contul și să vă publicați site-ul utilizând panoul derulant Publicare.

• Înregistrarea și crearea unui proiect
• Publicarea unui site web
• Partajați proiectul
• Clonarea unui proiect
• Clonarea unui șablon personalizat

TEORIE

setări de bază

Vă veți familiariza cu setările de bază ale proiectului în modul Setări proiect. Ca rezultat, configurați proiectul, încărcați imagini în foldere și creați kitul UI.

• Setările proiectului
• Conectarea domeniului dvs
• Fișiere de site
• Setări generale ale proiectului
• Configurarea stilurilor de bază
• Încărcarea imaginilor
• Kit UI de elemente principale

PRACTICĂ

Elemente

În această lecție veți învăța despre modalități de a adăuga elemente la o pagină de site și ce elemente nu pot fi localizate în propriul lor tip. Aflați ce elemente de bază există pentru a crea un site web și care este scopul lor. În cele din urmă, creați structura site-ului și adăugați conținut elementelor.

• Adăugarea de elemente
• Prezentare generală a elementelor principale
• Prezentare generală a elementelor funcționale
• Personalizarea elementelor
• Practică: Crearea structurii principale a site-ului
• Practică: Adăugarea de elemente și clase

PRACTICĂ

Stiluri de elemente

Vă veți familiariza cu concepte precum Clasele și Clasele combinate și veți afla despre scopul lor. Ca rezultat, adăugați clase la Secțiuni, Containere, Imagini, Texte.

• Principii generale
• Prezentare generală a secțiunilor simple ale panoului Stil
• Prezentare generală a panoului Manager de stil
• Stări ale elementelor
• Practică: Adăugarea de conținut la elemente

PRACTICĂ

Setări de stil. 1 parte

Veți studia compoziția panoului Stil și veți examina secțiunea Layout, care este utilizată pentru a configura aranjarea elementelor unul față de celălalt.

• Panou de stil: Secțiunea Aspect
• Practică: Aspectul detaliat al secțiunilor 1 și 2

PRACTICĂ

Setări de stil. partea 2

Veți continua să explorați compoziția panoului Stil și să examinați elementul Grid, care este responsabil pentru modul în care sunt aranjate elementele, ceea ce este ideal Potrivit pentru crearea unei varietăți de structuri complexe de grilă, inclusiv tabele care pot fi ușor convertite în carduri pe mobil ecrane.

• Panou de stil: Element grilă
• Practică: aspectul detaliat al secțiunilor 3 și 4

PRACTICĂ

Setări de stil. Partea 3

Veți continua să studiați compoziția panoului Stil și să studiați secțiunea Dimensiune, care vă permite să determinați dimensiunea elementului, set valorile minime și maxime de lățime și înălțime și personalizați comportamentul elementelor copil care depășesc granițele element părinte.

• Panou de stil: Secțiune de dimensiune
• Practică: Aspectul detaliat al secțiunilor 5 și 6

PRACTICĂ

Paginile site-ului

Vom arunca o privire la panoul Pagini. Să aflăm ce tipuri de pagini există și cum să le personalizăm. Ca rezultat, veți crea 7-8 secțiuni ale site-ului.

• Paginile site-ului
• Practică: aspectul detaliat al secțiunilor 7 și 8

PRACTICĂ

Funcții secundare

Veți afla despre funcții suplimentare care vă ajută în timp ce lucrați la un proiect, precum și în găsirea materialelor de instruire. Ca rezultat, veți crea 9-10 secțiuni ale site-ului.

• Funcțiile de ajutor în modul Designer
• Practică. Aspectul detaliat al secțiunilor 9 și 10

PRACTICĂ

Simboluri și modele

Aflați cum să creați simboluri din elemente sau grupuri de elemente în Webflow pentru a gestiona blocurile și conținutul care se repetă. Ca rezultat, veți configura meniul de navigare, Navbar, veți configura legături de ancorare și veți crea simboluri pentru Meniu și Subsol.

• Prezentare generală a panoului de simboluri
• Revizuirea layout-urilor gata făcute
• Crearea Personajelor
• Practică

PRACTICĂ

Aspect adaptiv

În această lecție veți învăța elementele de bază ale aspectului adaptiv și vă veți familiariza cu conceptul de „puncte de întrerupere”. Ca rezultat, creați o tabletă adaptivă și o versiune mobilă, una adaptivă pentru ecrane mari și un meniu adaptiv.

• Bazele aspectului adaptiv
• Puncte de întrerupere
• Verificarea adaptabilității
• Adaptare site pentru ecrane mobile
• Adaptare site pentru ecrane mari
• Testarea adaptabilității

CAPACITĂȚI EXTINSE

Animaţie. 1 parte

Veți învăța principiile generale ale animației, veți afla cum să animați butoanele de link și alte elemente de trecere cu mouse-ul și să animați primul ecran.

• Principii generale de animație
• Declanșatoare
• Configurarea declanșatorilor
• Elemente de animare la hover
• Legături de ancorare

CAPACITĂȚI EXTINSE

Animaţie. partea 2

Veți învăța ce este animația globală. Ca rezultat, învață cum să-l creezi.

• Animație globală
• Animație componente
• Animație la încărcarea și derularea paginii

CAPACITĂȚI EXTINSE

Se introduce codul terțelor părți

Veți înțelege de ce trebuie să introduceți cod de la terți. Faceți cunoștință cu componenta Embed. Aflați cum să integrați codul terță parte, de exemplu, conectați servicii de comentarii sau un widget pentru hărți. În practică, aflați cum să introduceți codul cardului.

• Componenta încorporată
• Inserarea codului în setările paginii
• Inserarea codului în setările proiectului
• Inserarea codului în setările elementului (Atribute personalizate)
• Inserarea hartii pe site

CAPACITĂȚI EXTINSE

Analytics și SEO

Aflați ce sunt analizele web și SEO și de ce sunt necesare. Veți înțelege cum să conectați Analytics și să configurați pagini SEO.

• Conectarea Analytics
• Conectarea Yandex Metrica și Google Analytics
• Configurarea SEO în setările paginii

CAPACITĂȚI EXTINSE

Finalizarea proiectului

Încă o dată, parcurgeți toate etapele creării unui site web. Veți afla cum să aprobați și să transferați site-ul către client. Aflați cum să conectați un site web la un domeniu pe găzduirea Webflow, să încărcați site-ul web și să îl instalați pe găzduirea dvs.

• Lista de verificare pentru verificarea site-ului
• Aprobarea si predarea proiectului catre client
• Conectarea unui site web la un domeniu pe Webflow hosting
• Încărcarea site-ului și instalarea acestuia pe găzduirea dvs

CAPACITĂȚI EXTINSE

Primă

Proiect de absolvire