Veebidisaineri juhend Tumblrile

See artikkel ilmus esmakordselt väljaanne 213 of .net ajakiri - maailma enimmüüdud ajakiri veebidisaineritele ja -arendajatele.

Mitu korda olete öelnud: 'See on aasta, mil ma lõpuks blogi alustan'? Nagu paljud, alustate ka kõige keerulisema kliendi - iseenda jaoks - pika ja keerulise saidi kujundamise protsessi, et jälgida, kuidas see iga kord reaalseks maksab, kui maksvad kliendid takistavad.

Kui olete kujunduse lõplikult välja joonistanud, algab teie ajaveebi koostamise ja arendamise protsess. Pärast nädalaid (või kuid) on lõpuks aeg vajutada käivitusnuppu. Kusagil teie neljanda ja viienda läbinägeliku ja geniaalse postituse vahel tabab see teid ... Selle ajaveebi ajakohasena hoidmine võtab tohutult palju tööd.



Isiklikult olen aastate jooksul sattunud just sellesse tsüklisse lõksu. 2009. aasta alguses jõudsin arusaamisele, et pean mõtlema läbi täpselt selle, mida püüdsin isikliku ajaveebiga saavutada. Idee kirjutada pikki blogipostitusi paar korda nädalas kõlab hämmastavalt, kuid minu jaoks ei olnud see lihtsalt realistlik. Ma juba säutsusin, aga mida ma tegelikult vajasin, oli oskus jagada lühikeste, otseste ja täpselt postitustega veidi rohkem. Minu lihtsuse otsimine viis mind otse Tumblr .

parimad graafilise disaini monitorid 2017

Alustamine

6. aprillil 2009 registreerusin konto ja hakkasin postitama. Tumblri teemaaeda kasutades valisin põhiteema, millega teadsin, et saan elada, kui andsin Tumblrile proovisõidu. Platvormi lihtsus tähendas ka seda, et ma ei pidanud muretsema blogimistarkvara installimise pärast oma serverisse. Ma panustasin kõik oma jõupingutused disaini, kultuuri, tehnoloogia ja äri sisu kureerimisse koos oma isiklike mõtete ja arvamustega.

Peaaegu kaks aastat hiljem olen suutnud jääda oma veebisaidil Tumblris olevale blogimisele ligi 600 postitusega www.jonathanmoore.com : keskmiselt 0,85 postitust päevas. Täna olen aru saanud, et postitustega järjepidevana püsimisel on mind aidanud lihtsus, kuid Tumblri inimeste võrgustik on see, mis mind platvormi vastu põnevil hoiab. Tumblr lihtsustab tüüpilist ajaveebi, muutes blogimise ilusti lihtsaks. Miljonid inimesed kogu maailmas jagavad asju, mida nad teevad, armastavad, leiavad ja loovad.

Tumblri ajaveeb annab hämmastavalt palju paindlikkust, kui jõuate kapoti alla

Tumblri ajaveeb annab hämmastavalt palju paindlikkust, kui jõuate kapoti alla

Tumblri keskmes on kaheksa postitüüpi - tekst, foto, tsitaat, link, vestlus, heli, video ja vastatud küsimused -, mille saate juhtpaneelil avaldada. See muudab kõik, mida leiate või loote, naeruväärselt lihtsaks jagamine. Kui postitate video, on video ise peamine teema ja seejärel saate konteksti, ülevaate või selle üksikasjade lisamiseks lisada valikulise pealkirja. Sama kehtib ka muude postitustüüpide kohta, välja arvatud tekstipostitused, mis võimaldavad teil luua ühes postituses tüüpilisemaid ajaveebipostitusi teksti, piltide ja video kombinatsiooniga.

