Web Design Forums

General Web Design Discussion

Have general questions about web design? Need help figuring out how to lay your site out, what style to use or how to make an image? Need help picking between photos for your homepage? Post your question here!

Website designing approaches



Site of the Month Voting - Now Open. CAST YOUR VOTE NOW!

Reply
 
LinkBack Thread Tools
Old February 23 '10, 12:20 AM (#1)
Azmisov is offline
New Member!
 
Azmisov's Avatar
 
Join Date: February 2010
Location: Iceland
Posts: 6
Azmisov is an unknown quantity at this point
Website designing approaches

So, usually when I start a website, I just map out the layout on paper, then start coding. I'll usually get half way through all the coding and layout stuff before I completely redo all the CSS. Then, once I finish the site, I usually go back in and make some more CSS themes if I have time.

I've seen a lot of people actually draw out what they want the actual website to look like in an image editing software first. Then, once they have the design and graphics ready, they start coding and laying out. I was thinking of trying this approach and seeing how well it goes. What design approaches to you guys take? Opinions, suggestions?
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!
Reply With Quote
Old February 24 '10, 03:39 PM (#2)
mlseim is offline
WDF Staff
 
mlseim's Avatar
 
Join Date: April 2004
Location: Cottage Grove, Minnesota
Posts: 3,359
mlseim has much to be proud ofmlseim has much to be proud ofmlseim has much to be proud ofmlseim has much to be proud ofmlseim has much to be proud ofmlseim has much to be proud ofmlseim has much to be proud ofmlseim has much to be proud ofmlseim has much to be proud ofmlseim has much to be proud of
I like to see the page as it should look ... as a PDF file,
and then determine how I will do the layout based on how it looks.

It's important to know how wide the page will be (fluid or fixed),
and how the various areas (or sections) of the page will grow with text/content.

Knowing the changes in content will determine how to handle any background
images or color ... in some cases, it will require the design to change. A good thing
to catch right away, as it can save a lot of time.

Try doing it that way ...
Make an actual mock-page with graphics and text and then look at it side-by-side
with CSS layouts like these: http://layouts.ironmyers.com/

See if you can match a particular CSS layout with your design. Break apart any
necessary background images and work with fluid (or changing content). You
might find that designing your own CSS templates, themes, and layouts will be
much easier to do.
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!
Reply With Quote
Old February 27 '10, 05:57 AM (#3)
salonline is offline
WDF Addict!
 
salonline's Avatar
 
Join Date: January 2010
Location: bangalore
Posts: 190
salonline has a little shameless behaviour in the past
I usually prefer designing in photoshop the complete page. And then start coding.This way i know before hand how the outcome should look.
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!
Reply With Quote
Old March 1 '10, 04:33 AM (#4)
MadRukus is offline
WDF Member
 
MadRukus's Avatar
 
Join Date: January 2010
Posts: 51
MadRukus has a little shameless behaviour in the past
I also design the comp in photoshop then code as well. Prior I usually do some rough pen sketchs on paper to get an idea before diving into photoshop.
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!
Reply With Quote
Old March 3 '10, 05:49 AM (#5)
diddy is offline
[insert witty comment here]
 
diddy's Avatar
 
Join Date: June 2008
Location: Sydney, Australia
Posts: 495
diddy will become famous soon enoughdiddy will become famous soon enough
I play with mockups in photoshop, until the client is satisfied with the design, then I code it up. No slicing btw - hand coding all the way, with Notepad++. Dreamweaver is overrated.

This way, I do a quick design, thus not wasting unnecsssary time on the coding, which I find is the more time-consuming part.
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!
Reply With Quote
Old March 3 '10, 05:51 AM (#6)
joomlads07 is offline
New Member!
 
joomlads07's Avatar
 
Join Date: February 2010
Location: 3 Locust Street, Suite A Assonet, MA 02702
Posts: 4
joomlads07 is an unknown quantity at this point
I just focus on these e key elements :

- pages should load quickly and provide something to read almost instantly;
- pages should be well laid out and easy to assess i.e. work out what they are about;
- pages should be static i.e. they do not jump about as images load;
- pages should be"search engine friendly";
- pages should be easy to navigate so that you can find what you want;
- and most importantly, the content is useful and worthwhile.
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!
Reply With Quote
Old March 3 '10, 05:55 AM (#7)
diddy is offline
[insert witty comment here]
 
diddy's Avatar
 
Join Date: June 2008
Location: Sydney, Australia
Posts: 495
diddy will become famous soon enoughdiddy will become famous soon enough
Quote:
Originally Posted by joomlads07
I just focus on these e key elements :

