Substack
i-inki yeorenji edesikeni eofisini yokuhlela
I-Substack ifana nedeshibhodi yeendaba egugileyo—ikhanvasi emhlophe, umbhalo ofudumeleyo, phantse omnyama, kunye ne-accent enye ekhanyayo yeorenji ephawula inqanaba ngalinye lokudalwa komxholo. Ulawulo olubonakalayo lwakhiwe ngokuxinana kunokuba luhombise: imigca emincinci engwevu yahlula izinto zokutya, ii-avatars zincinci, i-metadata ayisebenzi, kwaye iliso lomfundi liqeqeshwe ukugxila kwi-orenji yokubiza isenzo, ilogo yeorenji, ikhonkco yeorenji ethi "Subscribe", kunye neqhosha yeorenji elithi "Dala". Iindawo zigcinwa zithe tyaba kwaye zingathintelwanga—akukho zithunzi zekhadi, akukho zinto zephaneli ye-chrome—okuvumela ubhalo (into ye-UI yenkqubo ye-chrome encinci edibene nefonti yesihloko se-serif) ithwale ubunzima bokuhlela. Isitayile esityikityiweyo zizinto ze-chrome ezithintelweyo kunye ne-pops ekhanyayo, enombala omnye: i-app yokufunda evakala ngathi sisixhobo sokupapasha.
Uyilo lwedesktop oluneekholamu ezintathu: i-sidebar ekhohlo engaguqukiyo (~200px, ukuhambahamba okuneempawu kunye neelebhile, okunamathelayo), i-feed ephakathi (ububanzi obuphezulu ~600px, uluhlu lwezithuba eziskrolwayo ngokuthe nkqo), kunye ne-sidebar esekunene engaguqukiyo (~300px, ukukhangela + iingcebiso + ubhaliso). I-feed ephakathi yeyona nto iphambili yokuhlela—akukho makhadi, kukho izithuba ezibekwe phezu kwenye kunye nezahluli ezincinci kunye nezithuba ze-32px phakathi kwamacandelo. Ibhena ephambili ihleli phezulu kwe-feed njengekhadi elinye elibanzi. I-sidebar ekhohlo inelogo yophawu (uphawu olu-orenji olunemigca egqunyiweyo), izinto ezintandathu zokuhambahamba, kunye neqhosha eli-orenji elibanzi "Dala" ezantsi. I-sidebar ekunene inentsimi yokukhangela, ikhadi lokubhalisa, kunye noluhlu lwe-"Up Next" lokufunda. Ukuhambahamba kuncinci—akukho bha ephezulu, akukho breadcrumbs; i-sidebar YI-navigation. Uxinano lomxholo luphezulu: izithuba zisebenzisa i-metadata ye-12-13px kunye nombhalo womzimba we-15-19px, zenza isigqi esifana nephephandaba endaweni yokuziva kwegridi yamakhadi emarike.
Iifoto zizinto eziveliswa ngabasebenzisi (ii-avatars zombhali, ii-thumbnails zeposi, imifanekiso yeposi)—I-Substack ayiboneleli ngeefoto zayo zokuhombisa. Ikhadi eliphambili lisebenzisa i-turquoise ukuya kwi-green gradient enezinto ezingabonakaliyo zokubonisa (iimilo zejiyometri, izinto ezenziwe ngesitayile ezifana neepeni kunye namanqaku) njengemvelaphi. Ii-thumbnails zeposi kwi-sidebar yasekunene zincinci (64px), zifakwe kwi-radius ye-8px, kwaye zisebenza njengemboniso yoluhlu lokufunda. Ulwimi olubonakalayo lusekelwe kumbhalo: ujongano luyi-canvas yokufunda, kwaye imifanekiso isebenza njenge-anchors ezincinci ezibonakalayo endaweni yokudala umoya.
Iphalethi
Uphawu
- Signal Orange
#ff6719— Iorenji isetyenziswa njengesandi sesibini seenkcukacha zokuhombisa kunye nokugqamisa iimpawu ezingaqhelekanga. Akufanele isetyenziswe njengombala oyintloko wokubiza isenzo.
Ukungathathi cala
- Ink
#363737— Umbhalo womzimba—umbhalo oyintloko, izihloko, izihloko zeposi, amaxesha eesitampu, kunye namagama ababhali; umbala ofudumeleyo, ophantse ube mnyama endaweni ye-#000 ecocekileyo ukuze kube lula ukuwufunda. - Paper
#ffffff— I-page canvas, iindawo zekhadi, iindawo zokufaka, kunye nemvelaphi yokuhambahamba zezona ndawo ziphambili ezithatha uninzi lwe-interface. - Charcoal
#232525— Imeko ye-Hover ukuze ufumane umbhalo owongezelelweyo kunye neekhonkco ezinemigangatho ephezulu yokukhetha; nzulu kune-Ink mode yeebhloko zekhowudi kunye neebhloko zokukhetha. - Stone
#777777— Umbala ongathathi cala uyaxhaswa kwizinto zesibini ze-UI, izahluli, kunye neelebheli ezithuliweyo. Akufanele isetyenziswe njengombala oyintloko weefowuni eziya kwisenzo. - Ash
#b6b6b6— Imigca emincinci yomda, imida yamaqhosha, imida ye icon, imida kulawulo olungasebenziyo. - Mist
#c8c8c8— Ukwahlula imigca, imvelaphi engabonakaliyo yee icon, ukuzalisa iiseli ezingenanto ngendlela yeskeleton.
Ubhalo lweencwadi
ukusuka kwi-12 ukuya kwi-32px · amanyathelo ama-5
- system-ui — ukutshintshwa: -apple-system · imida 400, 500, 600 · Ifonti ephambili yojongano lomsebenzisi kunye nombhalo womzimba isetyenziselwa iilebhile zokuzulazula, amaqhosha, umbhalo womyalezo, i-metadata, amasimi okufaka, kunye nazo zonke izinto zojongano. Ubungakanani obuncinci be-12-13px kwi-metadata kunye ne-15-19px yombhalo womzimba zenza uvakalelo lweendaba ezixineneyo. Ubunzima buyi-400 yombhalo womzimba, i-500 yezinto zokuzulazula kunye neelebhile zamaqhosha, kunye ne-600 yezihloko zemiyalezo ezigqanyisiweyo kunye nezihloko zecandelo.
- Cahuenga — ukutshintshwa: Charter · imida 500 · Ifonti ye-serif ehonjisiweyo ehambelana nezihloko zemveliso (izihloko ezisecaleni, izihloko zekhadi lokubhalisa, umbhalo oyintloko). Ubunzima bayo obuphakathi kunye nokuphakama komgca omncinci kuyinika inkangeleko ecacileyo ngaphandle kokuziva inkulu; yifonti yodwa, ngaphandle kombala o-orenji, ebonisa ubuwena bukaSubstack.
- Spectral — ukutshintshwa: Charter · imida 400 · Ifonti ye-serif yezithuba ezinde—esetyenziswa kumagumbi okufunda nakwimixholo yeendaba ukuphucula ukufundeka kwezinto zokuhlela. Isithuba semigca esincinci kancinci (1.20) siqinisekisa ukufundwa kwemihlathi ngendlela ekhululekileyo ngelixa kugcinwa ubuncinci obuqhelekileyo kumagumbi eendaba.
Amaxesha okuphumla kunye nefom
| Injongo | Intsingiselo |
|---|---|
| Uxinano | xinene |
| Inyathelo elisisiseko | 8px |
| Irediyasi yeqhosha | 9999px |
| Irediyasi yekhadi | 12px |
| Izithunzi | akukho - imida endaweni yezithunzi |
| Phakathi kwamacandelo | 32px |
| Ububanzi bephepha | 1200px |
I-AI iza kwakha iwebhusayithi yakho ngesitayile sika- Substack ize iyizalise
- Gcwalisa iimveliso kunye nezithuba ngekhonkco - Instagram, TikTok, Facebook.
- Dlulisa umxholo usuka kwisiza sakho esidala—chaza nje idilesi.
- Uyilo lwanamhlanje kwinjini engcono kakhulu: React ( Next.js) ene-server rendering kunye ne-SEO optimization ephuma kwibhokisi.
- Ukulungiswa kwe-SEO ngokuzenzekelayo ngokupheleleyo kwiziphumo zophando kunye neengcebiso zenethiwekhi ye-neural.
Iintlobo ezifanayo
- Mollie — Ikhawuntara yekheshimere, ileja emnyama. Shiya indawo enkulu emhlophe yoyilo lomhleli olujikeleze umbhalo omnyama, uze uqinise amanqaku anxulumene nemveliso ngeekhrimu ezifudumeleyo, iibrown ze-espresso, kunye nemifanekiso echukumisayo yeendlela zokuhlawula zokwenyani.
- Kagi — Igumbi lokufundela elahlukileyo. Yenza indawo emhlophe evulekileyo ejikeleze umbhalo wegrafiti ongqindilili, usebenzisa imibala emfusa ethambileyo kunye neendawo ezifudumeleyo zepastel ukuze uchithe uxolo.
- Milanote — IMilanote sisitudiyo sobugcisa esizinikeleyo. Yenza amaphepha afana negalari yokuhlela usebenzisa iibhodi ezibonakalayo ezidadayo: iindonga ezinefreyimu emnyama, indawo yokubonisa emhlophe, kunye neeskrini ezibonakala ngathi zizinto zokwenyani ezinobunzulu obuthambileyo.
- Co2 — I-atlas yemozulu ekukhanyeni kwasebusika. Yenza amaphepha afana ne-air document landscape, apho izihloko ze-serif, idatha ebhalwe kwiindidi, kunye nemifanekiso ebandayo igxininisa imida emhlophe ebanzi.
- GitButler — I-Turquoise ekupheleni kombhalo. Indibaniselwano yeentloko ze-serif ezinemibala eqaqambileyo kunye neegridi zobugcisa ezithambileyo, iindawo ezifudumeleyo zegrafiti, kunye ne-accent ethambileyo ye-turquoise.
- ElevenLabs — Isincoko seefoto ezinemibala efudumeleyo yekhrimu enezihloko ezincinci. Incwadi yeencwadi efana neBauhaus—iphepha elinombala weqokobhe leqanda, i-inki emnyama, kunye ne-accent enye emfusa neorenji yokubonisa imveliso.
- Awesomic — I-zinc mesh yomhleli eneempawu zokubhala eziorenji ezikhumbuza i-confetti
- Monad — ijenali yobugcisa yomhleli malunga nephepha elifudumeleyo
- Dub — Iphaneli yokulawula iphepha lerayisi elingacwebezeliyo leLink
- Seline Analytics — Itheyibhile yohlalutyo ezolileyo ephepheni elifudumeleyo
- Notion — Incwadi yephepha efudumeleyo elangeni lasemini
- Anthropic — Ijenali yenzululwazi ethetha nge-vellum efudumeleyo—imiphezulu ezolileyo ye-ivory, izihloko zomhleli ezicacileyo, kunye nesimbo esinye sodongwe esibonakala kuphela xa kufuneka isenzo.