Til ...

Ókeypis námskeið: Búðu til blogg frá grunni

Það gæti verið auðveldara en þú hélst

Áður en ég kem að greininni vil ég bara deila því að ég er að búa til vöru og mig langar að safna gögnum um hvernig ég get þjónað vefhönnuðum betur. Ég bjó til stuttan spurningalista sem ég skoðaði fyrir eða eftir að hafa lesið þessa grein. Vinsamlegast prófaðu það - takk fyrir! Og nú aftur að venjulegu prógramminu okkar.

Bloggið sem við ætlum að búa til. Viltu frekar vídeó? Smelltu til að opna í Scrimba

Ef þú ert eins og ég, þá hefur þú áhuga á vefnum og yfirþyrmandi umfangi hans, en þú verður líka yfirfullur af flóðinu af upplýsingum sem fylgja því að læra HTML og CSS. Málið er að þessi tungumál eru frábrugðin öðrum sviðum eins og ritvinnsluforritum og forritunarmálum. Vefurinn er annar heimur og ekki sá fallegasti.

Eftir að hafa kynnt mér aðeins internetið er ég hér til að hvetja þig, því með smá leiðsögn geta þessi svæði verið miklu auðveldari en þú ímyndar þér. Lestu áfram og við búum til fallegt blogg frá grunni. Við munum einnig læra um CSS rist, flexbox og móttækilega hönnun.

Markmiðið er að gera fyrir þig það sem ég gerði fyrir sjálfan mig; Lærðu HTML og CSS með fyrstu lögmálum.

Viltu frekar vídeó? Smelltu til að opna í Scrimba

Ég kenndi líka ókeypis HTML / CSS námskeið um Scrimba kennslu hvernig á að búa til fallegt blogg frá grunni. Smelltu hér til að skrá þig inn!

Scrimba.com er gagnvirkur framhliðarpallur sem gerir kleift að taka upp og breyta vefsíðum sem atburði frekar en myndböndum.

Hvaðan kemur HTML?

HTML er afleiða fyrsta meta- eða markup tungumálsins: GML. Þúsundatal lesendur vinna nú að GML til að standa fyrir Generalized Markup Language, en það er ekki allt. Það voru Charles Goldfarb, Edward Mosher og Raymond Lorie sem bjuggu til það sem við þekkjum í dag sem meta eða merkimál hjá IBM. Og árið 1996 skrifaði Charles Goldfarb:

„Ég gaf GML núverandi nafn svo upphafsstafirnir okkar sanna alltaf hvaðan þeir koma. Einn ljóti sannleikur tækniflutnings er að verktaki er þakklátur fyrir rannsóknir í fyrsta sinn og tekur varla eftir því í lok langrar þróunarferils ... “
- Charles Goldfarb, 1996

GML var síðar staðlað og varð þannig SGML. Svo fékk Tim Berners-Lee, sem starfaði hjá CERN, lánaðan ML frá SGML (nei, engin vélanám eða hvað hipsterarnir kalla það) til að búa til HTML, þar sem HT stendur fyrir HyperText.

Úff, flott orð. Eftir því sem ég best veit á það rætur að rekja til gagnvirks höfundarumhverfis sem kallast HyperCard eftir Bill Atkinson, sem starfaði hjá Apple. Til að fá ítarlegri rannsókn legg ég fram eftirfarandi myndskeið:

Smelltu á annað hvort til að læra meira

Svo við skulum draga saman aftur. HTML vann ekki bara heiminn. Reyndar var heill heimur fyrir HTML. Reiði Ég veit að ég skjálfti af áfalli - en ég fæddist ekki - svo það var enginn heimur.

Og HTML skuldar forverum sínum mikið. Eins og við öll foreldrum okkar. Hins vegar er þetta hvernig við búum til kóða úr texta. Í fjórum mínútna kennslustundum mun ég læra grunnatriði HTML, CSS og móttækilegrar hönnunar.

HTML og CSS á 4 mínútum

Fyrsta mínúta: Það er hægt að skilja vefsíðu betur sem veftré


     
     

Allar vefsíður byrja lífið sem slíkt. En þetta er hræðilegt, það er ekkert innihald. Þrátt fyrir það byrjum við hér vegna þess að við verðum fyrst að skilja hvað vefsíða er. Ímyndaðu þér tré - uppstreymt tré * - veftré. HTML frumefnið er rótin, en höfuð og líkami eru fyrstu greinar veftrésins okkar:

html <- rót / \ höfuð líkami <- greinar

Aðalþátturinn (eða sama merkið) er notað til að veita lýsigögn eða upplýsingar um vefsíðu okkar. Líkamsþátturinn er aftur á móti ætlaður fyrir innihald vefsíðunnar okkar. Og þar sem CSS er stíllinn á vefsíðu okkar er það geymt í hausþáttnum en efni eins og málsgreinar, myndbandsupptökur (≧ ≧ ∇) o.s.frv. Er geymt í meginhlutanum.

Önnur mínúta: þættir eða merki birtast mörgum sinnum

gildi gildi
  1. Fyrsti þátturinn er sjálflokandi þáttur þar sem við segjum vafranum eitthvað sem hefur ekkert gildi. Dæmi um þetta er þetta Element sem setur inn línuskil.
  2. Seinni þátturinn er sameiginlegur þáttur þar sem við miðlum gildi sem tilheyrir frumefni. Til dæmis er Halló heimur! gildið „Halló, heimur!“ sem tilheyrir málsgreininni.
  3. Að lokum höfum við þátt með eiginleika. Og eiginleiki er það sem það hljómar - fjandinn hafi það eiginleiki! Það gefur þætti meira samhengi eða merkingu. Eiginleikar geta haft mörg gildi og þættir geta haft marga eiginleika. Eigindaforsenda.
gildi

Nú - ég verð að nefna það - skulum ekki búa til nöfn HTML þáttanna okkar. Við fáum þau að láni frá lista yfir yfir 100 fyrirfram skilgreind atriði. Þetta auðveldar auðvitað hluti og aðra miklu erfiðara, eins og að leggja á minnið!

Þriðja mínúta: Hvernig samskipti HTML og CSS eru