Design and code or just code?

6 replies
  • WEB DESIGN
  • |
Hi everyone I just started doing some web design starting a few weeks ago and I have a question. When you create a website, do you design headers, nav bars etc in photoshop and then code them using html / css / php etc or do you code everything and style it with css to make it look flashy. I feel like designing it would take a hell of a lot less time and then just implementing it into the code. Because using all of the css codes takes long, at least for me.

Basically do you design in photoshop then code all of your images

or

just code and then style it if that makes any sense lol.
#code #design
  • Profile picture of the author Michael Westgate
    You are correct! You must design first using a design tool such as Photoshop, Gimp, or whatever takes your fancy. This is so you can focus on the task at hand, DESIGN, without getting distracted by coding and CSS issues.

    Once you have your DESIGN, you can then cut it up on screen, export your images, and use it as a reference point for dimensions and colours when coding. As you have said, the coding can take some time and so it is vital to have your designs in Photoshop to reference. It also becomes invaluable with the inconsistencies across browsers and screen sizes.

    I'm more of a coder so for me personally I'm most happy when I start with a designed site and change the code/css/images .
    {{ DiscussionBoard.errors[7573169].message }}
    • Profile picture of the author blogfreakz
      Originally Posted by Michael Westgate View Post

      You are correct! You must design first using a design tool such as Photoshop, Gimp, or whatever takes your fancy. This is so you can focus on the task at hand, DESIGN, without getting distracted by coding and CSS issues.

      Once you have your DESIGN, you can then cut it up on screen, export your images, and use it as a reference point for dimensions and colours when coding. As you have said, the coding can take some time and so it is vital to have your designs in Photoshop to reference. It also becomes invaluable with the inconsistencies across browsers and screen sizes.

      I'm more of a coder so for me personally I'm most happy when I start with a designed site and change the code/css/images .
      Nice and complete information... I usually designed my project using photoshop for mock up and slice then code it in xhtml/css..
      {{ DiscussionBoard.errors[7573849].message }}
  • Profile picture of the author run
    It's not bad if you just go and create website without any mock up, but the time comsuming will be longer than you have mock up in hands.

    For the design of header and navigation menu, it is based on those menu output. If it could replace by CSS, we will use css. If it is complex colors/images, we slice it to the proper position and code it. Yet, we still need Mock Up as reference to reduce designing conception while we do coding.
    Signature
    I just wanna tell you that most of the links in the signature are trash and/or a trap to make you pay!
    {{ DiscussionBoard.errors[7573266].message }}
  • Profile picture of the author mafai44
    Awesome thanks guys.. So designing in photoshop then slicing and coding. Just what I was looking for.
    {{ DiscussionBoard.errors[7576592].message }}
  • Profile picture of the author icon24
    Yes I agree with Michael. The best way that has worked for me has been to design the full layout in photoshop and then cut up anything that has a unique graphical design to it and anything that has a flat color I would implement in using the css so if it needs to be changed in the future you don't have to go back into photoshop to do it.

    Joe
    {{ DiscussionBoard.errors[7580481].message }}

Trending Topics