Hvordan bygge et nettsted for et nytt produkt (og hvordan vi gjorde det)

Bjørn bygger bo – Mure og pusse utekjøkken

Innholdsfortegnelse:

Hvis du ikke har en kreativ kort ennå, start her. En kreativ kort beskriver nøyaktig hvordan du planlegger å snakke om produktet eller bedriften din. Det definerer merkevarens tone i stemmen, fargepaletten din, verdsettelsen din og så mye mer. Din kreative kort definerer hvordan nettstedet ditt skal kommunisere med kundene.
Med din kreative kort i hånden, du begynner å jobbe med sitemapet ditt. En sitemap er bare en oversikt som viser alle sidene (inkludert deres formål og mål) du planlegger å inkludere på nettstedet ditt.
En wireframe er et grovt layout på nettstedet ditt. Det er egentlig ikke et design, akkurat. Det er et dokument som viser omtrent hvor ting går på siden, uten bekymring for farge eller annen grafikk.
Nå er det endelig tid til å faktisk designe og bygge ditt nettsted. Hvis du bruker en freelance designer eller design firma, vil de overta prosessen herfra.
Når ditt nye nettsted er oppe, er arbeidet ikke ferdig. Faktisk er det bare begynnelsen! Du vil kanskje ikke høre det, men nå at nettstedet ditt er live, må du finne ut om faktisk kopien du skrev, faktisk fungerer. Er din kopi å få kunder til å gjøre det du vil at de skal gjøre? Å finne riktig design og kopi vil øke antall kunder du har, og sørg for at du får mest mulig ut av hvert potensial som kommer til nettstedet ditt.

Redaktørens notat: Vi lanserer et nytt produkt, og vi vil ta med deg for turen. Så vi trekker tilbake gardinen for å gi et innblikk i det som virkelig foregår bak kulissene om å bygge og lansere noe nytt. Når du er ferdig med å lese denne artikkelen, må du også sjekke ut den første, andre, tredje og fjerde avdrag i denne serien også.

Uansett hvilken type virksomhet du starter, trenger du et nettsted. Å ha et nettsted er sannsynligvis viktigere enn å ha visittkort i disse dager.

Noen utvalgte bedrifter, som matvogner, kan kanskje komme seg bort med bare å være til stede på Facebook og andre sosiale plattformer. Men i disse dager er det unntaket, ikke regelen, og du trenger sannsynligvis en dedikert nettside.

Og det er aldri for tidlig å begynne å tenke på hvordan du skal bygge den. Disse tingene tar tid - ofte mer enn du tror. Du må tenke på hvilken type nettside du trenger og hvordan du skal bygge den og sette hjulene i bevegelse tidlig.

Her på Palo Alto Software er vi i ferd med å bygge vårt nye produkt, Outpost. Vår nettside vil være den primære måten potensielle kunder lærer om vårt produkt og (viktigst!) Hovedveien for å finne prisinformasjon og abonnere på Outpost.

Vårt nettsted for Outpost vil også være våre kunders hovedressurs for hjelp og

Hvis du ikke har fulgt med som vi har snakket om å bygge Outpost, er det en rask oppdatering:

Outpost hjelper lagene til å administrere delte innboks, slik at de enkelt kan spore, samarbeide, og svare på meldinger sendt til generiske e-postadresser som [email protected] og [email protected]. Outpost er som oppdragskontroll for alle dine innkommende e-poster og sørger for at hver e-post får det riktige svaret, og ingenting faller gjennom sprekkene.

Hvis du vil lære mer om hvordan vi har bygget Outpost, kan du starte i begynnelsen og få hele historien. Eller vær her og les videre for å lære hvordan vi planla og bygget vårt nettsted.

Start med en kreativ kort

Hvis du ikke har en kreativ kort ennå, start her. En kreativ kort beskriver nøyaktig hvordan du planlegger å snakke om produktet eller bedriften din. Det definerer merkevarens tone i stemmen, fargepaletten din, verdsettelsen din og så mye mer. Din kreative kort definerer hvordan nettstedet ditt skal kommunisere med kundene.

Du har kanskje allerede utarbeidet en kreativ kort hvis du har gått gjennom utviklingsprosessen for logo. I så fall kan du bare bruke det på nettstedet ditt. Hvis du ikke har utviklet en kreativ kort ennå, er det nå på tide å bygge en.

Heldigvis har jeg allerede skrevet en detaljert artikkel som lærer deg hvordan du gjør det, som inkluderer eksempler fra Outpost kreative kort, så Du kan se hvordan vi bygde vår. Så, hvis du trenger arbeid på din kreative kort, sjekk ut artikkelen min om hvordan vi utviklet vår logo og dens kreative kort, og kom så tilbake hit når du er klar.

Opprett et sitemap

Med din kreative kort i hånden, du begynner å jobbe med sitemapet ditt. En sitemap er bare en oversikt som viser alle sidene (inkludert deres formål og mål) du planlegger å inkludere på nettstedet ditt.

Her er nettkartet som vi utviklet for Outpost:

Hjem

