7 Replies - 1146 Views - Last Post: 04 February 2011 - 08:13 AM

#1 Sergio Tapia  Icon User is offline

  • D.I.C Lover
  • member icon

Reputation: 1252
  • View blog
  • Posts: 4,168
  • Joined: 27-January 10

I suck at DESIGNING a website. Help?

Posted 28 May 2010 - 02:25 PM

The Dreyfus model says the following process is used by almost everyone when learning something. I would say I'm at level 1 when it comes to designing a website. I can program it no problem; coding isn't an issue. It's the pure aesthetic that makes me freeze. I just don't know what to do.

1 Novice

* rigid adherence to rules
* no discretional judgment

2 Advanced beginner

* situational perception still limited
* all aspects of work are treated separately and given equal importance

3 Competent

* coping with crowdedness (multiple activity, information)
* now partially sees action as part of longer term goals
* conscious, deliberate planning

4 Proficient

* holistic view of situation, rather than in terms of aspects
* sees what is most important in a situation
* uses maxims for guidance, meaning of maxims may vary according to situation

5 Expert

* no longer reliant on rules, guidelines, maxims
* intuitive grasp of situation, based on tacit knowledge
* vision of what is possible


Do you guys recommend a book that grabs me by the hand and teaches me the correct way of designing a website? HTML+CSS is just so vast and full of possibilities and zero restrictions it's hard to get lost in the noise.

Thank you!

Is This A Good Question/Topic? 0
  • +

Replies To: I suck at DESIGNING a website. Help?

#2 KingCuddles  Icon User is offline

  • D.I.C Regular

Reputation: 176
  • View blog
  • Posts: 496
  • Joined: 20-December 08

Re: I suck at DESIGNING a website. Help?

Posted 29 May 2010 - 12:03 PM

I think this comes very much down to opinion.

I am a rubbish designer, I have 0 ability to create something that looks nice from my head, however I could code it with ease, if you gave me a design. Hence I consider my self a developer not a designer.

Also, I am not entirely sure that this is the sort of thing which can be taught, I believe its something which you either have or you don't, but that's just my opinion.
Was This Post Helpful? 0
  • +
  • -

#3 biggles2008  Icon User is offline

  • Bassface
  • member icon

Reputation: 9
  • View blog
  • Posts: 623
  • Joined: 05-March 08

Re: I suck at DESIGNING a website. Help?

Posted 29 May 2010 - 12:04 PM

You just need to make it to make it fun for yourself, lets face it if you don't enjoy doing something learning a new thing becomes tedious.

I guess there is no "Correct" way to design a website but try and stick to making it W3C compliant.

I taught myself HTML from http://html.net/ I thought their lessons were quite fun, but hey I was 12 when I taught myself and everything is fun then.

Learn your HTML first then your CSS, picture HTML as the foundations of a new building and the CSS as the decoration

After all that nonsense I just wrote I just realised your original reason for your post, you have a problem with the aesthetics of a website.

http://www.amazon.co...t/dp/0321303474 I enjoyed this book teaches you how to make the pretty stuff of a website with CSS. But after years of browsing other websites and taking note of the detail it becomes natural seeing what one of your websites needs.
Was This Post Helpful? 0
  • +
  • -

#4 Sergio Tapia  Icon User is offline

  • D.I.C Lover
  • member icon

Reputation: 1252
  • View blog
  • Posts: 4,168
  • Joined: 27-January 10

Re: I suck at DESIGNING a website. Help?

Posted 29 May 2010 - 01:14 PM

Thank you for the responses.

Rest assured I'm very good with HTML and CSS; it's just that I don't know how to put them together to produce a visually pleasing result.

I found a book that is really really good for people in my shoes. You learn how to build a website; awesome!

Check it out here.
Was This Post Helpful? 0
  • +
  • -

#5 cptnox  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 5
  • Joined: 30-May 10

Re: I suck at DESIGNING a website. Help?

Posted 30 May 2010 - 07:07 PM

Designing is all about passion. If you lack the passion and creativity to design something then I don't think its something you can just pick up from a book. Sure, you can be taught cool design techniques, but if you lack the ability to think up ideas on your own then I think you could have a hard time getting to grips with it.

In my opinion, the best way to design if you feel the way you do is this; go to a CSS gallery, browse the websites on there for inspiration. It's pretty amazing how fast you can come up with multiple ideas. Then all you have to do is figure out how you can make one of these inspirations 'your own'.

Also, if you have Photoshop, or any other Bitmap editor like this, just play around. Get a rough layout in your mind and then start building it up. The way i start is to usually make the logo, and then design the rest of a website around this; color scheme, style, etc. You'll be surprised how quickly you will begin to build up the foundations, and then all you have to do is code it up, which you previously stated shouldn't be a problem for you.

I wouldn't recommend buying a book on this subject, you cannot teach someone how to be creative; creativity comes from inspiration, and that my friend is something you have to go look for yourself!

Hope this helped, best of look to you in your endeavors!
Was This Post Helpful? 0
  • +
  • -

#6 Sergio Tapia  Icon User is offline

  • D.I.C Lover
  • member icon

