Webdesigners guide til Tumblr

Denne artikel dukkede først op i Opgave 213 af .net magazine - verdens bedst sælgende magasin til webdesignere og udviklere.

Hvor mange gange har du sagt, 'Dette er året, hvor jeg endelig starter en blog'? Som mange begynder du den langvarige og vanskelige proces med at designe et websted til den sværeste klient - dig selv - kun for at se det bevæge sig bagefter hver gang rigtige, betalende kunder kommer i vejen.



Når du endelig sømmer designet, begynder processen med at opbygge og udvikle din blog. Efter uger (eller måneder) er det endelig tid til at trykke på startknappen. Et eller andet sted mellem dit fjerde og femte indsigtsfulde og strålende indlæg rammer det dig ... at holde denne blog opdateret vil tage en enorm mængde arbejde.



Personligt har jeg fundet mig fanget i den nøjagtige cyklus mere end en gang gennem årene. I begyndelsen af ​​2009 kom jeg til erkendelsen af, at jeg var nødt til at genoverveje nøjagtigt, hvad jeg forsøgte at opnå med en personlig blog. Ideen om at skrive lange blogindlæg et par gange om ugen lyder fantastisk, men for mig var det simpelthen ikke realistisk. Jeg tweetede allerede, men hvad jeg virkelig havde brug for, var evnen til at dele lidt mere med korte, direkte og nøjagtige indlæg. Min søgen efter enkelhed førte mig direkte til Tumblr .

bedste interne harddisk til musikproduktion

Kom godt i gang

Den 6. april 2009 tilmeldte jeg mig en konto og begyndte at sende. Ved hjælp af Tumblr's Theme Garden valgte jeg et grundlæggende tema, som jeg vidste, at jeg kunne leve med, mens jeg gav Tumblr en prøvekørsel. Enkelheden af ​​platformen betød også, at jeg ikke behøvede at bekymre mig om at installere blogging-software på min server. Jeg lægger alt for at kurere indhold om design, kultur, teknologi og forretning sammen med mine personlige tanker og meninger.



Næsten to år senere har jeg formået at holde fast ved blogging på Tumblr med tæt på 600 indlæg på mit websted kl www.jonathanmoore.com : et gennemsnit på 0,85 indlæg om dagen. I dag er jeg klar over, at enkelheden er, hvad der har hjulpet mig med at forblive konsistent med udstationering, men netværket af mennesker på Tumblr er det, der holder mig begejstret for platformen. Tumblr forenkler den typiske blog, hvilket gør blogging smukt let. Millioner af mennesker over hele kloden deler ting, de gør, elsker, finder og skaber.

En Tumblr-blog giver utrolig stor fleksibilitet, hvis du kommer under hætten

En Tumblr-blog giver utrolig stor fleksibilitet, hvis du kommer under hætten

Kernen i Tumblr er otte indlægstyper - tekst, foto, citat, link, chat, lyd, video og besvarede spørgsmål - som du kan offentliggøre på instrumentbrættet. Dette gør det let at dele alt, hvad du finder eller opretter. Hvis du sender en video, er selve videoen det primære emne, og du kan derefter tilføje en valgfri billedtekst for at give kontekst, indsigt eller detaljer om den. Det samme gælder for andre indlægstyper, med undtagelse af tekstindlæg, som gør det muligt for dig at oprette mere typiske blogindlæg med en kombination af tekst, billeder og video i det enkelte indlæg.



Ikke kun forenkler Tumblr posttyperne, det giver dig også en bred vifte af måder at sende til din blog. Personligt har jeg en tendens til at bruge Dashboard det meste af tiden, men der er en række andre måder at sende indhold til din blog på.

  • Bookmarklet, som giver dig mulighed for at sende indlæg direkte fra din browser, mens du surfer på nettet
  • Mobilapplikationer til iPhone, BlackBerry og Android
  • Sofistikeret e-mail-udgivelse for at sende tekst, fotos, MP3'er eller videoer direkte fra din mobiltelefon eller via e-mail
  • Ring til lydindlæg med et gratis nummer
  • Mange andre tredjepartsapplikationer ( www.tumblr.com/docs/da/apps )

For flere detaljer om de forskellige måder at sende til Tumblr, se www.tumblr.com/goodies .

Samfundet

Sikker på, du kan bruge Tumblr simpelthen som en måde at opdatere din blog på, men du vil gå glip af det rige og fascinerende Tumblr-samfund. Den virkelige sjov begynder, når du følger en håndfuld interessante, inspirerende og ligesindede mennesker. Og når din blog har opbygget en anstændig tilhænger, er det fantastisk at se, hvor hurtigt et indlæg kan sprede sig over platformen med likes og reblogs.