Tumblr mitte ainult ei lihtsusta postituste tüüpe, vaid pakub ka mitmesuguseid võimalusi oma blogisse postitamiseks. Isiklikult kipun enamasti juhtpaneeli kasutama, kuid teie blogisse sisu postitamiseks on mitmeid muid võimalusi.

  • Järjehoidja, mis võimaldab veebis surfamise ajal postitada otse oma brauserist
  • Mobiilirakendused iPhone'ile, BlackBerryle ja Androidile
  • Keerukas e-kirjade avaldamine teksti, fotode, MP3-de või videote postitamiseks otse oma mobiiltelefonist või e-posti teel
  • Helista helipostitused tasuta numbriga
  • Paljud muud kolmandate osapoolte rakendused ( www.tumblr.com/docs/en/apps )

Lisateavet Tumblrisse postitamise erinevate viiside kohta leiate www.tumblr.com/goodies .

nintendo mängu ja vaata eesli kongi

Kogukond

Muidugi, võite kasutada Tumblri lihtsalt oma ajaveebi värskendamise viisina, kuid jätaksite ilma rikkast ja põnevast Tumblri kogukonnast. Tõeline lõbu algab siis, kui jälgite käputäit huvitavaid, inspireerivaid ja sarnaselt meelestatud inimesi. Ja kui teie ajaveeb on kogunud korraliku jälgija, on hämmastav näha, kui kiiresti postitus võib platvormil levida koos meeldimiste ja ümberblogidega.

Lisaks tuntud inimeste jälgimisele Tumblris on sisseehitatud kataloog suurepärane võimalus platvormil uute inimeste avastamiseks. Kataloog on jaotatud peaaegu 50 kategooriasse, mis hõlmavad laia valikut teemasid, sealhulgas disainerid, arendajad, ettevõtjad, alustavad ettevõtted, arhitektuur, mittetulundusühingud ja reisimine. Veenduge tund või kaks kogukonna soovitatud ajaveebide sirvimisel ja peagi on teil lähtepunktiks suurepärane saitide rühm.

Tumblr on loonud mitmeid viise, kuidas premeerida inimesi, kes postitavad oma ajaveebidesse originaalset, inspireerivat, loovat ja huvitavat sisu. Kõige ilmsemad oleksid meeldimised ja ümberblogid. Iga ajaveebi püsilingi lehe ülaosast ja juhtpaneelilt leiate südame ikooni postituse meeldimiseks. Kui leiate postituse, mida teie arvates tasub jagada või soovite sellele oma mõtteid lisada, saate postituse oma blogis uuesti blogida. Ümberkujundus on viis, kuidas idee või postitusmeem levib kiiresti tuhandete ajaveebide võrgus.

Mobiilseks muutumine

Vaikimisi mobiilipaigutus Tumblris

Vaikimisi mobiilipaigutus Tumblris

Kiiremini, kui me sellest aru saame, hakkavad inimesed oma sülearvuteid mobiilseadmete kasuks kaevama, nii et Tumblr on loonud mobiilirakendused ja mobiilile optimeeritud ajaveebipaigutused. Rakendused iPhone, BlackBerry ja Android platvormidele võimaldavad teil sirvida oma juhtpaneeli ja avaldada iga postituse tüüp otse telefonist. IPhone'i ja Androidi rakendused võimaldavad teil pääseda juurde Tumblri täpsematele postitamisvalikutele - salvestada mustandina, lisada järjekorda, avaldada ja kohandatud postitada URL-e.

Saatke oma postitused Tumblri keeruka e-kirjade avaldamise kaudu otse oma ajaveebi. Minge maiuspalade lehele ( tumblr.com/goodies ), et teada saada oma saidi ainulaadne e-posti aadress.

Kui vajutate nuppu Saada, tuvastab Tumblr automaatselt teie loodud postituse tüübi ja avaldab selle oma saidil. Kui soovite vormindamise üle veidi rohkem kontrolli, on Tumblril tugi Markdowni süntaksile ( daringfireball.net/projects/markdown/syntax ).

Kõigil teie ajaveebidel on optimeeritud ja ilus mobiilne paigutus iPhone'ile, BlackBerryle, Androidile ja muule. Kui teie kasutatav teema töötab hästi mobiilibrauserites, saate optimeeritud paigutuse alati menüüs Kohanda keelata. Tumblr annab teile ka võimaluse mobiilseadmete vaikepaigutuse oma kohandatud kujundusega üle kirjutada: vt tumblr.com/docs/en/custom_themes#iphone-themes .

Teemad

Kuna Tumblr on pühendunud kõigi postituste tüüpide võimalikult lihtsale hoidmisele, on teie saidi kujundust ülimalt lihtne muuta. Saate valida sadade Tumblrisse sisseehitatud tasuta ja esmaklassiliste teemade hulgast; teise võimalusena annab Tumblr teile täieliku kontrolli luua midagi originaalset.

Praegu on Tumblri sisseehitatud teemaaias peaaegu 900 kvaliteetset teemat ( tumblr.com/themes ). Esiletõstetud, esmaklassiliste, hiljutiste ja populaarsete teemade sirvimisel saate igaühe eelvaadet saada, et tunda, kuidas see teie saidil välja näeb. Kui leiate endale sobiva, saate ühe hiireklõpsuga teema installida oma mis tahes oma Tumblri saidile.

Praegu on Tumblri teemaaias ligi 700 kvaliteetset teemat

Praegu on Tumblri teemaaias ligi 700 kvaliteetset teemat

Enamik neist teemadest on täiesti tasuta kasutamiseks ja kohandamiseks, kuid käputäis on lisatasu eest, mis maksab 9, 19 või 49 dollarit ( tumblr.com/themes/premium ). Leiate, et enamikul esmaklassilistel teemadel on tippkvaliteediga kujundus, kõik Tumblri funktsioonid on kaetud, kümned kohandamisvõimalused ja inglise, prantsuse, saksa, itaalia ja jaapani keele tõlketugi. Lisaks pakuvad enamik esmaklassilisi kujunduskujundajaid oma teemadele uskumatut tuge.

Väljaspool Tumblri ametlikku teemaaeda pakuvad ettevõtted, kes on traditsiooniliselt keskendunud WordPressi teemadele, Tumblri versioone, sealhulgas teematehast ( thethemefoundry.com ) ja Obox ( obox-design.com ). Paljudel juhtudel pakuvad nad teie ostuga täiendavaid hüvesid, näiteks allalaaditavaid PSD-faile ja juurdepääsu muudele teemadele. Kuigi saidivälised teemad ei saa pakkuda ühe klõpsuga installimisi, on teema lisamine oma saidile sama lihtne kui HTML-i kleepimine menüüsse Tumblr Customize.

Saidi kohandamine

Tumblril on uskumatult kasulik sisseehitatud menüü Kohanda, mis võimaldab teil iga saidi jaoks mitmeid funktsioone isikupärastada, laiendada ja juhtida. Vaatame mitmeid seitsmes menüüs Customize saadaolevaid võimalusi:

filmid, mille pealkirjas on loend
  • Info Määrake oma saidi pealkiri, lisage HTML-kirjeldus, laadige üles portree või ikoon ja määrake oma Tumblri URL koos võimalusega lisada oma kohandatud domeeninimi.
  • Teema Eelvaadake, installige ja mõnel juhul ostke üks esmaklassilistest või esiletõstetud Tumblri teemadest. Lisaks võite olemasoleva teema HTML-i muutmiseks klõpsata nupul Kasuta kohandatud HTML-i või kleepida omaenda kohandatud teema HTML-i.
  • Välimus Kui teie teema toetab välimusvalikuid, leiate hulgaliselt värvivalijaid, pildi üleslaadimise nuppe, lubamisvalikuid ja tekstivälju teema välimuse kohandamiseks. Paljud esmaklassilised Tumblri teemad pakuvad mitukümmend valikut, mis võimaldavad teil muuta teema värve, laadida üles päisepilte, muuta saidi paigutust ja integreerida kolmandate osapoolte valikuid, nagu Google Analytics, Disquse kommentaarid ja Flickri pildivood, kleepides oma ID-d.
  • Lehed Lisage oma saidile täiendavaid staatilisi lehti, mis sobivad ideaalselt elulugude, kontaktandmete ja saidi üksikasjade jaoks. Lisaks saate oma saidi sildi URL-ile linkides suunata lehti, mis viivad teid välistele linkidele või sageli pseudokategooriatele.
  • Teenused Ühendage oma Tumblri sait Facebookiga ja lisage sujuvalt postitused oma Facebooki uudistevoogu. Lubage Tumblril teie postitused automaatselt Twitterisse saata ja oma saidi RSS-voo jaoks kasutada Feedburnerit. Tumblr annab teile ka võimaluse importida RSS-vooge, värskendusi Twitteris, ajaveebipostitusi väljaspool Tumblri, YouTube'i ja Vimeo üleslaadimisi ning muid postitusi teie Tumblri saidile.
  • Kogukond Lubage inimestel teie postitustele vastata, teile küsimusi esitada ja esitada kõik teie postitusjärjekorda lisatud postitustüübid kinnitamiseks.
  • Täpsem Määrake oma teema ja juhtpaneeli keeleks inglise, prantsuse, saksa, itaalia või jaapani keel, lisage kohandatud CSS-i teema CSS-i atribuutide ülekirjutamiseks, lehel kuvatavate postituste arvu määramiseks ja paljudeks muudeks valikuteks.

Kohandatud teemad

Sama keskendumine lihtsusele ja struktuurile, mille Tumblr postitamiseks ja jagamiseks pakub, jätkub ka teie enda kohandatud teema loomise tööriistaga. Niikaua kui HTML-i ja CSS-iga olete rahul, peaksite saama oma disaini rekordajaga ellu äratada. Tumblri temaatiline süsteem tugineb lokkisulgude muutujatele ja plokkidele, mis võimaldavad teil sisestada praktiliselt igat liiki postituse ja saidi andmeid, ilma et arendataks back-endi.

Uue Tumblri teema loomisel on alati kõige lihtsam kujundus kujundada puhta ja arusaadava HTML-i ja CSS-iga, mis hõlmab kaheksat põhilist postitustüüpi - tekst, foto, tsitaat, link, vestlus, heli, video ja vastus - ja kõik muud mitmesugused Tumblri elemendid, näiteks postitussildid, kuupäevad, märkmed ja lehitsemine. Kui teil on saidi täielik staatiline HTML-i ülesehitamine, võite alustada teemamuutujate sisse lükkamise lõbusat osa. Muutujaid (rasvases kirjas) kasutatakse dünaamiliste andmete lisamiseks teie teemasse.

{Title} {block:Posts} block:Posts}

Plokid

Lisaks teemamuutujatele kasutab Tumblr plokksüsteemi HTML-i plokkide renderdamiseks, mis on seotud konkreetse andmekogumiga, näiteks postitused, postituste tüübid, sildid ja lehitsemine.

parim punkt- ja võttekaamera 2018

Blokeeringuid kasutatakse tingimuselementidena, mis renderdatakse ainult siis, kui andmetüüp on olemas - {block: HasTags} - või need toimivad tsüklina, mis renderdab HTML-i iga ploki elemendi jaoks: {block: Tags}.

{block:HasTags}
    {block:Tags}
  • {Tag} {/block:Tags}
{/block:HasTags}

Siin on näited põhiteksti- ja fotopostitusstruktuuridest, mida võite malli loomiseks kasutada. (Pange tähele, et kasutan uusi HTML5-elemente, mis muudavad HTML-i palju hõlpsamini loetavaks, ja andmete atribuute, mida saab konksudena kasutada teie valitud teema jQuery / JavaScripti manipuleerimiseks.)

Tekst:

{block:Text} {block:Title}

{Title}

{/block:Title} {Body} {/block:Text}

Foto:

{block:Photo} {LinkOpenTag}{LinkCloseTag}{block:Caption} {Caption}{/block:Caption} {/block:Photo}

Hoogustage kõigi muude plokkide, muutujate ja andmete kasutamist, et oma blogi jaoks midagi suurepärast luua, suunates siia: tumblr.com/docs/et/kohandatud_teemad .

Vaadake 40 parimad Tumblri ajaveebid disaineritele meie sõsarsaidil Creative Bloq.