Hur man gör en webbsida

Att göra en bra hemsida kan verka som en titanisk utmaning, men genom att lära sig grunderna hittar du processen intressant och kul. Du kommer att behöva göra mycket mer än skapa ett välskött utseende! Här är grunderna och de grundläggande riktlinjerna för att skapa en webbplats som människor kommer att besöka med glädje.

Metod 1

De tre grundläggande reglerna

Regel nr 1: Lyssna på din kund. Du kan göra det "bästa webbplatsen någonsin sett på jordens yta", med levande svarta, sofistikerade tecken och konstnärliga och modiga färger som skriker "besök mig nu!" Tyvärr, din klient ville ha en orange menyrade med en djärv rosa och orange typsnitt. Du kommer att sparkas, och din bästa webbplats - som kunden nu har rättigheterna till - ligger glömt på sin backup-server och kommer aldrig att se ljuset.

Studera din kunds företag. Be honom att visa dig webbplatser han gillar. Det gör att du förstår vad som passar dem och ger dig inspiration för några idéer som du kanske inte har övervägt.
Om du trodde att den orange och rosa sidan var ett skämt, tänk dig på den bästa platsen att marknadsföra denna produkt:

Regel nr 2: Känn din publik och lär dig att uppfylla sina önskemål. Anledningen till att människor skapar webbplatser är att andra ser dem. De kan vara pedagogiska eller kommersiella, eller det kan vara en nöjesplats för en viss demografisk grupp. Ditt jobb som designer är att känna din publik och hålla dem limmad på sidan när de besöker.

Du kan tänka, "om han ser bra ut, kommer de att förbli." Men det är inte alltid så. Ta fastigheter som exempel. Här kan du se en webbplats som har en ren och rolig design. Den har många vita utrymmen som gör det luftiga, starka färger och ett modernt format för 16: 9 skärmar med mycket markerade länkar:

Bild med titeln Santa Monica Real Estate 1.jpg

Nu överväga den här stilen istället: den är förvirrad och komprimerad, neutrala färger och massor av meddelanden.

Gissa vilken fungerar bäst för personer som söker ett hem? Exakt vad faktiskt publicera meddelanden! När folk letar "Hus till salu i centrala Milano", är inte intresserade av webbplatsens estetik. De vill inte ha information om fastighetsägaren eller titta på pittoreska bilder av staden. De vill se hus.

Regel nr 3: Lyssna på dig själv. Du förstår vad kunden vill ha, och du vet hur man ska tillfredsställa marknaden. Nu är det dags för dina personliga idéer!

Skapa en mall med det program du föredrar. På olika lager (så att du kan redigera delar av webbplatsen utan att behöva återskapa hela modellen) skapa de element som ska infogas på sidan. Dessa element kan innehålla:

Header. Detta är ett element som kommer att vara vanligt för alla sidor på din webbplats. Rubriken består av webbplatsens titel och logotyp, och innehåller länkar till andra delar av webbplatsen (t.ex. företagsinformation, kontaktuppgifter etc.). Rubriken kommer visuellt att gruppera allt detta och göra sidan mer funktionell. Det är vanligt att tilldela den första knappen i menyraden till länken till hemsidan.

Vi tar Apple webbplatsen:

Liksom i företagets stil är deras hemsida väldigt rent och städat. Notera översta menyraden, med de ämnen som tilldelas varje knapp, plus en sökruta - alltid en elegant kontakt om din webbplats stöder den. Nu tittar vi på en sida som kan öppnas genom att följa en länk, den på iPad, och vi kan se några element:

Menyraden ändras bara och visar iPad-knappen med en mörkare färg.

Sidämnet finns i stora svarta bokstäver längst upp till vänster.

En ny undermenyfält visas med information om produkten. Om du klickar på en av dessa knappar ser du att sidan kommer att erbjuda dig nytt innehåll relaterat till ämnet, men behåller stilen och layouten.