Uden for at følge kendte mennesker på Tumblr er den indbyggede bibliotek en fantastisk måde at opdage nye mennesker på platformen. Kataloget er opdelt i næsten 50 kategorier, der dækker en bred vifte af emner, herunder designere, udviklere, iværksættere, startups, arkitektur, nonprofit og rejser. Brug en time eller to på at gennemse blogs, der anbefales af samfundet, og snart har du en fremragende gruppe af websteder, der skal følges som udgangspunkt.

Tumblr har bygget på en række måder til at belønne folk, der sender originalt, inspirerende, kreativt og interessant indhold til deres blogs. Det mest synlige ville være likes og reblogs. Øverst på hver blogs permalink-side og på instrumentbrættet finder du et hjerteikon til at 'like' indlægget. Hvis du støder på et indlæg, som du synes er værd at dele, eller hvis du vil føje dine egne tanker til det, kan du reblogge indlægget til din egen blog. Reblogging er den måde, hvorpå en idé eller et postmeme hurtigt spreder sig over et netværk af tusinder af blogs.

Bliver mobil

Standardmobillayoutet i Tumblr

Standardmobillayoutet i Tumblr

Hurtigere end vi er klar over, begynder folk at droppe deres bærbare computere til fordel for mobile enheder, så Tumblr har oprettet mobilapplikationer og mobiloptimerede bloglayouts. Applikationer til iPhone-, BlackBerry- og Android-platforme giver dig mulighed for at gennemse dit Dashboard og offentliggøre alle indlægstyper direkte fra din telefon. IPhone- og Android-applikationerne giver dig adgang til Tumblrs avancerede bogføringsmuligheder - gem som kladde, tilføj til kø, udgiv på og tilpasset webadresser.

E-mail dine indlæg direkte til din blog med Tumblrs sofistikerede e-mail-udgivelse. Gå til Goodies-siden ( tumblr.com/goodies ) for at finde ud af dit websteds unikke e-mail-adresse.

gør dig selv til en superhelt-app

Når du trykker på send, registrerer Tumblr automatisk typen af ​​indlæg, du prøver at oprette, og offentliggør det på dit websted. Hvis du vil have lidt mere kontrol over formateringen, har Tumblr understøttelse af Markdown-syntaks ( daringfireball.net/projects/markdown/syntax ).

Alle dine blogs har et optimeret og smukt mobillayout til iPhone, BlackBerry, Android og mere. Hvis det tema, du bruger, fungerer godt i mobilbrowsere, kan du altid deaktivere det optimerede layout i menuen Tilpas. Tumblr giver dig også muligheden for at overskrive standardmobillayoutet med din egen brugerdefinerede: se tumblr.com/docs/da/custom_themes#iphone-themes .

Temaer

Med Tumblrs dedikation til at holde alle posttyper så enkle som muligt, er det utroligt nemt at ændre dit websteds design. Du kan vælge blandt de hundredvis af gratis og premium-temaer, der er indbygget i Tumblr; alternativt giver Tumblr dig fuld kontrol over at skabe noget originalt.

I øjeblikket er der næsten 900 temaer af høj kvalitet i Tumblrs indbyggede temahave ( tumblr.com/themes ). Når du bladrer gennem de fremhævede, premium, nylige og populære temaer, kan du forhåndsvise hver enkelt for at få en fornemmelse for, hvordan det kan se ud på dit websted. Når du har fundet en, der fungerer for dig, kan du med et enkelt klik installere temaet på et af dine Tumblr-steder.

hvordan man maler figurer i akryl

I øjeblikket er der næsten 700 temaer af høj kvalitet i Tumblr

I øjeblikket er der næsten 700 temaer af høj kvalitet i Tumblr's Theme Garden

De fleste af disse temaer er helt gratis at bruge og tilpasse, men en håndfuld har en præmie, der koster $ 9, $ 19 eller $ 49 ( tumblr.com/themes/premium ). Du finder ud af, at de fleste af premium-temaerne har design i topkvalitet, hver Tumblr-funktion er omfattet, snesevis af tilpasningsmuligheder og sprogoversættelsessupport til engelsk, fransk, tysk, italiensk og japansk. Plus de fleste af de premium tema designere tilbyder utrolig support til hvert af deres temaer.

Uden for Tumblrs officielle Theme Garden tilbyder virksomheder, der traditionelt har fokuseret på WordPress-temaer, nu Tumblr-versioner, herunder The Theme Foundry ( themefoundry.com ) og Obox ( obox-design.com ). I mange tilfælde tilbyder de yderligere godbidder med dit køb, såsom PSD-filer, der kan downloades, og adgang til andre temaer. Selvom temaer uden for webstedet ikke kan tilbyde installation med et enkelt klik, er det så simpelt at tilføje temaet til dit websted som at indsætte temaet HTML i menuen Tumblr Tilpas.

