web design where to start?

Xsubnoize913

Currently im taking a web design class at school. The teachers method sucks so i've basically taken it into my own hands to teach myself. I know HTML/CSS a little javascript but thats not what i meen by where to start. I mean what steps do you take when designing from scrap. Do you start planning on paper, writing the html of your homepage, start with stylesheets? What is your order of operations when designing a website from scratch totse?

Dfg

Well, it really depends on the project and your workflow. I would recommend watching some tutorials on designing websites by Lynda or VTC. In real world most users use Dreamweaver or other application to code and design their websites. For a good website builder you need to manage Photoshop and other editing tools.

But for basic, you should start with paper. I usually draw webpages on paper lile little boxes with arrows connecting the various pages and then I would make a draft layout on paper like what columns I am going to use and what type of layout I am aiming for.

When you're confident with your concept, you started making the layout, like making divs and creating the framework. I start with making the layout like if I have a website with a header, footer, content area I would make those sections and define the width and height for each box.

Btw you should decide which units you're going to use, like would it be elastic or defined and what would be the resolution. The hard part is the designing, getting things right, matching the colors. I usually avoid that but sometimes you have to do it.


After that I start looking for examples and finding some better effects. I focus on CSS and try to use as much CSS as possible but the problem comes when you're making a site compatible with IE, Chome, Mozilla. For one effect each browser uses a different method, so you have to back and forth from time to time.


TL;DR:
Draw it on paper,
Test different layouts,
Use a program like Fireworks to create the layout and add the elements. Like make the final website on Fireworks so you get an idea how it should look.You can import the design to Dreamweaver but it's best if you start building from scratch. This step mostly applies when you're showing to the clients but most prefer a working demo.
Code the site and test it in Dreamweaver, google helps a lot. Make sure to test the site in various browsers, run some validation checks.

Xsubnoize913

Dfg wrote: »

Well, it really depends on the project and your workflow. I would recommend watching some tutorials on designing websites by Lynda or VTC. In real world most users use Dreamweaver or other application to code and design their websites. For a good website builder you need to manage Photoshop and other editing tools.

But for basic, you should start with paper. I usually draw webpages on paper lile little boxes with arrows connecting the various pages and then I would make a draft layout on paper like what columns I am going to use and what type of layout I am aiming for.

When you're confident with your concept, you started making the layout, like making divs and creating the framework. I start with making the layout like if I have a website with a header, footer, content area I would make those sections and define the width and height for each box.

Btw you should decide which units you're going to use, like would it be elastic or defined and what would be the resolution. The hard part is the designing, getting things right, matching the colors. I usually avoid that but sometimes you have to do it.


After that I start looking for examples and finding some better effects. I focus on CSS and try to use as much CSS as possible but the problem comes when you're making a site compatible with IE, Chome, Mozilla. For one effect each browser uses a different method, so you have to back and forth from time to time.


TL;DR:
Draw it on paper,
Test different layouts,
Use a program like Fireworks to create the layout and add the elements. Like make the final website on Fireworks so you get an idea how it should look.You can import the design to Dreamweaver but it's best if you start building from scratch. This step mostly applies when you're showing to the clients but most prefer a working demo.
Code the site and test it in Dreamweaver, google helps a lot. Make sure to test the site in various browsers, run some validation checks.

you deffinatly just pretty much summed up the last couple hours of my night lol

Skittles

I usually create the look of the site in Photoshop or Illustrator first. From there you can just chop it up and stick it together in Dreamweaver. Also, Flash Catalyst is pretty easy to learn if you want to blow everyone away

Unknown

I usually do things in this order...

- Basic HTML layout. I mean REALLY basic.
- After about 10 minutes, I write out the CSS, which is on an external stylesheet (external gets loaded to cache so it improves site loading times)
- Once the CSS is all done, I'll be able to design the site properly. The barebones of it all is down to HTML, and some PHP here and there.

In short, learn how to do HTML and CSS and use them together.

Once you can build a small site with a few pages and learn how everything works, dip into a little PHP.

OH, and if you need help, ask!

EDIT: ALSO, fuck dreamweaver and all that shit. Use Notepad++ for coding, it fucking owns.

Skittles

Ffffssss you guise and your notepads. I edit everything in the preview window of Dreamweaver and it does it all for me. Granted it makes a few mistakes, but at least it makes my coding a lot easier

Xsubnoize913

trx100 wrote: »

EDIT: ALSO, fuck dreamweaver and all that shit. Use Notepad++ for coding, it fucking owns.

Funny i currently use notepad++:thumbsup: