Sådan opbygges en hjemmeside i 2021 i 6 trin. En A til Å Guide

tilbage i 2017 var der en mulighed hos det firma, jeg arbejdede i for at lære internetdesign.

jeg begyndte at lære HTML, CSS og Javascript. Jeg nød det stort set. Indtil jeg løb ind i mine første bugs. Senere fik jeg tildelt et sideprojekt: en faktisk hjemmeside. Jeg var begejstret, mine kolleger var der for mig, da jeg bad om hjælp.

et par måneder senere arbejdede jeg på en pro-bono-opgave for en NGO.

Lad mig oplyse, at vi var på rejsemarkedet, og jeg lavede markedsføring. Men der var denne kultur for at styrke folk i at lære nye færdigheder.

jeg er DIY-typen og indså, at læringskurven for læringskode er langt længere end forventet. Med ordtryk fungerede tingene anderledes.

hurtigt frem, i 2020 endte jeg med at arbejde for Colibri-producenterne, hvor Colibri var en populær træk og slip sidebygger.

ting er så let i dag med sådanne værktøjer. Du kan virkelig give folk mulighed for at opbygge en hjemmeside fra bunden på ingen tid. Og inspiration til hjemmesider er bare … over hele internettet.

nu, her er trin:

1. Vælg dit domænenavn
2. Anskaf hjemmeside hosting
3. bliv fortrolig med ordtryksgrænsefladen
4. installer et ordtrykstema
5. Byg din Ordtryksside
6. installer vitale plugins

fordi det at have nogle trin ikke er nok til at have en Supercalifragilistic ekspialidocious hjemmeside, har jeg en bonus til dig i slutningen af guiden: design tips og tricks.

men før jeg hopper ind i emnet, vil jeg skinne et lys på et andet emne. Det tager ikke lang tid, det lover jeg.

hvor meget koster en hjemmeside?

hvis vi skal lave en omkostningsfordeling for en hjemmeside, her er hvad vi skal medtage:

• Køb et domæne: priserne kan begynde på $ 15/år
• hosting erhvervelse: priserne starter så lavt som $8 / år
• Afhængigt af tilpasningsniveauerne og hvor mange funktioner du vil medtage, kan du starte med $0. Hvis du ikke ønsker at afregne med en grundlæggende hjemmeside, drejer årlige temaplaner sig om $70.
• plugins. Mange af dem er gratis, men hvis du vil have avancerede muligheder, skal du opgradere til en betalende plan.

dette betyder, at den mest basale hjemmeside starter fra $23/år. I det øjeblik du vil have avancerede temafunktioner, vil omkostningerne stige til omkring $100/år.

når du opgraderer plugins, kan du ende med at betale omkring $200-500 om året.

hvis du vil have noget skræddersyet, og du skal ringe til en udvikler, kan omkostningerne gå over $1000 i det første år.

for onlinebutikker kan omkostningerne stige betydeligt, fordi du har brug for masser af funktionaliteter, og ydeevne og sikkerhed er øverst i tankerne.

nu hvor vi rydder dette ud, er det tid til at komme til bunden af vores emne i dag: Sådan oprettes en hjemmeside i 2021.

Vælg dit domænenavn

kilde: https://unsplash.com/photos/N1XUwR8iOf0

hvis du ikke vidste dette endnu, er domænenavnet dit firmanavn eller Produktnavn. Navne kan være virkelig magtfulde, så vær ikke forhastet, når du vælger dit domænenavn. Hvis du føler, at du får kolde fødder, skal du ikke bekymre dig, der er værktøjer derude, der kan hjælpe dig.

Tips og tricks til Hjemmeside domænenavn valg

jeg lavede nogle brainstorming for et hjemmeside domæne for en virksomhed for et stykke tid siden og indså, at “det” lød ganske interessant. Det er kort, let at huske. Men i det øjeblik jeg googlede det, godt….lad mig sige, jeg brast i latter. I britisk slang betød det”vandladning”. Virkelig folk, gør din forskning.

senere, jeg ønskede at navngive min fotografering hjemmeside. Jeg analyserede “moonshine”. Det føltes så dejligt, romantisk, eventyrligt … undtagen det var det ikke. det ser ud til, at det betød “ulovligt destilleret eller smuglet alkohol”.

