Hvernig á að gera kóðann þinn auðveldan að halda áfram með leiðbeiningum um lifandi stíl
Stílleiðsögumenn frá yesteryear eru yfirleitt hönnuð sem hönnunargreinar með áherslu á vörumerki og litavinnslu. En með tilkomu geðveikra stóran kóða fyrir vefsíður eins og Facebook eða fjölbreytt úrval af vörum Google, hafa stílhermenn síðan þróast.
Þessir dagar innihalda lifandi stýrihandbækur alltaf uppfærðar heimildir um núverandi kóða og notkunartilfelli þess. Með þessum skjölum getum við skrifað miklu meira viðráðanlegan og endurnýjanlegan kóða en sjáum strax hvernig bjartsýni kóðunarstöðvarinnar er.
Hvað er í lifandi stíl fylgja?
Vinnuskilyrði stíll fylgja eru svipuð og eldri hliðstæða; Þeir innihalda lógó og vörumerki upplýsingar, lit notkun, svo og almennt yfirlit um notkun kóða. Kóðinn útlínur kafla er þar sem þú getur auðveldlega fundið afrit eða náið svipað númer og sameina það til að hámarka kóða eða sjá hluti sem eru þegar í notkun. Flestir leiðsögumenn sýna annað hvort "log" stíl nálgun þar sem hvert kóða dæmi er skjalfest, eða aðeins vísvitandi mát númer er skjalfest.
Ekki einbeita þessum leiðsögumönnum aðeins HTML og CSS, heldur einnig öðrum tungumálum sem hægt er að breyta fyrir frammistöðu eins og JavaScript og PHP. Nokkrar solid dæmi um lifandi stíl fylgja er að finna á Github , Mozilla , og MailChimp . Eins og þú getur séð frá þessum dæmum er algengt að hafa annað hvort síðu eða undir-síða til að birta notkunaratriði hlið við hlið við kóðann fyrir hverja hluti. Þetta gerir það auðvelt að fara og grípa þá þegar þú þarfnast þeirra og fyrir framandi hönnuði eða forritara til að sjá hvernig hluti virka á gagnvirkan hátt.
Byrjun þína eigin lifandi stíl fylgja
Upphaf eigin búnaðarleiðbeiningar frá grunni getur virst skelfilegur, sérstaklega fyrir stærri verkefni. En venjulega er það ávöxtun fjárfestingarinnar tíma sem þarf til að fá það gert. Stærri verkefni njóta góðs af lifandi skjölum um stíll og uppbyggingu kóða. Smærri verkefni hafa minna áberandi, en stundum samt þess virði, aftur á fjárfestingunni þinni. Í báðum tilvikum, ef þú ert að vinna að verkefnum sem einhvern tíma er hægt að afhenda öðrum hönnuði eða verktaki, mun það gera daginn til að sjá slíka skjöl.
Byrjaðu með grunninn
Hlutar sem þú notar oft eru bestir notaðir til að búa til lifandi stílhandbók, hnappar koma strax í hug. Stutt lýsing á hlutum sem þú gætir viljað íhuga skjalfestingu eru skipulagsmöguleikar (hugsanlega útlínur), leturfræði, litavarnahald, hnappar og hlekkurstíll, form stíl, tilkynningar eða tilkynningar og lista stíl. Rétt er að bæta um allt sem gæti haft hag af því að vera endurnýtanlegt. Þegar útskýringin er komin í veg fyrir að það sé sveigjanlegt. Aldrei stilla viðvörun eða hnapp sem er sérstakur fyrir eina síðu eða notkunar, nema nauðsynlegt sé. Í stað þess að bæta við breytingartímum til að byggja á grundvallaratriðum fyrir hluti eins og lit, leturfræði eða fagurfræðilegar breytingar. Þannig geturðu alltaf treyst á .flokksflokknum til að tákna samræmda breidd, hæð og texta stærð, en leyfa breytingaklúbbum að breyta hlutum sérstaklega við hvert notkunaratriði.
Markmið viðvarandi kóða
Tilgangur endurnýjanlegrar kóðans er að gera hlutina endurnýtanlegt og framtíðarsvörun. Hluti eins og tilkynningastikar, hnappar, hausar og fótur, eru frábær dæmi um endurnýjanlegan kóða - Hlutir sem þú getur notað mörgum sinnum yfir síðuna eða á sömu síðu. Ef þú ert að brjóta gömul eða þegar skrifuð kóða niður til að gera það viðhaldið eftir því, þá er það í raun frekar einfalt. Byrjaðu með því að hreinsa CSS niður í grunnatriði. Þú ættir að vera vinstri með hluti bekknum sem skilgreinir uppbyggingu hluti eins og hæð, breidd og stöðu. Þó að hægt sé að nota viðbótarbreytilegan bekk til að breyta fagurfræðilegu hlutum eins og lit eða leturfræði. Að auki, ef verkefnið þitt notar líkams-auðkenni eða kennslustund fyrir hverja síðu geturðu stíll einstaka notkunaratriði á síðu á þann hátt með þessum hætti. Vertu viss um að ekki að grípa til þessa æfingar of mikið þó, þar sem það getur auðveldlega bætt við þyngd þína í stílhandbókinni.
The KISS Principle er hönnunarregla sem vel þegið er fyrir mátþróunarferlið. Ritun einföld, viðvarandi kóða er yfirleitt auðveldast með því að halda íhlutum þínum einföldum. Þegar það kemur að einfaldleika, Ef það er hægt að gera hlutina skilvirkara og / eða nota minna kóða en að ná sama niðurstöðu, þá ætti að vera hluti okkar að skrifa til að gera það. Lokamarkmið viðhaldsaðgerða kóða uppbygging er að hafa eitthvað endurnýtanlegt, lítið og mun skilvirkari en óviðráðanleg hliðstæða.
Nafngiftarsamningar í CSS
Þegar það kemur að því að vinna með viðvarandi kóða uppbyggingu, verða nafngiftarsamningar mjög mikilvægar. Ritun lýsandi CSS flokkar mun fara langt til að tryggja að viðhalda kóðann þinn verður auðvelt verkefni. Það er engin takmörk á CSS bekknum lengd, svo nota þetta til kostur þinnar. Gakktu úr skugga um að standa við skýrar nafngiftarstefnu þó, eins og blöndunarmörk á móti undirstöðuatriðum eða úlfutilfellum samanborið við öll lágmarksnöfn getur auðveldlega orðið ruglingslegt. Það er yfirleitt góð hugmynd að gera hluti flokka þín mjög lýsandi, en gera breytingartímana minna. Hér fyrir neðan er dæmi um hnapp, einstakt notkunarregla og breytingartímar.
![]()
/ * Þetta er hluti bekknum, það ætti aðeins að innihalda grunn uppbygging reglur * /. Hnappur {sýna: blokk; breidd: 250px; hæð: 48px; lína-hæð: 48px;} / * Þetta einstaka notkun tilfelli lýsir hnappinum sem notað er á heimasíðunni * /. homepage-cta-hnappur {skjá: blokkarmargin: 0 sjálfvirkt 50px; breidd: 180px; hæð: 60px; línulengd: 60px;} / * Hér fyrir neðan eru breytingaklassar, þetta eru bætt við í viðbót við hluti flokki til að bæta við litum eða öðrum fagurfræðilegum breytingum * /. rauður (bakgrunnur: # C54F48} .rounded {border-radius: 5px;} Sjálfvirk lausn
Sjálfvirkir stýrileiðarar hafa byrjað að pabba upp til vinstri og hægri til að hjálpa ýta á stýrihandföngum. Stíll frumgerð er SASS rafall byggð af Ram Richard og Mason Wendell af Team SASS . Það er einn af þeim betri valkostum þarna úti í augnablikinu, með svipuðum rafala eins og Heilmynd , Kalei , StyleDocco , og KSS einnig sanna gagnlegt.
Sjálfvirk vs hönd-iðn
Eins og alltaf eru kostir og gallar að nota annaðhvort aðferð hér. Sjálfvirk lausnir eru fljótleg og hægt að nota eftir staðreyndina, en þau eru einnig stundum ströng. Handsmíðaðir stíllhandbækur láta þig vita að innsýn og útspil alls, en taka meiri tíma. Persónulega er handsmíðað nálgun best fyrir mig í flestum tilfellum þar sem það er sveigjanlegt hvað varðar að vinna með öðrum forriturum. En það er vissulega þess virði að prófa nokkrar af sjálfvirkum lausnum, bara til að fá hugmynd um hvernig þeir virka og hvað þeir segja um númerið þitt.
Skoðaðu kóðann þinn
Vefsíður eru aldrei lokið. Við breytum hlutum, breyting á nýjum stílum og straumum og á endanum getum við endað með mikið af kóða frá fyrri endurskoðunum. Það er mikilvægt að taka smá stund og líta aftur á "enda" hvers endurskoðunar til að ganga úr skugga um að hlutirnir séu eins hreinir og þær geta verið. Á þessum tímapunkti líkar ég líka við að henda hverjum hluti (og breytingartímum) í a Codepen til að prófa vafra stuðning og gera athugasemdir í samræmi við það. Þetta gæti sparað tonn af tíma seinna ef þú ert að hanna síðu með stuðningsþvingun. Meðan þú skoðar það skaltu einnig vera viss um að fylgjast með hlutum sem kunna að stangast á við hvert annað á ólöglegum vegum eða valda vandræðum með kassamódel.
Niðurstaða
Að lokum, stíll fylgja ætti að leiða til kóða sem er mjög manipulative og sveigjanlegur, en samt auðvelt að viðhalda og lesa. Í ljósi þess hve mikinn tíma sem við verðum að fjárfesta til að ná slíkum niðurstöðum, hafa lifandi stýrihandbækur miklu meira mælanleg áhrif á stærri verkefni en smærri. Flókin eða stór verkefni njóta góðs af öllum hagræðingu og árangri eykst, það er vel þess virði að eyða tíma til að ná árangri. Búa til lifandi stíll fylgja fyrir lítið vefsvæði eða verkefni getur ekki reynst verðugur tíminn fjárfesting þó.
Að lokum, ættum við öll að reyna að skrifa hreint, viðráðanlegt kóða sem leggur áherslu á framtíðarsvörun. Vinnuskilyrði stíll leiðsögumenn hafa tilhneigingu til að hvetja slíka workflow og aide í því að gera forritara og áhorfendur jafn mikið hamingjusamari.