I många fall behöver var och en av de sidor som kan nås via menyraden behöva flera underkategorier. I stället för att skapa en sekundär menyraden kan du använda en popup-meny som i det här exemplet från Musician`s Friend:

Sidofältet. Detta kommer att vara vanligt för många sidor på din webbplats, men inte nödvändigtvis alla - vad som är viktigt är innehållet. Men det är ett mycket viktigt element, och du måste inse det noggrant, så att det är intuitivt och inte förvirrat. I motsats till menyraden kan innehållet i ett sidofält vara mycket dynamiskt. Tänk på dessa sidor på Trulia-fastighetsannonsen. Den första är för köpare:

Och den andra för dem som säljer. Observera att fokuset är helt skiftat, även om det är liknande information, och visas på samma punkter som stapeln:

Body. Detta kommer att vara sidans kropp, varav det ska inkluderas allt innehåll och därmed den del som kommer att variera mer än din webbplats. Om du bygger en e-handelsplats, kan en sida till exempel innehålla en produktbeskrivning och ytterligare 20 produkter till salu. Din uppgift är att göra två sidor som inte förefaller diskreta. Använd färger, teckensnitt och liknande gränssnittselement för att göra dem.

sidfot. Det här är ett element som inte finns på alla webbplatser, för att inte alla behöver det. Det används ofta för objekt som kan förvirra ett annat beställt och tydligt gränssnitt, eller att tillåta åtkomst till delar av webbplatsen som inte är de som användarnas uppmärksamhet är inriktad på. Här är ett exempel som tas från Groupon-webbplatsen:

Metod 2

riktlinjer

Öva skapa sidor med rätt användargränssnitt. Placering av olika delar av webbplatsen, som titel, sidobar, logotyp, grafik och text, alltid på samma plats på varje sida, gör din webbplats navigerbar och intuitiv.

Använd samma rubrik längst upp på varje sida. Om din webbplats lämpar sig för upprepning av innehåll, se till att toppen av varje sida är identisk.
Använd logik i dina stilistiska val. Elementen på en enda sida ska sorteras logiskt efter betydelse eller ämne - detta gäller även ordningen på sidorna på webbplatsen.

Skapa en konsekvent stil. Även om layouten borde ge din webbplats en strukturell sammanhållning, bör stilen ge en tematisk harmoni.

Begränsad till två eller tre huvudfärger och se till att de kombineras bra.

Undvik att använda för många tecken eller storlekar - om du har bestämt dig för att växla mellan vissa, se till att du använder dem med samma ända för varje sida.

Använd Cascading Style Sheets (CSS) för att hantera utseendet på webbplatsen och göra det enhetligt. Det blir också lättare att byta objekt som är gemensamma för flera sidor med bara en fix utan att behöva göra det för varje sida.

Det är tillåtet att läsa. För att göra din text lättare att läsa, dela den i mindre avsnitt.

Använd undertexter och lämpligt avstånd för att separera var och en av sektionerna.

Använd fet eller tecken på olika storlek för att visa ämnets hierarki och betydelse.

Var uppmärksam på texthantering. Gör inte tecknen för små och utvidga radenavståndet för att göra stora delar av texten mer läsbara. Om du kan dela dem i mindre sektioner.

Gör din webbplats läsbar för alla. Använd standard HTML och undvik taggar, funktioner och plugin-program som endast är tillgängliga för vissa webbläsare eller vissa versioner av dem.

Även om de flesta moderna webbläsare och datorer kan hantera komplexa bilder, kommer din webbplats att dra nytta av mindre webboptimerade bilder. Det balanserar sökandet efter kvalitet med lasthastigheten.

Testa din webbplats. Se till att "varje länk fungerar" som det borde, och att bilderna visas på rätt sätt.

Låt medlemmarna av din publik testa webbplatsen för att kontrollera tydligheten och användarvänligheten för dina stilistiska val, och lyssna på deras råd om förändringar som ska göras.

Publicera din webbplats. Om du inte redan har gjort det, köp en domän. Kontrollera länkarna regelbundet för att se till att de finns och lyssna på de förslag som skickas till dig via e-post från dem som besöker webbplatsen.

tips

Även om det kanske är bättre att göra layoutmodellen enligt dina önskemål, kan det vara lättare att köpa en förbyggd modell.
För att spara bläck på webbplatsens besökare, använd ett separat stilark för att formatera din webbplats för utskrift
Inaktivera bakgrundsbilder när du ställer in utskriftsparametrar.
Använd svart text på en vit bakgrund.
Ta bort menyraden och eventuell onödig bild.
Bombardera inte användaren med fin och söt grafik. Flash animationer, ljusa färger, motivbakgrunder och musik som reproduceras varje gång sidan laddas kan vara roliga experiment på 90-talet, men de kommer att fly från dagens användare. Begränsad till enkla bakgrunder som skapar kontrast med textfärg för att förbättra läsbarheten.
För att göra webbplatsen tillgänglig för blinda och döva användare kan du skapa bildtexter för videor och bilder, transkribera ljudmeddelanden och inkludera anteckningar om tillgänglighet. Även om tabeller kan vara ett bra sätt att organisera information, kan inte blinda användare som använder en skärmläsare höra innehållet i kolumnerna i rätt ordning.
Du kan använda CSS för att skapa rätt utrymme mellan punkterna.

varningar

Undvik plagiering och respektera upphovsrätten. Lägg inte till bilder på nätverket eller till och med strukturella delar av webbplatsen utan tillstånd. Vad du än behöver på webbplatsen måste respektera lagar och moraler.

Dela på sociala nätverk:

Relaterade

Hur man gör en webbsida

steg

Metod 1

Metod 2

tips

varningar