: Produktoversikt og en "oppfordring til handling" for å registrere deg for en gratis prøveperiode. Sekundære lenker til andre sider som beskriver funksjoner. Funksjonsoversikt

: En oversikt over alle funksjoner med koblinger til detaljerte funksjonssidene. Funksjonsdetaljer for funksjon A: Detaljer for funksjon A.

Funksjonsdetaljer for Funksjon B: Detaljer om funksjon B.

Gjenta for alle funksjoner.

Prissetting: Detaljer om prisplaner og koblinger for å registrere deg for en gratis prøveversjon.

Kunder:

Profiler av vellykkede kunder. Om oss:

Oversikt over hvem vi er, vår oppgaveoversikt og vår historie. Kontakt oss:

Kontaktinformasjon, timer, sted. Stillinger:

En liste over våre nåværende stillinger. Personvernerklæring:

Personvernpolitikken for utposten. Blog:

Hjemmeside for bloggen som viser de siste blogginnleggene. Blogginnlegg:

Det vil være flere blogginnlegg. Denne siden vil være mal for dem. Brukerstøtte:

Vårt brukerstøttesenter blir drevet av Zendesk. Selvfølgelig vil nettstedet ditt sannsynligvis være veldig annerledes enn Outpost-sitemapet. Hvis du for eksempel er en restaurant, har du sannsynligvis en side eller to for menyer og en side for reservasjoner. Hvis du bygger en nettbutikk, har du sannsynligvis mange forskjellige produktsider.

Dine sitemap dokumenter, så godt du kan, hva du synes nettstedet ditt vil inneholde. Denne lille planleggingen vil gjøre resten av planleggingen og utviklingen av nettstedet mye lettere, så det er verdt investeringen i dette tidlige stadiet.

Skriv din kopi først før design

Du kommer til å tro at jeg ikke gjorde det ikke få bestillingen her. Skal du ikke designe nettstedet ditt før du tenker på hvilke ord du skal legge på siden?

Faktisk er det bedre å tilegne seg ting "bakover" og tenk på nettstedet ditt først og deretter design rundt den kopien. Hvorfor? Fordi det du vil kommunisere med kundene dine, er mye viktigere enn den endelige sluttdesignen til nettstedet ditt. Selvfølgelig er designen viktig, og du vil ha et nettsted som ser bra ut, men hvis du ikke kan kommunisere dine viktige meldinger til brukerne, vil det ikke være en god design som gjør forskjellen.

Skrive kopien først hjelper deg og potensielle designere til å forstå hva hver side prøver å kommunisere. Dette resulterer i bedre designdesign som forsterker meldingene dine. Selv om du skal bygge nettstedet ditt selv med et verktøy som Squarespace, vet du hva hver side må si før du velger et design, vil være en stor tidsbesparer.

Når det kommer tid til design, kan du trenger å finjustere kopien din for å sikre at tingene passer riktig, men det blir lettere enn å prøve å skrive kopi for et design som ikke ble bygget for meldingen.

På hjemmesiden din vil du sannsynligvis ha en overskrift som beskriver nøyaktig hva du gjør - din nøkkelverdi for kundene dine. Dette vil bli etterfulgt av en kort utvidet beskrivelse av hva firmaet gjør.

Her er overskriften og utvidet beskrivelse for Outpost, produktet vi bygger:

Streamline din delte e-post

Lett spore, samarbeide, og svare på meldinger sendt til generiske e-postadresser, som support @ eller info @.

Derfra vil kopien du vil inkludere på hjemmesiden din, bestemt av den typen bedrift du er, som dine kunder er og hva du trenger å kommunisere.

For Outpost må vi kommunisere de viktigste funksjonene og fordelene med produktet vårt og oppfordre potensielle kunder til å lære mer. Vi vil også snakke om kundeserviceteamet og hvor godt de er.

Men dette er kanskje ikke det riktige oppsettet for hjemmesiden din. Hvis du er en restaurant, kan du kanskje ha lenker til menyene dine eller informasjon om å få en reservasjon. Hvert firma er annerledes, så finn ut hva du trenger å si og skriv det ned.

Ikke bekymre deg om å starte med en tom side, skjønt. I stedet, kom opp med en liste over favorittwebsider i bransjen din, og tenk på hva du liker og misliker om hvert nettsted. Hva slags navigasjon bruker de? Hvilke sider inkluderer de? Hva slags bilder bruker de? Du trenger ikke å gjenoppfinne hjulet, og det er en fin måte å komme i gang med å bruke et favorittsted som et hoppende punkt.

Et siste tips:

Mindre er vanligvis mer. Ikke bli fristet til å skrive uendelige stykker av kopi til nettstedet ditt (med mindre det er det kundene dine forventer!). Hvis du legger merke til hvordan du bruker nettsteder, vil du oppdage at du ofte skinner gjennom tekst, ikke leser hvert ord. Fordi det er slik at de fleste leser online-skimming i stedet for å lese hvert ord, behold kopien kort og til poenget. Utvikle en wireframe

En wireframe er et grovt layout på nettstedet ditt. Det er egentlig ikke et design, akkurat. Det er et dokument som viser omtrent hvor ting går på siden, uten bekymring for farge eller annen grafikk.

