ultimate's Avatar
ultimate 4
16 Asked
7 Answered
1 Best
2
No one has voted on this question yet :(
3 years, 3 months ago

How do you plan and design a website layout?

What methods would you recommend to plan and design a website? Do you initially formulate a layout on paper and then translate it to Photoshop, Illustrator, Fireworks, or some other graphical application? If so, what is the best program to use? Do you layout the graphics and then cut them into individual pieces to work with for the coding of the site?
Tip for best answer: M$1.00
Separate topics with commas, or by pressing return. Use the delete or backspace key to edit or remove existing topics.

You can leave an optional "tip" with Mahalo's virtual currency, Mahalo Dollars. If you are asking a difficult question that might require some research, or if you'd like a wide variety of feedback, a higher tip often leads to more answers to your question.

M$

What is Your Answer?

0
0
0

4 Answers

2
toofat2serve's Avatar
toofat2serve | 3 years, 3 months ago
3
First, do some research into exactly WHAT you want your site to do. Find out if you need a catalog, multimedia, payment system, blog, etc.

Then, find someone with design sense. This can either be a friends WHO IS A DESIGNER (not just a friend who wants to help), or hire someone.

Thievery is alive and well on the web. Now, don't outright steal content and designs, but I suggest hitting the web to have a look at whats out there, noting what you like, and formulating an idea based on that. You're not limited to websites either. Don't be tacky about it, but you can get a lot of great ideas from the meatspace, like business cards, poster ads, etc. Some places to start for design inspiration are

http://csszengarden.com
http://webdesignledger.com/category/inspiration
http://www.webdesignerdepot.com/
http://www.webcreme.com/
http://sixrevisions.com/web_design/16_sites_web_design_inspiratio/
http://www.asiteaday.org/

Once you have an idea of what elements you want on your page, STOP THINKING ABOUT THE DESIGN.

WORK. ON. CONTENT. Seriously. A great, killer design means precisely squat without content to sustain it. Plan out content. Write some stuff. Hire a copywriter if you need to. Just don't try to design a container (website) for an unknown volume (content).

Now that that's out of the way, back to the design.

My advice is wireframing. You can do this in almost any graphics editor, or you can do it with construction paper and scissors. Your choice (the construction paper is more fin, though :) )

Some wireframing resources:

http://www.boagworld.com/usability/quick_and_dirty_wireframes/
http://www.sitepoint.com/article/wire-frame-your-site/

There should be a bunch of info in here about selecting/building a CMS, using frameworks, etc: but that's beyond the scope.

What should be said is to remember that there is a tool for every job.

CONTENT = HTML.
PRESENTATION = CSS.
BEHAVIOR = JAVASCRIPT.

*Inset web standards lecture here*

You can leave an optional "tip" with Mahalo's virtual currency, Mahalo Dollars. If you are asking a difficult question that might require some research, or if you'd like a wide variety of feedback, a higher tip often leads to more answers to your question.

M$
morriss003's Avatar
morriss003 | 3 years, 3 months ago Report

Great answer

ultimate's Avatar
ultimate | 3 years, 3 months ago Report

Thanks a ton for the advice and good links. I probably should have explained what I'm doing and what I have in the original question...

I'm redesigning a company website which will basically just communicate the services we provide, testimonials/case studies, etc. - fairly basic stuff. I have most of the actually written content created. I plan to build the site using xhtml and css.

I'll read up on how to create a wireframe and piece one together once I've drawn inspiration from other well designed sites.

santus_lupinus's Avatar
santus_lupinus | 3 years, 3 months ago Report

This is perhaps the best answer I've seen all day; one that holds true to every website I've yet designed. Good stuff. Personally, I work in flash, but the same design principles hold.

Report Abuse

Post Reply Cancel
1
phrees's Avatar
phrees | 3 years, 3 months ago
4
Start with the end users of your site. What are the most important tasks that your most valued users want to do when visiting you site?

- compare prices?
- compare features?
- find out about features and benefits?
- learn how to use your products and services more effectively?
- get support?
- check project status?
- buy things?
- find out where to buy things?
- communicate with your staff?
- evaluate your expertise?

Once you have a prioritized list of tasks and users, work out the type of site that can best matches those tasks - blogs, e-commerce, project, portfolio etc.

Depending on how standard or unique your site is you might want to get straight on with building something, or go through a couple of prototyping phases. Ideally involve end users in building and evaluating your prototypes.

Unless your site is a unique technical innovation, build it using some standard, robust systems or frameworks. If you have competent IT staff host it yourself. If you don't, run with a hosting service that updates and maintains your cms/blog or use a product/framework that has commercial support available. (Wordpress, Concrete5, Acquia Drupal).

At all times keep a focus on the end user whilst balancing aesthetic and functional designs.

You can leave an optional "tip" with Mahalo's virtual currency, Mahalo Dollars. If you are asking a difficult question that might require some research, or if you'd like a wide variety of feedback, a higher tip often leads to more answers to your question.

M$

Report Abuse

Post Reply Cancel
0
newbey's Avatar
newbey | 3 years, 3 months ago
3
Find several sites you like in your niche and then combine the best features of each. Software tools are a secondary consideration.
source(s):
Personal experience.

You can leave an optional "tip" with Mahalo's virtual currency, Mahalo Dollars. If you are asking a difficult question that might require some research, or if you'd like a wide variety of feedback, a higher tip often leads to more answers to your question.

M$

Report Abuse

Post Reply Cancel
-1
garryvictor1's Avatar
garryvictor1 | 3 years, 3 months ago
4
First, I draw the layout in a piece of paper then transfer the drawing to Adobe Photoshop. Do not use table when creating websites because it will ruin your page rank. Instead, use CSS. Cut the pieces through Adobe Image Ready and code the CSS to your favorite text editor.

You can leave an optional "tip" with Mahalo's virtual currency, Mahalo Dollars. If you are asking a difficult question that might require some research, or if you'd like a wide variety of feedback, a higher tip often leads to more answers to your question.

M$

Report Abuse

Post Reply Cancel

Learn something new with our FREE educational apps!

Private lessons in the comfort of your own home. Get back in shape or finally pick up a guitar with our great experts guiding you the whole way!
Learn Guitar
Learn Hip Hop
Learn Pilates