Tilpasning af dit websted

Tumblr har en utrolig nyttig indbygget tilpasningsmenu, der giver dig mulighed for at personalisere, udvide og kontrollere en række funktioner til hvert af dine websteder. Lad os se på et antal af mulighederne i de syv Tilpas menuer:

  • Info Indstil dit websteds titel, tilføj en HTML-beskrivelse, upload et portræt eller ikon, og indstil din Tumblr URL inklusive muligheden for at tilføje dit eget brugerdefinerede domænenavn.
  • Tema Få vist, installer og køb i nogle tilfælde et af premium- eller featured Tumblr-temaer. Derudover kan du klikke på knappen Brug tilpasset HTML for at ændre dit eksisterende temas HTML eller indsætte i dit eget tilpassede HTML-tema.
  • Udseende Hvis dit tema understøtter udseendeindstillinger, finder du et antal farvevælgere, knapper til upload af billeder, muligheder for at aktivere og tekstfelter til at tilpasse udseendet og følelsen af ​​dit tema. Mange af de premium Tumblr-temaer tilbyder flere dusin muligheder, der giver dig mulighed for at ændre temaets farver, uploade headerbilleder, ændre webstedslayoutet og integrere tredjepartsindstillinger som Google Analytics, Disqus-kommentarer og Flickr-billedfeeds ved at indsætte i din ID'er.
  • sider Føj yderligere statiske sider til dit websted, der er perfekte til biografier, kontaktoplysninger og webstedsoplysninger. Derudover kan du omdirigere sider, der fører dig til eksterne links eller ofte til pseudokategorier ved at linke til en tag-URL på dit websted.
  • Tjenester Forbind dit Tumblr-sted med Facebook og tilføj dine indlæg problemfrit til dit Facebook-nyhedsfeed. Giv Tumblr tilladelse til automatisk at sende dine indlæg til Twitter og bruge Feedburner til dit websteds RSS-feed. Tumblr giver dig også mulighed for automatisk at importere RSS-feeds, opdateringer på Twitter, blogindlæg uden for Tumblr, YouTube- og Vimeo-uploads og andre som indlæg til dit Tumblr-websted.
  • Fællesskab Giv folk mulighed for at svare på dine indlæg, stille dig spørgsmål og indsende enhver posttype, der føjes til din indsendelse kø til godkendelse.
  • Fremskreden Indstil dit tema og Dashboard-sprog til engelsk, fransk, tysk, italiensk eller japansk, tilføj tilpasset CSS for at overskrive et af temaets CSS-egenskaber, bestem antallet af indlæg, der vises pr. Side og mange andre muligheder.

Brugerdefinerede temaer

Det samme fokus på enkelhed og struktur, som Tumblr giver til udstationering og deling, fortsætter med værktøjet til at oprette dit eget brugerdefinerede tema. Så længe du er fortrolig med HTML og CSS, skal du være i stand til at give dit design liv på rekordtid. Tumblrs temasystem er afhængig af krøllede parentesvariabler og blokke, der gør det muligt for dig at falde i stort set alle typer post- og websteddata uden udvikling af back-end.

Når du opretter et nyt Tumblr-tema, er det altid nemmest at opbygge dit design med ren og ligetil HTML og CSS, der dækker de otte centrale posttyper - tekst, foto, citat, link, chat, lyd, video og svar - og alle de andre forskellige Tumblr-elementer såsom post tags, datoer, noter og pagination. Når du har en komplet statisk HTML-opbygning af dit websted, kan du begynde den sjove del af at slippe temavariablerne. Variabler (i fed skrift) bruges til at indsætte dynamiske data i dit tema.

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

Blokke

Ud over temavariablerne bruger Tumblr et system med blokke til at gengive HTML-blokke relateret til et specifikt datasæt, såsom indlæg, posttyper, tags og paginering.

hvordan man photoshop et objekt i et billede

Blokke bruges enten som betingede elementer, der kun gengives, hvis datatypen findes - {block: HasTags} - eller de fungerer som en sløjfe, der gengiver HTML for hvert af elementerne i blokken: {block: Tags}.

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

Her er eksempler på grundlæggende tekst- og fotostillingsstrukturer, som du måske bruger til at oprette din skabelon. (Bemærk, at jeg bruger de nye HTML5-elementer, der gør HTML meget lettere at læse og dataattributter, der kan bruges som kroge til jQuery / JavaScript-manipulation af det tema, du vælger.)

Tekst:

{block:Text} {block:Title}

{Title}

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

Foto:

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

Få fart på alle de andre typer blokke, variabler og data for at skabe noget godt til din blog ved at gå her: tumblr.com/docs/da/custom_themes .

Tjek de 40 bedste Tumblr-blogs til designere på vores søsterside Creative Bloq.