Mūsdienu maketēšanas pamati - bezmaksas kurss no Hexlet, apmācība 9 stundas, Datums: 2023. gada 5. decembris.
Literārs Mistrojums / / December 06, 2023
Jūs uzzināsiet vairāk par HTML iezīmēšanu un mūsdienu HTML5 standarta iespējām. Jūs iegūsit arī pamatzināšanas par stilu veidošanu, izmantojot CSS: uzzināsiet, kā savienot stilus, izmantot atlasītājus un strādāt ar kaskādi. Papildus HTML un CSS jūs iemācīsities strādāt ar pārlūkprogrammā iebūvētajiem izkārtojuma atkļūdošanas rīkiem, jo īpaši Google Chrome DevTools. Rezultātā jūs uzzināsit, kā izmantot HTML iezīmēšanas valodu, lai izkārtotu tekstu vietnē, kā arī iepazīsities ar CSS un teksta stila lietošanas pamatnoteikumiem.
Jūs varēsiet nekavējoties likt lietā savas jaunās prasmes - mēs izpētīsim izkārtojuma redaktorus un spraudņus tiem. Katras nodarbības beigās jūs atradīsiet nelielus patstāvīgus uzdevumus. To mērķis ir iegūt praktiskāku izpratni par aplūkoto tēmu, un tāpēc tos ļoti ieteicams īstenot.
Izkārtojuma pamati noderēs, ja nolemsiet studēt tīmekļa izstrādi neatkarīgi no virziena. Šajā kursā iegūtās zināšanas palīdz programmētājiem atzīmēt datus un parādīt tos vietnē. Šis kurss ir piemērots iesācējiem un izstrādātājiem, kuri nav saskārušies
Ievads
Kurss “Mūsdienu izkārtojuma pamati” ir pamats HTML un CSS vietņu izkārtojuma pamatu apguvei. Šajā nodarbībā īsi runāsim par to, ko apgūstam kursā un kā šīs zināšanas var pielietot praksē.
Ievads HTML
Nodarbība ir veltīta HTML izkārtojumam no nulles. Mēs runājam par atribūtu lomu un pētām vispārējo HTML tagu aprakstīšanas shēmu.
Bloka modelis
Kuri elementi ir atbildīgi par lapas rāmi un kuri palīdz tā veidošanā vai funkcionālo daļu pievienošanā? Iepazīsimies ar bloka un inline HTML elementiem un pētīsim stilu ietekmi uz elementu galīgo platumu.
Semantiskais HTML
Jebkura HTML izkārtojuma galvenais mērķis ir nodot bloku nozīmi. Šajā nodarbībā mēs izpētīsim jaunākā HTML5 standarta semantikas iespējas un uzzināsim par tīmekļa pieejamību.
HTML dokumenta pamatstruktūra
Jebkuram HTML dokumentam ir pamata struktūra, kas sastāv no tagiem un pakalpojumu elementiem. Pārlūkprogrammai tie ir nepieciešami, lai informācija tiktu parādīta pareizi. Šajā nodarbībā mēs apskatīsim katru šīs struktūras rindiņu.
CSS pamati
CSS valoda tika izveidota tīmekļa lapas vizuālajam noformējumam. Mēs pētām valodas pamatiespējas, izdomājam, kā tās izmantot kopā ar HTML. Mācāmies iekļaut CSS failus un iepazīstamies ar selektoru pamatveidiem.
Kaskāde CSS
Kas ir kaskāde un kā tā darbojas CSS? Nodarbība ir veltīta atlasītāja prioritāšu atšķirībām un spējai to izmantot savos projektos.
Chrome DevTools
Izkārtojot vietni, ir svarīgi laikus atrast kļūdas vai saprast, kā pareizi pārveidot mums nepieciešamo bloku. Iepriekš tas galvenokārt tika darīts ar rokām. Mūsdienās modernajām pārlūkprogrammām ir tīmekļa inspektora funkcija. Apskatīsim viena no tām - Chrome DevTools - iespējas.
Kodu redaktori
Lai saglabātu savu darbu, jums ir nepieciešams koda redaktors. Šajā nodarbībā apskatīsim, kā instalēt Visual Studio kodu. Šis ir spēcīgs rīks, ko var izmantot ne tikai izkārtojumam, bet arī programmēšanai jebkurā valodā.
Emets
Izpētīsim vienu no izkārtojuma dizaineriem noderīgākajiem spraudņiem - Emmet. Tas paātrinās HTML koda iezīmēšanu un noņems lielāko daļu ikdienas darbību.
Publikācija internetā
Lai ievietotu projektu internetā, jums ir jāizmanto hostings - īpašs serveris, kas glabās failus un nodrošinās tiem piekļuvi, izmantojot domēna vārdu. Šajā apmācībā mēs apskatīsim bezmaksas GitHub mitināšanu.
Grafiskais redaktors
Tirgū ir vairāki galvenie redaktori. Dažas no tām ir raksturīgas tikai vienai operētājsistēmai, citas var instalēt jebkurā no tām. Šajā sadaļā apskatīsim galvenās darbības, kad izkārtojuma dizaineris strādā ar Figma tiešsaistes redaktoru.
Patstāvīgs darbs
Papildus uzdevumi, kas ļauj nostiprināt apgūto teoriju
Papildu materiāli
Raksti un videoklipi, kurus veido Hexlet komanda. Palīdzēs dziļāk ienirt kursa tēmā