så sørg for, at din navngivning er unik, mindeværdig og ikke har nogen underlig betydning på engelsk eller et andet populært sprog (f.eks. Hvis du er en lokal virksomhed, kan du springe dette over.

lad os nu se lidt på en lille tjekliste for at vælge et domænenavn til din hjemmeside:

• lav en liste over relevante søgeord til din virksomhed/produkt. Tænk på, hvordan brugerne skal føle sig efter brug af produktet. Lad os sige, at du har en hudproduktlinje baseret på naturlige ingredienser. Din liste kan indeholde ord som” hud”,” pleje”,” sikker”,” naturlig”,” smuk”,” frisk ” osv. Brug et værktøj som f.eks.
• kontroller betydningen af dit nyligt fundne domænenavn. Jeg google det altid sådan “{indsæt navn her} betyder”. Jeg ender med ordbogsforklaringer. Næste, jeg går til Google Billeder og se, hvordan det bliver matchet. Måske er der en sanger med det navn, et manga tegneserie navn osv. I så fald skal du gentage processen.
• Kig efter domænenavnet på Facebook eller LinkedIn for at se, om der er en virksomhedsside med det navn.
• Kontroller, om der er et hjemmesidedomæne til salg. For mange sider er”. com “det bedste topdomæne (TLD) efterfulgt af”. org”,”. net “eller”. io”.
• Køb dit domænenavn. Du kan gøre det via en domæneregistrator som GoDaddy eller via din hostingudbyder.

og dette fører os til vores næste kapitel.

erhverve hjemmeside hosting

hver hjemmeside, du nogensinde har besøgt er hostet på en server. Det betyder, at du bliver nødt til at købe hosting fra en hostingudbyder.

i betragtning af at vi bygger en hjemmeside, kan du vælge en hostingplan fra WordPress.com eller en anden tredjeparts hosting udbyder.

lad mig rydde noget ud, før vi fortsætter. Der er wordpress.com og wordpress.org. forskellen er, at på WordPress.com du kan være vært og opbygge en hjemmeside. Fra WordPress.org du erhverver normalt temaer og plugins til din hjemmeside, som er hostet andetsteds. Du kan sammenligne WordPres.com planer her.

denne vejlednings hypotese er, at du virkelig ønsker at opbygge et brand og have fuld kontrol over din hjemmeside. Dette betyder, at du går til en tredjeparts hostingudbyder.

der er tre primære hostingtjenester: delt hosting, VPS og administreret hosting. I den første situation server ressourcer er opdelt blandt flere steder. I det lange løb, hvis disse sider vokser, og dine Også, du kan støde på problemer med ydeevnen. Du kan måske indse, at du har brug for en VPS-tjeneste eller en administreret hostingplan.

så du skal have dette i tankerne, når du vælger en hostingudbyder: hvad er dine forretningsmål?

hvis du går med VPS hosting, vil ressourcer stadig blive delt, men du får en vis kontrol over dem. Du vil også se forbedringer med hensyn til sikkerhed og ydeevne.

Managed hosting er kinda en “Kurt la carte” service. Du får din egen fysiske server helt til dig selv, og du vil se et løft i ydeevne og sikkerhed.

absolut kan tingene blive mere komplicerede end dette, men jeg ville bare male det store billede af hosting.

Næste, når du analyserer planerne, skal du se nærmere på:

• prissætning
• opbevaring
• Support
• ydeevne

nogle hostingudbydere har nogle ekstra funktioner pakket som domænetilbud (f.eks.

nu har du sikkert bemærket nogle hjemmesider, der bruger “HTTP” eller “HTTPS”. Hvad er der med dem?

HTTP er grundlaget for det moderne internet. Det forbinder bro.sere og servere, og fungerer på en anmodning-svar basis. Nu betyder de ekstra “s”, at forbindelsen til hjemmesiden er krypteret, og de data, der deles med hjemmesiden, er sikre.

lad os sige, at en bruger foretager en betaling på din hjemmeside eller logger ind på en konto. De oplysninger, som brugeren vil skrive i, vil være private. Sikker mod hacking. Dette sker gennem SSL-teknologien, som står for “Secure Sockets Layer.”For forbrugerne signalerer “HTTPS” tillid, fordi du kan beskytte deres data og privatliv. Det betyder, at du bliver nødt til at erhverve et SSL-certifikat.

sørg for, at din valgte plan også inkluderer dette.

i det øjeblik du erhverver din hostingplan, og du har oprettet dine loginoplysninger, vil det eneste manglende stykke være sig selv. De fleste af hostingudbyderne derude giver dig mulighed for at installere fra deres dashboard/guide. Det hele er ret intuitivt.

Hvordan vil du logge ind på din hjemmeside? Nem peasy. Du skal blot indtaste din hjemmeside adresse og tilføje til det” / “, som det ses nedenfor.

bliv fortrolig med interfacet

dashboardet har 9 sektioner. Lad os se på dem.

Indstillinger for ordtryk

inde i dette afsnit er der yderligere 7 menupunkter. Jeg beskriver kort de vigtigste ting, der skal gøres her.

• Under “Generelt” kan du oprette sidetitel, tagline, URL, tidsområde, tid & datoformat og sprog.
• under “læsning” vil du “fortælle” hvilken side der fungerer som hjemmesiden, og hvilken er din “blog”. Dette er et vigtigt skridt. Du vælger også, hvor mange blogindlæg der kan vises på en side, eller om du vil have din hjemmeside indekseret af Google.
• Under “diskussion” skal du lave blogkommentaropsætningen.
• inde i “medier” kan du indstille de maksimale dimensioner i billedpunkter, der skal bruges, når du tilføjer et billede til mediebiblioteket.
• inde i ‘Permalinks” du opretter formatet på dine URL ‘ er.
• du kan definere din privacy policy sider inde “Privacy”.

den bedste måde at nærme sig panelet “Indstillinger” er at indtaste alle disse elementer og udfylde den manglende info, bare for at sikre, at du ikke springer noget vigtigt over. Ting er ret ligetil, så få ikke kolde fødder. Alt opsætningen kan udføres på mindre end 30 minutter.

tryk på sider og indlæg

hvad du behøver at vide er, at dit indhold vil gå ind i “sider” eller “indlæg”. Her bruger du 95% af din tid.

“siderne” er statiske. Du kan have en” hjemmeside”,” tjenester “side,” Kontakt os ” side, Du får point. Under indlæg kan du få dine seneste blogartikler, måske din portefølje. Disse er dynamiske sider, fordi de automatisk placere din nyeste hjemmeside indhold øverst.

når du vælger “indlæg” fra dashboardet, vil du være i stand til at oprette et indlæg, visualisere alle indlæg og administrere tags og kategorier.

du kan oprette et nyt indlæg, hvis du vælger “Tilføj nyt” som vist ovenfor, eller gå til “alle indlæg” og derefter vælge “Tilføj nyt”.

det samme fungerer for sider.
hvad du vil se i din” alle sider “eller” alle indlæg ” er nogle standard sider og indlæg indsat af dit tema.

hvordan kan du nu redigere et indlæg eller en side?

når du holder musepekeren over dine standardsider og indlæg, vil du se nogle muligheder: Rediger, hurtig redigering, papirkurv, visning. I skærmbilledet ovenfor er der også “Rediger i Colibri”. Dette skyldes, at vi installerede et plugin, der giver dig mulighed for at tilpasse sider ved hjælp af Colibri-Ordtryksbyggeren (men vi snakker lidt senere om dette).

tryk på medier

alle dine medier går ind her: billeder og videoer. Du kan trække og slippe dem eller uploade dem.

du kan også tilføje medier fra dit indlæg/sideniveau. Jeg viser dig mere om emnet senere.

Kommentarer

det 4.dashboard-afsnit kaldes “Kommentarer”. Her kan du administrere dine indlægs kommentarer. Du modtager masser af spam-kommentarer, der kan flyttes til spam eller papirkurven. Du kan godkende de relevante.

menuen” Udseende ”

på dette niveau kan du vælge mellem:

• Søg efter, Installer og aktiver et tema (Flere detaljer i det følgende kapitel).
• Tilpas kontroller for at tilføje blokke af indhold til din sides sidebjælker, sidefødder og andre områder.
• definer din hjemmesides menuer.
• Tilføj et baggrundsbillede til din hjemmeside.
• Rediger koden for dit tema inde i “Theme Editor” (anbefales kun, hvis du er udvikler).

nu, i det øjeblik du aktiverer visse plugins, kan du muligvis se et par nye menupunkter under “Udseende”. I dette tilfælde, fordi vi har aktiveret Skyline-temaet, ser vi en mulighed for at konfigurere det under “Skyline-indstillinger”. Hvert tema kan komme med sin egen opsætning.

“installer Plugins” er det andet ekstra menupunkt tilføjet af Skyline-temaet. Her kan du se nogle plugin-anbefalinger, der fungerer godt med Skyline.

dette fører os til vores næste menupunkt.

Plugins

der er masser af funktioner, der ikke kan styres af tema kun, såsom SEO optimering, SEO revision, hjemmeside sikkerhed og back-up, tabeller, formularer, e-handel funktioner, og mere. Plugins er her for at kompensere for manglen på sådanne muligheder.

her er en lille tutorial om, hvordan du installerer, aktiverer og deaktiverer plugins. Det hele er intuitivt og brugervenligt.

brugere

på dette niveau bestemmer du, hvem der har adgang til din hjemmeside. Du kan give adgang til bidragydere, gæsteforfattere, redaktører og mere, afhængigt af dine behov.

værktøjer

under “Værktøjer” har du mulighed for at importere og eksportere værktøjsdata til og fra andre content management systemer (f.eks. Blogger).

der er også en” site health ” sektion, som viser dig kritiske oplysninger om din konfiguration og elementer, der kræver din opmærksomhed, med nogle råd.

da vi skal respektere privatlivspolitikker, kan du her eksportere eller slette personlige data til dine brugere.

og med dette har vi pakket kapitlet om dashboard.

lad os komme til mere interessant forretning.

Sådan installeres et tema

til dette skal du gå til dit admin dashboard, klikke på “udseende” fra menuen til venstre og derefter “Temaer”.

klik derefter på knappen “Tilføj ny”.
du vil se en masse skabeloner dukke op, og du kan filtrere dem efter nyeste, fremhævede, popularitet…eller efter funktioner.

vi er stolte af at sige, at vores helt egne fascinerende og Colibri temaer er opført i top 20 mest populære temaer.

i det øjeblik du vælger et tema, skal du klikke på “Installer” og derefter “Aktiver”.

du kan også aktivere dit tema, hvis du går tilbage til udseende->temaer.

hele installationsprocessen forklares også i vores tutorial.

nu er du klar til at rocke og rulle!

via GIPHY

Byg din hjemmeside

i dit design afhænger af dit valgte tema. Hvis du har brug for noget ekstra, Ja…skal du muligvis finde noget for at udfylde de manglende funktioner.

normalt har hvert tema 2 designs: en til bloggen og en til siderne. Farverne er begrænsede, der er ingen specielle tilpasninger. Dette betyder, at plugins på et bestemt tidspunkt vil være nyttige.

nu har temaer en tematilpasning med grundlæggende funktionalitet. De passer godt til dem, der ikke har brug for nogen brugerdefinerede funktioner og ønsker at opbygge deres side virkelig hurtigt. Når du har brug for det, kan du tilføje dine egne CSS-stilarter. Bare sørg for at vælge et tema, der har et layout, der matcher din egen vision.

Hvordan kan du tilpasse et tema? Bare gå over til udseende- > Tilpas.

fra venstre side kan du vælge, hvad du vil ændre: indhold, menu og meget mere. På højre side er der din hjemmeside forhåndsvisning. Du kan ændre teksten i realtid ved at klikke på blyantikonet.

på den anden side af historien har vi ordtryksbyggere. De er plugins, der hjælper dig med at opbygge helt unikke hjemmesider. Du kan ændre dit tema layout helt.

i vores tilfælde installerer Skyline en sådan bygherre kaldet Colibri, vi skal bruge det som et eksempel.

afhængigt af versionen af temaet, den gratis eller betalte, har du forskellige elementer at lege med: fra overskrifter, specifikke sidesektioner til mindre komponenter såsom opfordringer til handling, faner, tællere, harmonikaer og mere.

du kan redigere dit tema som før, fra udseende- > Tilpas, eller tag genvejen, som vist nedenfor.

hvilke ændringer? Du får adgang til flere funktioner i tilpasningen.

udover at bruge tilpasningen er der en anden mulighed for tilpasning af hjemmesiden i Standardeditoren. Du kan få adgang til det fra indstillingen “Rediger” under hvert indlæg og side. I det øjeblik du tilføjer et nyt indlæg eller en side, kommer du lige ind i standardeditoren (medmindre du har en bygherre aktiveret).

så i vores næste kapitel vil vi gå i dybden med, hvordan du:

1. Opret en hjemmeside ved hjælp af en hjemmesidebygger
2. Opret en hjemmeside ved hjælp af standardredigeringsprogrammet

A. hvordan man opbygger en hjemmeside ved hjælp af gratis hjemmesidebygere

. Du vil være i stand til at tilpasse alt: overskrifter, sideindhold, sidefødder, navigationsmenuer, global, individuel styling, you name it! Ingen design eller kodning færdigheder er nødvendige!

det er normalt en træk og slip proces. Og du behøver ikke bekymre dig om det mobile design, bygherrerne har det lydhørhedsaspekt, der er dækket.

Sådan justeres hjemmesideindstillingerne i tilpasningen

se på dit venstre sidepanel. Rul nu ned til”Generelle indstillinger”.

her er hvor du kan oprette:

• din hjemmesides navn.
• den overordnede farveskema og typografi af din hjemmeside.
• skabeloner til blog, overskrift og sidefod: hvilke baggrunde der skal bruges, mellemrum, grænser, skygger osv.
• afstand: indvendige knapper, kolonner osv.
• Custom css Styling

Sådan oprettes indhold i builders

som nævnt før, hvis du vil oprette en ny hjemmeside side, gå over til “sider” og vælg “Tilføj ny”. Du vil blive dirigeret til standard editoren, hvor du navngiver din side. Vælg derefter”Rediger med Colibri”.

når du vil redigere en eksisterende side, skal du blot klikke på “Rediger i Colibri”.

Sådan tilføjes sektioner til dine sider

hvert ” + ” -tegn i venstre sidepanel åbner et vindue med blokke og komponenter. Du kan rulle ned, indtil du finder et design, du har lyst til, eller bare skrive i en kategori. Her er de kategorier, der er tilgængelige i Colibri builder: Hero Accent, om, funktioner, indhold, opfordring til handling, Blog, tællere, portefølje, fotogalleri, udtalelser, klienter, Team, Kontakt, F. A. K. og priser.

disse er foruddefinerede skabeloner, der matcher det valgte farveskema.
ved at vælge en af blokkene, ved at klikke på ” + ” – tegnet, der vises på blokken, placeres blokken nederst på siden.

du kan flytte dem, hvor du vil, ved at trække og slippe sektionen fra venstre sidepanel.

der er også en mulighed for “tomme” blokke.

dette betyder, at du kan tilpasse dem, men du finder det passende. I sidste ende kan du endda gemme dit design til senere brug.

fra indstillingsikonet i øverste højre hjørne af hvert afsnit kan du justere antallet af elementer pr.

Sådan tilpasses sektioner på din Ordtryksside

hvis du vil ændre teksten i dine sektioner, kan du gøre det in-line, hvilket betyder inde i selve sektionen, live.

in-line redigering er ikke tilgængelig for tekster på knapper. De vil blive forvaltet i panelet til venstre.

hvis du vil ændre et billede fra din side, er det hele intuitivt. Start med at vælge dit billede.

du kan også se det inde i panelet til venstre. Klik på billedet. Du vil se et nyt vindue dukke op og bede dig om at uploade et billede eller vælge et fra biblioteket. Hvis du vælger at uploade, kan du gøre det ved at trække og slippe.

upload billeder til 6163>

nu, gå tilbage til det panel, jeg lige har nævnt, det har 3 hovedindstillinger: Layout, stil og avanceret. Når du vælger en sektion fra hjemmesiden forhåndsvisning til højre, vil du se den tilsvarende panel af afsnittet.

lad os tage dem en efter en:

• Layout

her kan du justere bredden og højden af beholderen, på struktur niveau. . Kort sagt, beholderen er den faktiske plads en blok indtager. Inde i beholderen placerer du indholdet (tekst, billeder).

du kan også justere afstanden mellem dit indhold, og hvor tæt på toppen eller bunden det bliver placeret.

du kan også tilføje nye rækker inde i din blok.

• stil

på dette niveau kan du tilpasse baggrunden for din blok eller tilføje skillevægge. Dividers er visuelle signaler, der signaliserer, når en hjemmeside sektion slutter eller begynder.

• avanceret

her kommer det sjove, folkens!

fra typografi og afstand til lydhørhed, det er her du kan komme ind i de mindste hjemmeside detaljer.

du kan oprette variationer afhængigt af elementets tilstand: normal eller svæver.

hvis du vælger et bestemt element inde i en blog, Lad os sige en overskrift, vises det samme panel til venstre.

dette betyder, at du kan gå mere detaljeret med din redigering.

når vi taler om overskrifter og mere granulære elementer, kaldes disse “komponenter”. Lad os se, hvordan du kan lege med dem.

Sådan bruger du komponenter i din hjemmeside

komponenterne henviser til overskrifter, skydere, skillevægge, knapper, karruseller, priser og meget mere. De kan fås på samme måde som blokke. De sidder side om side, og de har træk og slip funktionalitet. Colibri tilbyder 40 komponenter.

som tidligere nævnt kan du justere dem fra panelet til venstre, hvis du går til “layout”, “style” eller “avanceret”.

Mobile responsiveness

i en multi-enhed verden, er det vigtigt at have en fuldt lydhør hjemmeside. Som standard er Skyline et mobilt responsivt tema. Dette betyder, at dets sektioner justeres i henhold til forskellige enheder. Hvis du vil forhåndsvise, hvordan din hjemmeside ser ud på tablets eller mobil, kan du gøre det, når du spiller med kontrollerne nederst til venstre.

du kan også vælge at skjule visse funktioner på mobilen, f.eks.

Sådan oprettes en menu i tilpasningen

lad os nu sige, at du har designet dine sider, og at du skal føje dem til en menu. I panelet til højre har du alle dine sektioner, bestilt fra top til bund, som på din side. Sidefoden er din sidste sektion. Under det ser du nogle ekstra funktioner.

her kan du oprette din menu.

når du har valgt “Opret ny Menu”, kommer du til at navngive din menu og vælge en placering til den (overskrift, sidefod, sider osv.).

når du vælger “næste”, kan du tilføje dine sider til menuen fra “Tilføj elementer”. Det kan ikke blive nemmere end dette.

Sådan arbejder du med

jeg har allerede nævnt, at kontroller er blokke af indhold, som du kan føje til din sides sidebjælker, sidefødder og andre områder.

når du bruger et plugin til builder, bruger du kun kontroller til dine sidebjælker, fordi du har foruddesignede footer-layout.

normalt bruges sidebjælker af blogsider. Hvert tema har forskellige indstillinger for kontroller, fra søgelinjer, seneste indlæg og kommentarer, sociale kontroller til billeder og videoer. Lad os sige, at du vil vise din Instagram-profil i et sidebjælke, der er en Instagram-kontrol til det.

en af mine foretrukne kontroller er den, der giver mulighed for brugerdefineret HTML-redigering. Jeg finder det virkelig magtfuldt.

dette er sagt, du er lidt færdig. Tillykke, din hjemmeside er oppe at køre!

lad os nu se på den anden metode til byggepladser.

B. Hvordan man opbygger en hjemmeside ved hjælp af Gutenberg

jeg vil gøre dette virkelig hurtigt. Denne editor er stadig ny i (det er standard editoren siden December 2018), men det udvikler sig løbende takket være Fællesskabets bidrag.

den klassiske tekstredaktør så sådan ud:

nu har vi:

nu, hvorfor jeg ikke insisterer på emnet: hvis du tjekker for Gutenberg anmeldelser, er de seneste 1-stjernede anmeldelser. Det er ikke en god oplevelse. Selvom det allerede har været 2 år fra lanceringen, og mange opdateringer i midten, er dette stadig i sin barndom. Vi er nu afhængige af, at Fællesskabet opretter nye blokke, så redigeringsoplevelsen kan udvikle sig.

lige nu opfører værktøjet sig som en teksteditor med lav effekt på stylingsiden.

der er værktøjer derude som Kadence, der kan hjælpe dig, men vi er ikke der endnu.

installer vitale plugins

økosystemet er lavet af temaer og plugins

der er tusindvis af plugins tilgængelige derude, der kan udvide funktionaliteten eller tilføje nye funktioner til din hjemmeside.

dette er en meget kort tutorial om, hvordan du installerer et plugin.

vores plugin anbefalinger

lad os nu komme lidt ind i et andet emne: sidehastighed.

både dine besøgende og Google bekymrer sig meget om din hjemmesides hastighed.

Hvorfor Google?

hastighed er en vigtig faktor, der tager højde for, når man rangerer organisk, hvilket betyder her:

Hvorfor er site speed dårligt for brugerne, og i sidste ende dig?
Nå, hvis du tilbyder dem en dårlig oplevelse, kan de måske ikke engagere sig i dit tilbud eller måske ikke engang komme tilbage når som helst snart.

ifølge 2018-forskning fra Google forlader 53% af mobilbrugerne et sted, der tager længere tid end 3 sekunder at indlæse (Holy Moly!).

og tag et kig på det!

Hvordan påvirker sidebelastningen mobile besøgende (Bemærk: bounce betyder at forlade siden)?
.
så, hvordan kan du løse dette, og også forbedre din samlede hjemmeside ydeevne, så du ikke vil modtage en tommelfinger ned fra både dine brugere og Google?

jeg har valgt 2 afslappede løsninger (der er mange flere derude, men temmelig tekniske).

kart Optimer billeder
dine hjemmesidebilleder bør ikke uploades i deres oprindelige størrelse. Prøv også at gå med PNG ‘er i stedet for Jpeg’ er (de har færre farver).
Smush er vores foretrukne plugin til billedkomprimering. Du vil ikke se noget synligt fald i kvalitet, og din sidehastighed optimeres.

Krish Caching
kort sagt, cache giver midlertidig opbevaring for indhold, der skal tilgås senere. Din hjemmeside indlæses forskelligt, hvis adgang for første gang eller 5.gang af den samme besøgende.

Hvorfor er det?
når du har at gøre med cachelagring, gemmer din computer en kopi af filer fra en hjemmeside på brugerens enhed
(harddisk, mobiltelefon). Når en hjemmeside er cachelagret, behøver den kun at indlæse nye eller opdaterede dele af en side og behøver ikke at starte en ny serveranmodning. Det samme sker, hvis du klikker på knappen “Tilbage”, viser din bro.ser siden fra cache. Dette er
også super nyttigt, når der beskæftiger sig med en langsom internetforbindelse, indlæses siderne hurtigt.

vil du forstå mere om, hvordan caching fungerer? Læs videre her.

de værktøjer, vi anbefaler her, er:
P3 Total Cache (P3TC) forbedrer SEO og brugeroplevelsen af din hjemmeside ved at øge hjemmesidens ydeevne og reducere belastningstider.
Hummingbird. Dette har også nogle ekstra funktioner, som vi elsker, som komprimering af Javascript, HTML & CSS-filer.

nu, hvordan kan du kontrollere, hvor hurtigt din hjemmeside indlæses?
Google har netop værktøjet til at hjælpe dig med det, og giver også nogle rettelse ideer.

Bonus: design tips og tricks

Husk mig at sige “himlen er grænsen” med Ordtrykssiden bygherrer?

nå…der er altid et “men”. Når du designer en hjemmeside skal du altid have i tankerne din
publikum, eller køber personas (som marketingfolk gerne sige). Du skal give dem en god oplevelse på din hjemmeside, det er hvad du står for (brugeroplevelse).

nu er der visse regler, du skal følge for at give en friktionsløs brugeroplevelse.

Mød brugernes behov
brugere på en hjemmeside ønsker ikke at tænke for meget. De har brug for nyttige oplysninger, der let kan skummet og forstås. De har ikke brug for en oplevelse bestående af mange klik eller meget frem og tilbage.

folk ser efter øjeblikkelig tilfredsstillelse: at finde det, de har brug for hurtigt og med lethed. Hvis dette ikke sker på din hjemmeside, vil de kigge efter en anden.

visuelt hierarki

ikke alle hjemmesidedele behandles ens, nogle er vigtigere end andre (formularer, knapper, overskrift, værdiproposition osv.).

hvor vil du have din bruger til at lande på? Hvor vil du have ham til at klikke?

brug visuelle signaler til at hjælpe ham med at opnå det, du ønsker. Alle elementer på siderne skal opføre sig som en rejseguide.

forskere har fundet ud af, at brugere, der læser fra venstre mod højre, scanner hjemmesider i et Å-formet mønster.

det betyder, at det er her, du skal rette dine vigtigste oplysninger.

Nem navigation

du skal holde navigationslinjen enkel, Gå ikke ind i for mange muligheder. Du kan ende med et paradoks valg situation, når brugerne bliver overvældet med mulighederne.

sider skal være internt knyttet til andre relevante sider, så navigationen er glat, og brugeren skal ikke klikke på “tilbage” mange gange for at komme til tidligere sider.

Gør brug af hvidt rum. Hvidt rum gør det muligt at organisere information i fordøjelige indholdsområder. Dette får brugerne til at føle sig mere komfortable og ikke overvældede af masser af data.

samme farveskema (konsistens)

undgå super mørke eller super intense farver på din hjemmeside. De kan sende brugere væk. Du kan bruge stærkere farver til at fremhæve vigtige aspekter af din hjemmeside.

Brug farver, der er lige afbalancerede. Her er lidt inspiration.

og en ting mere, før du går videre til det næste designprincip. Farver har betydninger rundt om i verden, de er forbundet med forskellige følelser. Denne infografik vil skinne et lys over emnet.

brug Effektiv Skrivning

brug ikke overdrevet og clickbait-kopi. Skriv med sund fornuft, på et naturligt sprog, Brug ikke jargon (ikke alle er bekendt med visse tekniske ord).

brug Maks. 3 skrifttyper i højst 3 punktsstørrelser-højst 18 ord eller 50-80 tegn pr.tekstlinje, som Smashing-magasinet anbefaler.

brug socialt bevis

hvorfor skal jeg stole på dig, din virksomhed eller dine produkter?
vi, mennesker, er sociale væsener. Vi lever i fællesskaber, vi har venner og familie. De kan være vores influencere. Vi bekymrer os meget om deres mening.
.
Lad mig liste ud nogle eksempler for dig:
liter vurderinger og anmeldelser

● udtalelser

● Nej. af kunder (“du er i godt selskab”).

● Clients’ logos

Kerr Case studies bakket op af resultater

Kerr Press featuring og priser

også, hvis du ønsker at finde ud af om de seneste design tendenser, de kystnære kreative folk gjorde en fantastisk infografik om emnet.

konklusioner

vi kan kalde det en indpakning synes du ikke?

vi ønskede at gå den korte vej, ikke at overvælde dig med information. Men i sidste ende er djævelen i detaljerne. Vi har lige givet dig helikoptervisningen.

sagen er, at du kan få din hjemmeside i gang på mindre end 2 timer. Men jo flere funktioner, sider, indhold du vil tilføje, jo længere tid tager det. Og forsømmer du aldrig de nyeste trends inden for internetdesign.

en sidste ting, men hvis du er DIY-typen, skal du helt sikkert tage vores Colibri builder til et spin!

her er en video om, hvordan man opbygger en hjemmeside ved hjælp af tonsvis af funktioner.

nu, hvis du kunne lide denne artikel, og du vil lære mere om, hvordan du designer en hjemmeside, skal du sørge for at abonnere på vores Youtube-kanal og følge os på kvidre og Facebook!