Gå til innhold

Hvordan forbereder du deg på å designe en side?

B4stian

Anbefalte innlegg

Videoannonse

Videoannonse
Annonse
Gjest Slettet+6132

Gjest Slettet+6132

Skrevet
Skrevet (endret)

Jeg forbereder meg slik:

 

Start -> Run -> notepad -> 


<html>
<head>
<title></title>
(kanskje et stilark også her?)
</head>

<body>
</body>
</html>

 

Og så bare fyller du inn det nødvendige liksom :p

Endret av Slettet+6132
Lenke til kommentar
Lokaltog

Lokaltog

Skrevet
Skrevet (endret)

Jeg gjør kanskje ting litt tungvint, men jeg synes det funker veldig bra.

  • Lager et noenlunde komplett betadesign i Photoshop
  • Beslutter å lage HTML-versjon av designet
  • Oppretter full mappestruktur og bestemmer om jeg skal ha med funksjonalitet som stilskifter etc.
  • Kopierer templaten jeg har for å sende korrekte application/xhtml+xml-headere og et standard XHTML-dokument som jeg lagrer som index.php
  • Lager et oppsett med div-elementene jeg trenger for selve layout'en (gir alle layout-elementer en id og ikke en klasse, siden disse bare skal brukes en gang og fordi jeg derfor kan bruke dem som ankere i dokumentet mitt)
  • Programmerer et includescript som inkluderer et demodokument jeg på forhånd har satt opp med de fleste HTML-elementene jeg trenger (lister, avsnitt etc.)
  • Slicer opp all grafikken og lagrer med forståelige navn
  • Skriver et godt strukturert CSS-dokument med alle layoutelementer som er nødvendige

Jeg bruker vanligvis rundt 7-10 timer fra fullført Photoshop-beta til et noenlunde ferdig HTML-design. :)

Endret av Lokaltog
Lenke til kommentar
Equerm

Equerm

Skrevet
Skrevet
Jeg gjør kanskje ting litt tungvint, men jeg synes det funker veldig bra.
  • Lager et noenlunde komplett betadesign i Photoshop
  • Beslutter å lage HTML-versjon av designet
  • Oppretter full mappestruktur og bestemmer om jeg skal ha med funksjonalitet som stilskifter etc.
  • Kopierer templaten jeg har for å sende korrekte application/xhtml+xml-headere og et standard XHTML-dokument som jeg lagrer som index.php
  • Lager et oppsett med div-elementene jeg trenger for selve layout'en (gir alle layout-elementer en id og ikke en klasse, siden disse bare skal brukes en gang og fordi jeg derfor kan bruke dem som ankere i dokumentet mitt)
  • Programmerer et includescript som inkluderer et demodokument jeg på forhånd har satt opp med de fleste HTML-elementene jeg trenger (lister, avsnitt etc.)
  • Slicer opp all grafikken og lagrer med forståelige navn
  • Skriver et godt strukturert CSS-dokument med alle layoutelementer som er nødvendige

Samme metoden som jeg bruker :)

Synst det virker som den beste og mest logiske metoden for å lage en god side, først må du jo vite hvordan den ser ut og slikt da så kan man kode den

Lenke til kommentar
FuLu

FuLu

Skrevet
Skrevet

Lokaltog sin metode høres veldig strukturert og ryddig ut ;)

 

Jeg pleier å leke litt i photoshop jeg og, helst så lik HTML versjon som mulig. Men noe spesielt god planlegging kan jeg ikke si jeg har på forhånd. Blir bare "random" prøv og feil for å finne noe jeg liker.

 

Jeg er ikke så flink til å ta vare på templates med ferdig kode, så jeg må skrive det meste om igjen, men jeg pleier å ta kopi av forrige webside sin index fil. Jeg har også tatt vare på en html fil med noen paragrafer med ferdig generert Lorem Ipsum. Denne bruker jeg for å fylle design/layout med "innhold" så jeg kan se hvordan siden oppfører seg med tekst. Bruker gjerne samme tekst for å fylle designet i photoshop og.

 

Enkel oppdeling for min del er H1 til header på siden, gjerne er alt wrappet i en DIV som samler hele siden. Dette gjør det greit å sentrere og bestemme bredden. DIV i to kolonner, en som er meny/sidebar og en for innhold. Så til slutt en footer.

 

Veien fra tegning til HTML/CSS er greit for min del, siden jeg tegner omtrent i samme struktur som det ville blitt i HTML. Jeg har en del layers i designet (photoshop), så jeg tar flatten på hele greia og tar select og klipper ut bilder som f.eks header, repeterende bakgrunn og footer osv.

 

Men jeg pleier å jobbe parallelt med oppretting av HTML fil og CSS samtidig som jeg klipper ut bilder jeg skal ha fra tegning. For da kan jeg se hvilke problemer jeg vil dulte borti (som kanskje krever nye bilder eller liten redesign). Mao, litt dårlig planlegging fra min side ;) Men parallelt arbeid på den måten synes jeg funker greit nok.

Lenke til kommentar
N*

N*

Skrevet
Skrevet
Jeg gjør kanskje ting litt tungvint, men jeg synes det funker veldig bra.
  • Lager et noenlunde komplett betadesign i Photoshop
  • Beslutter å lage HTML-versjon av designet
  • Oppretter full mappestruktur og bestemmer om jeg skal ha med funksjonalitet som stilskifter etc.
  • Kopierer templaten jeg har for å sende korrekte application/xhtml+xml-headere og et standard XHTML-dokument som jeg lagrer som index.php
  • Lager et oppsett med div-elementene jeg trenger for selve layout'en (gir alle layout-elementer en id og ikke en klasse, siden disse bare skal brukes en gang og fordi jeg derfor kan bruke dem som ankere i dokumentet mitt)
  • Programmerer et includescript som inkluderer et demodokument jeg på forhånd har satt opp med de fleste HTML-elementene jeg trenger (lister, avsnitt etc.)
  • Slicer opp all grafikken og lagrer med forståelige navn
  • Skriver et godt strukturert CSS-dokument med alle layoutelementer som er nødvendige

