I am having a hard time learning web design. I read several books and I know a bit of how to do things. I also like to study with firebug how the “big guys” made their web sites. But when I try to realize of how a complex ecommerce site is done I usually catch myself of do not know what to do next. Lets say I can easily write content in html, but when I want to attach css rules it is really hard for me to think of what should go next and what it will change. It is really hard to explain my problem, but is there a method of how to implement things, like a correct order or smth? Maybe web designers think in blocks or they imagine everything in their heads the whole process or I just have to put a lot more time into this?
I just looking forward to these days when I will be writing html/css code whitout looking for help online or at the other sites 🙂
Answer
It looks like you’re starting in the wrong place, especially as a designer. If you were primarily a programmer, I would understand, but since you’re posting in a graphic design exchange, I’ll jump to it. Correct me if I’m wrong, but I’ll assume you have been crafting your designs with HTML, and then you are moving to CSS.
Here’s the most important part: everyone designs differently, it’s just how our heads work. For example, I find myself jumping from style to style as soon as I get bored of another. I work very non-linearly.
However, I, and most designers like me, always start in one place.
Anyway, most designers start on a piece of paper first, sketching out concepts and fleshing out ideas. Once you have a rudimentary concept, move onto Photoshop (or Illustrator, some swear by it, I don’t). Here, I’d create static mockups of every single page on the site. Only then would I craft the HTML and CSS.
Of course, for E-Commerce sites, or any service-type sites, the next step is properly integrating the site with PHP or Ruby on Rails, which requires a whole ‘nother book.
A helpful tip that I learned a little too late is to use a grid system, like 960.gs or inuit.css. Keep this grid in mind when you mockup your site.
Happy Designing!
Attribution
Source : Link , Question Author : user385917 , Answer Author : Farray