- pages should load quickly and provide something to read almost instantly;
- pages should be well laid out and easy to assess i.e. work out what they are about;
- pages should be static i.e. they do not jump about as images load;
- pages should be"search engine friendly";
- pages should be easy to navigate so that you can find what you want;
- and most importantly, the content is useful and worthwhile.
Some great advice!
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!
Reply With Quote
Old March 4 '10, 12:22 AM (#8)
aeroweb99 is offline
<div id="learn"></div>
 
aeroweb99's Avatar
 
Join Date: February 2008
Location: Port Huron, Michigan
Posts: 965
aeroweb99 is just really niceaeroweb99 is just really niceaeroweb99 is just really niceaeroweb99 is just really niceaeroweb99 is just really nice
Quote:
Originally Posted by diddy
Dreamweaver is overrated.
Diddy, don't get me started!
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!
Reply With Quote
Old March 4 '10, 12:28 AM (#9)
diddy is offline
[insert witty comment here]
 
diddy's Avatar
 
Join Date: June 2008
Location: Sydney, Australia
Posts: 495
diddy will become famous soon enoughdiddy will become famous soon enough
Quote:
Originally Posted by aeroweb99
Diddy, don't get me started!
....on how DreamWeaver is overrated, or are you against me too?

I'm a strict code-it-by-hand person, and then simply go to the browser and hit "refresh". I have absolutely no need for a WYSIWYG editor, so Notepad++ works absoltuely fine for me. Plus it can write all kinds of stuff from html and css to php, asp, java, python etc. It's great. (and it's free! )
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!
Reply With Quote
Old March 4 '10, 10:40 AM (#10)
aeroweb99 is offline
<div id="learn"></div>
 
aeroweb99's Avatar
 
Join Date: February 2008
Location: Port Huron, Michigan
Posts: 965
aeroweb99 is just really niceaeroweb99 is just really niceaeroweb99 is just really niceaeroweb99 is just really niceaeroweb99 is just really nice
I'm for DW. But this thread will get out of control if we start that debate.

In a nutshell:

- You can still hand code in DW.
- The CSS features alone will save you tons of time, and it's all semantic, w3c and all that.
- It has a great ftp
- I don't have to worry about typo's, which can lead to very valuable time to find
- Link and file updating across pages are very handy
- The wysiwyg is actually pretty darn accurate
- It highlights your div boxes so you can see exactly where they are, which is handy for positioning
- You can work with the css file without having to switch pages or programs, it's all in one view
- Drag from an href link to a file in the files pane, takes literally 1 second, so no time to type and no typos

I could go on. However, I don't use it for any backend coding, which I would imagine may be a whole different story.
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!
Reply With Quote
Old March 23 '10, 04:57 PM (#11)
jj1 is offline
jj1
WDF Regular
 
jj1's Avatar
 
Join Date: October 2008
Posts: 250
jj1 is on a distinguished road
I use macromedia fireworks (others use photoshop) and I design my website to the pixel within this. I can then copy the images (all correctly sized) straight into my website.
Personally, I find it is easier to get measurements correct in fireworks before I start coding rather than spending hours tweaking, correcting code, correcting images, tweaking, correcting code, correcting images etc.
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!
Reply With Quote
Old March 25 '10, 07:18 AM (#12)
jamesparker is offline
Account Closed
 
jamesparker's Avatar
 
Join Date: November 2009
Posts: 19
jamesparker is an unknown quantity at this point
Use Photoshop for image editing and creating other graphics. If you are not familiar with Photoshop then let me tell you that its not at all difficult to learn. There are a number of tutorials available online to teach to web designing with the help of Photoshop.
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!
Reply With Quote
Old March 30 '10, 09:09 PM (#13)
joralyd is offline
New Member!
 
joralyd's Avatar
 
Join Date: March 2010
Location: Australia NSW
Posts: 12
joralyd is an unknown quantity at this point
like jj1 I use Adobe Fireworks to build a mockup and play with colours, graphics text, layouts until I like what I see, I'm a visual person and I like to see every element of the design together, then I start slicing and putting it straight into Dreamweaver (hand coding is over rated ).
I do still draw a very basic "stick figure" layout on paper if a design idea comes to mind and I'm doing something else at the time.
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!
Reply With Quote
Old April 3 '10, 12:54 PM (#14)
justine is offline
New Member!
 
justine's Avatar
 
Join Date: April 2010
Posts: 1
justine is an unknown quantity at this point
Good advice.... it help a lot. What important in a website is that it is user friendly and fun to explore.
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!
Reply With Quote
Old April 3 '10, 08:20 PM (#15)
joralyd is offline
New Member!
 
joralyd's Avatar
 
Join Date: March 2010
Location: Australia NSW
Posts: 12
joralyd is an unknown quantity at this point
totally agree, often the simplest designs are the best, I always try and keep the text on the home page to a minimum and aligned to the left, nothing worse than trying to force your eyes to read centered text. I also like to use Verdana font I hate crappy cheap looking fonts LOL I guess it's a designer thing
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!
Reply With Quote
Old May 20 '10, 07:25 PM (#16)
jorgiak is offline
WDF Member
 
jorgiak's Avatar
 
Join Date: April 2010
Posts: 21
jorgiak is an unknown quantity at this point
I start mock-ups in photoshop and illustrator. Starting with colours, graphics, a basic layout, content and information. I create about 3 different designs, with either the client picking the best one, or a majority vote (not leaving the final design for me to decide)! I then create as many pages as needed, then convert it to a pdf.
I find printing out the layout and having it as a hard-copy infront of you really helps when you are designing the webpage.
Personally, I use Dreamweaver, as I don't really know any different.

Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!
Reply With Quote
Old May 21 '10, 03:33 AM (#17)
rennimark is offline
Registered User
 
rennimark's Avatar
 
Join Date: May 2010
Posts: 1
rennimark is an unknown quantity at this point
Hi
I want to have a website for myself. Is anyone know best web designing service in Australia which gives full maintenance and support and 100% commitment to satisfy all my needs.
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!
Reply With Quote
Old May 21 '10, 02:25 PM (#18)
mlseim is offline
WDF Staff
 
mlseim's Avatar
 
Join Date: April 2004
Location: Cottage Grove, Minnesota
Posts: 3,359
mlseim has much to be proud ofmlseim has much to be proud ofmlseim has much to be proud ofmlseim has much to be proud ofmlseim has much to be proud ofmlseim has much to be proud ofmlseim has much to be proud ofmlseim has much to be proud ofmlseim has much to be proud ofmlseim has much to be proud of
Rennimark ...

I think you know that you can use Google:
http://www.google.com/#hl=en&source=...7671ef050a6f1e

If you're planning on getting a link placed on WDF for SEO purposes, it won't
last on here very long ... Just so you know ... I'm keeping an eye on it.
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!
Reply With Quote
Old May 25 '10, 09:35 PM (#19)
alieshaorth is offline
New Member!
 
alieshaorth's Avatar
 
Join Date: April 2010
Location: Gold Coast
Posts: 18
alieshaorth is an unknown quantity at this point
Pesonally the fisrt thing I do is research the clients company Im designing the site for. This includes getting them to fill out a 'project questionaire' this will help provide you with some basic information about the project and assist you to understand their needs (ie. logo colours and font style, what they want to achive with the site, what they actually do).

Then I will start doing a number of different 'home page' full colour mock-ups in Adobe Illustrator and Photoshop. Usually about 3 is more than enough. Once the client has agreed on an initial design I will then go back to Illustrator and Photoshop and complete the final mock-ups with a storyboard PDF of the 'main pages' (ie index, about, services, contact etc). This storyboard will contain snapshots of each page as well as info about functionality, colous, font styles, images need, sizes etc.

This is usually given to the client along side a 'project management' document which outlines the entire project including an overview, goals and milestones, design considerations, site resolutions and restrictions, testing strategies, a fee summary and an outline of your copyright. This document must then be signed off by the client and myself and a deposit must be made BEFORE I begin to code it.

Once this is done I then optimize and slice any relevent images needed for the site and start coding in Adobe Dreamweaver.

Hope this helps.

Cheers Aliesha
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!
Reply With Quote
Old May 28 '10, 09:00 AM (#20)
andr104 is offline
WDF Regular
 
andr104's Avatar
 
Join Date: November 2008
Posts: 411
andr104 is an unknown quantity at this point
I prefer to make a sketch first and than orient on it while coding in order to receive exactly what I want.
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!
Reply With Quote
Reply

  Web Design Forums » Web Design Help » General Web Design Discussion

Bookmarks


Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)
 
Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is Off
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are On


 
User Infomation
Your Avatar

Site Of The Month
Nominate Your Site Now!

Advertisement
WolfCMS.org

Latest Articles
- by RickM
- by bfsog

Advertisement

Partner Links



All times are GMT -4. The time now is 02:00 PM.


WebDesignForums.net is Copyright © 2010 RikeMedia.

SEO by vBSEO

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164