Jeg bruker vanligvis rundt 7-10 timer fra fullført Photoshop-beta til et noenlunde ferdig HTML-design. :)

det var nesten likt som meg det. forskjellen er at jeg ikke lager det noe serlig komplett i fireworks(ups. enda en forskjell) først.

Lenke til kommentar
neb

neb

Skrevet
Skrevet (endret)

1. tegne skisser for hånd (merk. skisser. ikke omfåttende tegninger)

2. finner en pen fargekombo, med en eller annen farge som basic.

3. Photoshopper siden slik jeg vi ha den. Lager et par eksemplarer med små forskjeller

4. Lager en mappestrukter. opretter index'en og basic style sheet.

5. kopierer et gammelt, validert CSS dok over, slik at jeg har noe og ta fra.

 

dette er skrittene jeg vanligvis følger når jeg skal opprette en ny side :)

Endret av bigben247
Lenke til kommentar
Dunestar

Dunestar

Skrevet
Skrevet

1. Oppretter nytt PS-dokument.

2. Leker.

3. Slicer.

4. Prøver å kode finfin markup med bra stilark til.

 

Jeg må si at jeg har en ytterst lite strukturert arbeidsmåte, men må si

meg ganske fornøyd med den. Per dags dato fungerer den flott til hverdags-

bruk. En slik økt kan ta rundt 8 timer. Ca. 3-4 til design og vanligvis noe mer

til kode.

Lenke til kommentar
Arve Systad

Arve Systad

Skrevet
Skrevet (endret)

1. En idè er viktig, så om eg ikkje har en gjør eg ingenting. Har eg en liten idè så snekrer eg den sammen så godt eg kan i PS. Kan ta alt fra en til tjue effektive arbeidstimer, alt etter min effektivitet og inspirasjonsnivå.

 

2. Deler opp og lagrer bilder med passande navn.

 

3. Fyrer opp DW og TopStyle og knoter ned alt til en grunnleggande layout for det aktuelle designet.

 

4. Fikser alle browserbugs i layouten.

 

5. Styler innhold (p, hX, ul, ol, dl osv)

 

6. Ser over en gang til i alle browsere for å vere sikker på at ting funker.

 

7. Setter inn innholdet på ett eller anna vis.

 

Edit

Altså - det man gjør for å bli dyktigare er rett og slett å lage sider. Øvelse gjør mester.

Endret av arve87
Lenke til kommentar
Cucum(r)

Cucum(r)

Skrevet
Skrevet

1. Oppretter et PS-dokument

 

2. Har det moro og leker meg litt

 

3. Finpusser

 

4. Deler opp

 

5. Oppretter et nytt dokument i Dreamweaver som allerede inneholder mesteparten av de sideelementene jeg kommer til å bruke (kontainer, meny, innholds- og sidebar-kontainer og footer)

 

6. Skriver CSS-koden så fort som mulig, uten å tenke på oversiktelighet :blush:

 

7. Done.

 

Normalt tidsforløp: 1-4 timer

Lenke til kommentar
halvardm

halvardm

Skrevet
Skrevet
1. Tegner det opp i PS

 

2. Deler opp bildene

 

3. Koder alt ting sammen

Jeg er helt grønn på dette, men dere lager et design i PS og så deler (slicer?) dere det opp og snekrer bitene sammen i forskjellige DIVs?

Jepp, det er sånn de fleste gjør det ja.

 

----------

 

Jeg bruker å sette meg ned forann pc'en uansett om jeg har en idè eller ei.

Så fyrer jeg opp Photoshop og improviserer eller følger ideèn min.

Når jeg er ferdig med det, kan det hende jeg finpusser og trikser litt.

 

Så når jeg er fornøyd er det skjelden jeg begynner å slice og sette sammen med engang. Det kan gå fra et par timer til et par dager før jeg orker å sette meg ned å dele opp bildene. Selv om det ikke er så stor jobb så er jeg ikke glad i å dele opp bildene.

 

Men om jeg skal kode tar jeg bare et utgangspunkt fra en annen side.

Fjerner/legger til DIV og fjerner omtrent alt av innhold.

Når jeg har satt sammen alt finpusser jeg og gjør de så like som mulig i alle browsere og styler andre elementer.

 

Alt dette foregår til musikk.

Melodisk musikk som oftest, men det varierer.

Lenke til kommentar
ingveh

ingveh

Skrevet
Skrevet

Min framgangsmåte

1. Skaffe inspirasjon (gjerne i Zen Garden)

2. Prøve meg fram i PS å få til et brukbart design

3. Dele opp bildene

4. Kode det hele sammen på en best mulig måte

5. Fikse bugs i ulike browsere (som oftest IE)

 

 

Med mye inspirasjon og mange gode idéer, bruker jeg sikkert få det til på en ettermiddag/kveld, men det tar som regel litt lengre tid...

 

:)

Lenke til kommentar

Opprett en konto eller logg inn for å kommentere

Du må være et medlem for å kunne skrive en kommentar

Opprett konto

Det er enkelt å melde seg inn for å starte en ny konto!

Start en konto

Logg inn

Har du allerede en konto? Logg inn her.

Logg inn nå
Gå til emneliste

  • Hvem er aktive   0 medlemmer

    • Ingen innloggede medlemmer aktive
×
×
  • Opprett ny...