Este întotdeauna interesant prima dată când încercați să învățați o nouă abilitate. Mai ales codarea.
Cu toate acestea, dacă nu ai practică, uiți cea mai mare parte din ceea ce înveți. Prin urmare, la un moment dat vă dați seama că trebuie să practicați ceea ce ați învățat. Altfel, vei uita totul.
Aici intervin proiectele. Proiectele sunt o modalitate bună de a exersa ceea ce ați învățat. Și credeți-mă că vreți să lucrați la niște proiecte. Puteți folosi proiectele pentru a prezenta ceea ce ați lucrat.
În calitate de începător, alegerea proiectelor care se potrivesc nivelului dvs. actual de cunoștințe poate fi descurajantă. Ați putea alege un proiect. Apoi, proiectul devine prea mare pentru a fi realizat cu know-how-ul dumneavoastră actual. Cel puțin, prin asta am trecut eu în această călătorie de învățare.
Am curatoriat câteva proiecte pe care le-am găsit potrivite chiar dacă cunoștințele dvs. sunt limitate doar la HTML și CSS. Aceste proiecte sunt disponibile pe site-uri populare de învățare, unde veți găsi informații suplimentare despre ceea ce veți aborda.
1. O pagină omagială
Scrieți un omagiu unei persoane pe care o admirați și publicați-l sub forma unei pagini web. Acest proiect va implica lucrul cu adăugarea de imagini, link-uri, liste și paragrafe. Acest proiect va necesita cunoștințe de HTML pentru a fi creat. Cu toate acestea, puteți folosi un pic de CSS pentru a face ca proiectul să arate mai bine.
2. Un formular de sondaj
Formele sunt utile în colectarea de date online. Acest proiect va testa în principal abilitățile dvs. privind toate tipurile de intrări. Acesta vă va testa cunoștințele despre formulare și structurarea paginii web. Formularul nu este necesar pentru a trimite date.
Este o construcție de la pagina de tribut. Acest proiect va necesita cunoștințe de html/html5 pentru a fi creat.
3. Build a Product Landing Page
Acesta vă va testa cunoștințele atât de HTML cât și de CSS. Vi se va cere să exersați crearea de coloane și alinierea elementelor în cadrul coloanelor. Va trebui, de asemenea, să faceți editarea de bază a imaginilor, de exemplu, decuparea și redimensionarea pentru a face imagini perfecte pentru pagina dvs. web.
Voi avea nevoie de cunoștințe solide de HTML/CSS.
4. Construiți o pagină de documentație tehnică
Aceasta va necesita anumite cunoștințe de HTML CSS și bootstrap sau JavaScript. Ideea de bază este următoarea: atunci când faceți clic pe orice subiect din stânga, se încarcă acel conținut în dreapta.
În prezent încerc să realizez acest proiect și voi posta proiectul final după ce va fi gata.
5. Construiți o pagină web de portofoliu personal
Voi pune în practică toate abilitățile pe care le-ați învățat în HTML și CSS. De asemenea, va trebui să știți cum să tăiați și să redimensionați imagini. Dacă nu aveți opțiuni, folosiți Gimp. Este gratuit, open source și disponibil pe Windows și Linux .
Dacă vă grăbiți să vă faceți un portofoliu, puteți citi articolul lui Brian despre cum să vă faceți un portofoliu online folosind o temă/model gata făcut.
6. Pagina Google.com
Da, ați văzut-o de multe ori. Dar puteți să o reproduceți. Pagina simplă google.com cu pictograme, logo-ul google, o casetă de text și două butoane. Poți face un look-alike al paginii google.com. În acest proiect o faci să arate ca google.com nu să funcționeze ca google.com.
Trebuie să cunoști atât HTML cât și CSS.
7. google.com Search result page
Voi crea o pagină cu formatul unui rezultat de căutare google. Pagina dvs. ar trebui să aibă cele 10 rezultate normale și navigarea către paginile următoare în partea de jos.
Aceasta este o îmbunătățire față de pagina de bază google.com de mai sus. Cu toate acestea, ar trebui să puteți reutiliza o parte din codul de pe acest proiect.
De asemenea, realizați pagina ar trebui să arate oarecum, dar funcționalitatea nu ar trebui să fie o preocupare în acest moment.
Concluzie
Dacă doriți să învățați elementele de bază ale HTML, puteți verifica scurta mea lecție introductivă în HTML.
Ați realizat un proiect de bază în timp ce învățați HTML și CSS? Dacă ați făcut-o, împărtășiți-le mai jos și ajutați alți cursanți să găsească idei „simple” dar provocatoare pe care să le încerce.
.