Vad är en staging-miljö? Hur skapar man en för en webbplats?

Föreställ dig att du går på en Broadwaymusikal: Du ser en polerad föreställning, men bakom kulisserna har skådespelarna och teamet lagt ner hundratals timmar på auditions, genomläsningar av repliker, genrep och mycket mer. Allt du ser är resultatet av noggrann förberedelse.

På samma sätt fungerar en testmiljö inom webbutveckling som en "generalrepetition" för din faktiska webbplats. Istället för att publicera uppdateringar direkt på en live-webbplats använder utvecklare en staging-miljö för att testa och revidera tills de är redo att visa sitt arbete för en livepublik.

Lär dig mer om fördelarna med att använda en testmiljö för din e-handelsbutik, inklusive hur du skapar en testmiljö i Shopify.

Vad är en staging-miljö?

En staging-miljö är en privat testmiljö för din webbplats där du kan granska uppdateringar eller nya designer utan att påverka den aktiva sajten. Den simulerar en live-version av en webbplats så att utvecklare och intressenter kan uppleva den som en användare skulle göra om den vore live.

Ett huvudmål med en testmiljö är att upptäcka brister och göra revideringar eller korrigeringar. Vanligtvis involveras intressenter som marknads- eller ledningsteam i testprocessen för att ge feedback. När intressenterna har granskat testsajten grundligt och deras input har behandlats, publiceras uppdateringarna i live-miljön.

En kritisk uppdatering, som en ny sektion för produktbilder, kan skada konverteringar om sajten inte fungerar korrekt som ett resultat av förändringen. Genom att simulera användarupplevelsen – från att klicka sig fram till produktsidan till att lägga varor i kundvagnen – kan du upptäcka och åtgärda fel innan de påverkar riktiga kunder.

Utvecklings-, staging- och live-webbplatser

• Utvecklingsmiljö
• Staging-miljö
• Live-sajt

Webbutveckling sker huvudsakligen på tre arenor: Utveckling, staging/testning och live. Först skrivs kod på en utvecklingssajt, sedan publiceras den till en testmiljö för kvalitetsbedömning (QA), och slutligen uppdateras live-sajten för alla användare.

Utvecklingssajt

Utvecklingswebbplatsen är en testmiljö där utvecklare skriver kod och förverkligar idéer. Det är vanligtvis en lokal miljö som endast är tillgänglig för utvecklingsteamet. Detta stadium innebär att lägga till bilder, text, videor och kod för anpassade funktioner, som interaktiva produktfilter. Även om viss initial testning sker här, är utvecklingsmiljön vanligtvis opolerad.

Staging- och testmiljö

Efter att utvecklingen är klar publiceras koden till en ny testmiljö, den sk. staging-miljön. Detta är din generalrepetition, där alla problem löses som om det vore inför en livepublik. Testwebbplatser finns online, vanligtvis på en testdomän som använder en testmiljö-URL som staging.dinwebbplatsnamn.com.

Se till att din testmiljö inte är indexerbar – vilket betyder att du avråder sökmotorer från att visa den i sökresultat. Du kan göra detta snabbt genom att lägga till några kodrader. Överväg att göra testmiljön lösenordsskyddad om den innehåller information som du inte är redo för att kunder ska se, som till exempel en kommande rea.

När testmiljön är live granskar intressenterna den och ger feedback. Koden går sedan tillbaka till utvecklingswebbplatsen, där utvecklarna åtgärdar eventuella problem och skickar ändringarna till staging-webbplatsen igen. Den här processen fortsätter tills alla intressenter har godkänt.

Live-sajter

En live-sajt är den slutliga, offentliga versionen – även kallad produktionsmiljön eller produktionssajten. Det är här ridån går upp för allmänheten – och uppdateringar blir synliga för alla användare. De kan göra köp, engagera sig i ditt innehåll och interagera med ditt varumärke. När en förändring är live kan alla komma åt den, vilket är varför grundlig noggrann kvalitetskontroll (QA) i teststadiet är avgörande.

Varför använda en staging-miljö för din e-handelsbutik?

Att publicera en misslyckad uppdatering kan irritera kunder och skada försäljningen, så det är särskilt viktigt för e-handelsbutiker att använda testmiljöer. En testmiljö kan hjälpa dig att:

• Testa element utan att påverka användarupplevelsen. Experimentera med design och nya funktioner, utan att försämra dina kunders upplevelse.
• Hitta buggar före offentlig lansering. Hitta fel som kundvagnsproblem, icke-fungerande knappar eller trasiga produktbilder.
• Testa integrationer utan att störa sajten. Testa tredjepartsintegrationer som API:er (applikationsprogrammeringsgränssnitt) eller fraktkalkylatorer utan att påverka live-sajten.
• Samarbeta med intressenter. Bjud in olika team, designers och intressenter att granska och samarbeta kring revideringar och förändringar.
• Simulera användarupplevelsen. Upplev sajten precis som dina kunder kommer att göra, vilket låter dig hitta brister i shoppingupplevelsen. Det är en mer komplett simulering än att bara använda interaktiva designfiler i ett verktyg som Figma.
• Testa webbplatsens prestanda. Gör dina uppdateringar sajten långsammare? En testmiljö låter dig testa påverkan på teknisk prestanda (vilket också kan påverka rankingen för organiska sökningar).

Tre sätt att skapa en staging-miljö på Shopify

1. Duplicera ditt tema
2. Skapa en utvecklingsbutik
3. Använd en app

Shopify standardwebbplatser har inte med en testmiljö, så du behöver skapa en. Det finns tre sätt att göra det:

1. Duplicera ditt tema

Detta är det enklaste sättet att skapa en testmiljö med en standard Shopify-plan. Det är en snabb installationsprocess som bara tar några klick. Du behöver inte heller installera tredjepartsappar eftersom din staging-miljö byggs direkt in i Shopifys adminpanel.

Så här skapar du en testmiljö i Shopify genom att duplicera ditt tema:

1. Gå till Onlinebutik > Teman i din Shopify-adminpanel.

2. Under Aktuellt tema > Åtgärder, välj Duplicera.

3. Du har nu en identisk kopia av ditt live-tema. Redigera det fritt, utan att påverka livesajten. Du kan klicka på Förhandsgranska för att skapa en staging-instans.

4. När du är klar med testningen kan du göra ändringarna på din livesajt.

Det här alternativet är bäst för designändringar som justeringar i layout eller nya sidsektioner. Det ger dock inte en testmiljö för integrationer eller ändringar i funktionalitet. Kom också ihåg att du behöver lägga till elementen manuellt som du redan har på din befintliga sajt.

2. Skapa en utvecklingsbutik

Denna metod kräver att du skapar ett nytt Shopify-partnerkonto, vilket låter dig bygga en komplett butik för testning. Partnerkonton är designade för utvecklare, designers och byråer som bygger och hanterar butiker för kunder. De är gratis och ger dig tillgång till en utvecklingsbutik, vilket låter dig spegla allt om din huvudsajt – inklusive webbplatsens design och funktionalitet – i en privat miljö.

Så här skapar du en testmiljö genom att använda en utvecklingsbutik:

1. Registrera dig för ett Shopify-partnerkonto.

2. Gå till Butiker > Skapa butik.

3. Välj Utveckling som butikstyp.

4. Namnge den något som "staging-dinwebbplats" så att det är lätt att skilja den från din live-butik.

5. Lägg till produkter, installera ditt tema och konfigurera alla inställningar för att spegla din livebutik.

Nu kan du simulera den fullständiga användarupplevelsen, utan att riskera din faktiska sajt. Detta är det bästa alternativet för ändringar i funktionalitet, inklusive anpassad kod eller tredjepartsintegrationer. Även om utvecklingsbutiker är gratis för testning har de vissa begränsningar. Du kan endast installera gratisappar och appar som är partnervänliga, och du kan till exempel bara generera testfraktsedlar.

Om du vill testa ytterligare appar eller skapa funktionella fraktetiketter, kan du sätta upp en ny betald butik på en Basic-plan. Precis som när du duplicerar ditt tema måste du manuellt kopiera de tillagda webbplatselementen till din staging-webbplats.

3. Använd en app

Vissa testverktyg som Duplify (som erbjuder en begränsad gratisplan) låter dig skapa en testmiljö som återskapar hela din sajt. Du kan sedan testa befintliga sidor och produkter innan du går live. Rewind Staging är en liknande app (med en gratis provperiod) som inkluderar temabackuper, så du kan återgå till den tidigare versionen om något går fel. Gå bara till Shopify App Store och sök efter testappar för att komma igång.

Så här skapar du en testmiljö genom att använda Rewind Staging:

1. Installera Rewind Copy på din live-sajt från Shopify App Store.

2. Välj din live-butik som din källbutik.

3. Installera Rewind Copy på din utvecklingsbutik.

4. Välj din utvecklingsbutik som din målbutik.

5. Kopiera nyckeln från din källbutik till din målbutik för att koppla ihop butikerna.

6. Välj informationen att kopiera över till testmiljön, så att den speglar din live-sajt.

7. Aktivera "Kontinuerligt" för kopieringsändringar för att säkerställa att båda butikerna hålls synkroniserade.

8. Klicka på Börja uppgift för att starta kopieringen.

Ibland kan manuell duplicering av webbplatsen leda till att vissa delar saknas, så att använda en staging-app kan säkerställa en exakt kopia – särskilt om du har ett komplicerat tema.