Hvis du jobber med en designer for å bygge ditt nettsted, vil de produsere en wireframe for deg som en del av design prosess. Hvis du bygger ditt nettsted på egen hånd, ved hjelp av en tjeneste som Squarespace eller Shopify, kan du enkelt bygge en wireframe på egen hånd.

Ikke bli skremt av dette trinnet. Du trenger ikke noen spesielle verktøy for å bygge en wireframe. En pute med papir og en penn er nok til å skisse ut hver side på nettstedet ditt. Husk at du ikke "designer" og en wireframe ikke behøver å være pen. Det trenger bare å kommunisere hva som skjer hvor på en side.

Hvis du trenger inspirasjon, sjekk ut andre nettsteder du liker og se på hvordan de strukturerer informasjonen på hver side. Det er helt greit å låne oppsett fra andre nettsteder og finne inspirasjon til ditt eget nettsted.

Hvis du bruker penn og papir, er det ikke din ting, du kan bruke PowerPoint eller Keynote til å lage wireframes. Det er også dedikerte wireframing verktøy som Balsamiq som gjør prosessen enkel.

Jeg har tatt med Outposts hjemmeside wireframe nedenfor, så du kan få en ide om hvordan en wireframe ser ut. Du kan også se på kopien vi opprettet i forrige trinn, og en skisse av en ide for et grafisk element som vi ønsker at en designer skal lage.

Vårt trådframe for utpost.

Design og bygge

Nå er det endelig tid til å faktisk designe og bygge ditt nettsted. Hvis du bruker en freelance designer eller design firma, vil de overta prosessen herfra.

Men, forutsatt at du er som de fleste s, gjør du sannsynligvis dette selv og vil holde kostnadene under kontroll. Hvis dette høres ut som du, må du velge en plattform for å designe og være vert for nettstedet ditt.

Først må du vurdere dine behov. Trenger du bare en enkel nettside? Vil du inkludere en blogg? Vil du selge produktene dine på nettet og trenger ting som en handlekurv?

Det er bokstavelig talt hundrevis av mulige valg, men jeg vil bare liste noen av mine favoritter slik at du ikke blir for sviktet og velger en plattform for ditt nettsted.

WordPress: Dette er en flott, rimelig plattform for enhver enkel nettside. Det er mange designalternativer, og du kan komme i gang gratis. Jeg vil ikke anbefale WordPress hvis du planlegger å kjøre en nettbutikk med mange produkter, men det er et flott alternativ for et grunnleggende informasjonsnettsted og blogg. Hundrevis av tusenvis av nettsteder bruker WordPress, så du kan ikke gå for langt galt med dette valget. Og det er noen alternativer for å legge til handelsfunksjoner på nettstedet ditt hvis det er nødvendig.

Shopify:

Hvis du selger ting online, er Shopify et utmerket valg. Du kan kjøre hele nettbutikken din på denne plattformen og få alle back-end-verktøyene du trenger for å administrere dine produkter, lager og mer. Squarespace:

Squarespace er jacket i alle bransjer. Du kan bruke den til å lage alt fra en blogg til en nettbutikk. Med vakre designmaler og uendelig fleksibilitet er det også et godt valg å komme i gang. For Outpost er vi i en litt annen situasjon. Som et eksisterende selskap har vi en in-house designer og noen ingeniører som jobber på nettstedet vårt. Men hvis det ikke var tilfelle, ville jeg sannsynligvis velge enten WordPress eller Squarespace for å bygge vår nettside.

Test og iterate

Når ditt nye nettsted er oppe, er arbeidet ikke ferdig. Faktisk er det bare begynnelsen! Du vil kanskje ikke høre det, men nå at nettstedet ditt er live, må du finne ut om faktisk kopien du skrev, faktisk fungerer. Er din kopi å få kunder til å gjøre det du vil at de skal gjøre? Å finne riktig design og kopi vil øke antall kunder du har, og sørg for at du får mest mulig ut av hvert potensial som kommer til nettstedet ditt.

For å finne ut alt, må du løpe noen tester. Dette kalles A / B testing. Det er når du pit ditt nåværende nettsted (A-versjonen) mot et alternativ (B-versjonen). Du måler deretter hvilken versjon som fungerer bedre. Du kan måle suksess i økt salg, økte samtaler til bedriften din, eller bare få kunder til å klikke på en annen side.

Jeg vil ikke gå inn i en detaljert veiledning om A / B-testing her, da det er et grundig emne for en annen dag, men jeg vil fortelle deg at du trenger noen ekstra verktøy for å få testingen din gjort.

I Anbefal enten Konverter eksperimenter eller Visual Website Optimizer. Begge er solide og rimelige valg som gjør testingen enkel.

Du må også sørge for at du har installert et analyseverktøy som Google Analytics (gratis!) For å forstå hva slags personer som besøker nettstedet ditt og hva de Gjør det når de er der.

Hvis du har flere spørsmål eller kommentarer om hvordan du får nettstedet ditt oppe, vennligst ikke nøl med å spørre meg i kommentarene.