Reputation: 1252
  • View blog
  • Posts: 4,168
  • Joined: 27-January 10

Re: I suck at DESIGNING a website. Help?

Posted 31 May 2010 - 05:01 AM

While I agree that creativity is a talent, correct usage of colors and general design principals are not. A book in necesary.
Was This Post Helpful? 0
  • +
  • -

#7 Oler1s  Icon User is offline

  • D.I.C Lover
  • member icon

Reputation: 1395
  • View blog
  • Posts: 3,884
  • Joined: 04-June 09

Re: I suck at DESIGNING a website. Help?

Posted 31 May 2010 - 10:47 AM

Websites are computer interfaces. All the books on HCI and usability are relevant. Search for books and book reviews on usability and designing usable interfaces.

Typography matters. You don't have firm control like print, and you must play by different rules (which studying HCI can prime you towards). Still, good layout matters. Books on type like Bringhurst's book are thus useful. There are books on creating a grid for a layout, and it's carried over to web design as well.

Accessibility matters. It's hard work to design a really accessible site. Still, when I make color choices, I factor in things like partial color blindness. Your sites should still be readable. Contrast and color choices should reflect readability first, unless you are making an art gallery. Most websites are not art galleries. They are interfaces and media for communication. The W3C accessibility guidelines are one starting point, but don't rely on them. Keep searching out for discussions on accessibility issues.
Was This Post Helpful? 0
  • +
  • -

#8 jaidinho  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 17
  • Joined: 03-November 08

Re: I suck at DESIGNING a website. Help?

Posted 04 February 2011 - 08:13 AM

This thread's 1/2 a year old but i thought i'd comment anyway.

my designing is better than my programming. when i'm asked to put "this" here & "link this to that - make the link purple" etc. i get frustrated because it's not how i'd do it.

the design can also make the programming easier if it's all set in stone.

there's nothing worse than adapting themes/designs once they're in place, and it makes things a lot harder if you're cheating in the code overwriting css with style commands.

i'd recommend grab an A4 pad. split a few pages into quarters or eighths for pages - whatever. label up what content will be in each page. then take full size or at least 1/2 sheet A4 & sketch with a bit more detail.
do it just roughly.

the main purpose of this is so you can see how much space you need. Lay out all your bigger sketches.
you'll be able to see if anything uses up room, or may realise some bits are too small, and could be tagged on the end of something else.

you may decide space could be filled with widgets or extra features like a search box, ad block, featured video or facebook link etc.

there are lots of small things that could help the user out on a site. Maybe currency converters - or their local time & your sites local time.

with these roughly correct (you'll always make changes later on but that doesn't matter once you have a basis)

looking at the sketches you'll then need to make them as uniform as possible & put items in correct places.

If you think it would be useful having lots of things at the top of the page to be immediately seen by a user, do that, etc. Ignore width restrictions when you do this - it doesn't matter if you don't think it will all fit & needs to go elsewhere. Your paper is not the web page.

Right, so now you have where everything NEEDS to go & the pages are similar in content layout.

You can now choose the style of your pages.

- if you have lots of content in the header or the top of the page you will need a full width page layout. Make your page content to only have say 10/15 px margins either side. If you need to go wider than the screen, go wider. You can have a landscape website - IT IS NOT ILLEGAL!!!

if you are going horizontal try to make the height as little as possible. A max of about 1200px should be strictly kept to, otherwise it's like your entire website is actually an iframe & there is too much content.

- if you've got big blocks of content but not neccesary to squeeze together then you can make a border for your page. imagine it was a brochure or a poster rather than an endless page.

sites like digg have invisible guides but you can be more creative and have your content block blue for instance(maybe a blue scroll etc. - it doesn't have to be square and normal) and the margins around it white. the footer and header could be in separate blocks to the content or part of the same, just with a change in color or a divider.

on twitter users pages there is a white block for content & separate blocks for header & footer. these overlay the margins whitespace which can be a picture or another colour.

- if you're pages only contain a few lines of text you don't want it spread all the way across the page. try floating other content to the side of it - if you want to incorporate a sidebar you can make this wider or put an extra large border around it to bump the text width narrower.

etc.
etc.
etc.

- after you've managed all that you have the website. so now you need to stylize the content. Make CSS for hyperlinks - if possible use the default blue hyperlinks purely as users will know they are hyperlinks & not just coloured text. You may choose to make linked items bold or italic or bigger etc.
depending when you will be using links you could make it so an arrow is in front of any link, that changes colour with the text when hovered over. If it's links in big paragraphs you will not want to do this, but to a file, or if the links will be separated you could.

Look at other sites the same colour as yours to see what fonts work. Some idiots make sites with all light colours or all dark & then nobody can read the site. Try not to use colours together you'd expect to see on a PC set to high contrast. this is rubbish.

if you have a black border with a white content box do not use black text - this will not work the same as black on white normally. you need the text to stand out from the outer background as well as the immediate. (black & white i just used for an example- the same applies to any colours)

----Everything else you should be able to manage with after you've done these steps------

do everything you can in CSS and print your css stylesheet to refer to whenever you edit or make a page B)
Was This Post Helpful? 0
  • +
  • -

Page 1 of 1