Contents of a BEAUTIFUL Website

+2 Shreyansh Rana · November 24, 2014
Guys, I am making a website for  TechLovers and but am not able to get a beautiful website. Whatever I amke dissapoints me :( 

Please can anyone give me a list of things that make a beautiful site. 

Thanks a lot 

Post a Reply


Oldest  Newest  Rating
+2 Mitch Mullvain · November 26, 2014

The main things to consider for a beautiful website is your target audience. Since you said tech lovers, visit tech websites. See what features look good and what don't.

IMPORTANT: successful websites are based off something original, or something in existence that could be made better. So what can you create that's better than what exists already. 

Keep it simple and nice. If you're not the best with design, hire a graphic designer. A basic website has a header, navigation, article, aside, and footer. The colors need to flow. Google different color design schemes. Also find a scheme that makes people think technology.

I'm on my phone currently, so I haven't gone too in depth. Let me know if you need some help, I can design templates pretty well so I could help you or give uou some more pointers that go into depth. Let me know.
0 Elber Elberito · November 26, 2014

how can you get design templates pretty?
+2 Mitch Mullvain · November 26, 2014
It depends what your question entails. Actual structure wise, I personally prefer something like Design D on this image:

I say this because If you view it in contrast to the others, then it gives you a header for a logo, search bar, login/register button(s), etc; it also gives you a navigation to different pages or directories as well as a sidebar for members features and ads. This design in my opinion gives you the most content in a reasonably constructed space giving you an optimized amount of area to write content in the article.

Now if you are talking about actual color and graphics and such pretty, then I will elaborate more. 

First view a couple websites:

1. :
This website while good for tons of useful information, what really matters at first glance is the home page. IT'S CLUTTERED! It's color scheme is good though. Mostly gray with some red. Gray is a good neutral color, it doesn't hurt the eyes. Pizza Hut recently changed their website from all red to mostly gray because red was blinding.

2. :
The color scheme on here is also pretty nice. It is light gray, black, and a hint of blue. But it is also cluttered. Another problem is that the toolbar is too low. Nearly halfway down the screen at first glance. NOTE: to make it easy to find something, make your search bar big, at the top, and centered. 

3. :
This one is my favorite design of the three. Mostly gray with little black and blue. Not as cluttered, and I think the search bar should be a little more obvious, but otherwise better; not cluttered.

Now as colors go, you've seen the big guys use light, relaxing, BASIC color schemes. Go to to get some palettes. 

I have one that is an example of a good color variety:

Here are some horrible examples: or

Now if it is a CSS or HTML problem, then maybe show me some of your code and I could help you with it.
-2 Ron Butcher · November 27, 2014
@Mitch Mullvain gave some great tips and links.  The only thing that I could add is to check out some web design template sites like and look through their designs.  I like to mix and mash ideas from these sites to create my own design.
0 Brendon McBain · November 27, 2014
Hello Shreyansh, if you post a photo of your progress so far I'm sure many of us can contribute and get it looking better! ;)
0 Shreyansh Rana · November 28, 2014
Thanks a lot guys.
@Mitch I'll definately contact you for any advise . u seem to be a wise guy :)

@Brendon I'll soon post up some photos of the website(updated)

Cureent state (i knw ts very bad) :

Any suggestion, criticism is welcome.
0 Mitch Mullvain · December 9, 2014
I'm sorry I haven't said anything in awhile (I was on a minecraft bender while my school was on break).

Is your design still the same?
If so, the black text at the top needs to be easier to read for sure. Cool tip: White text with black stroke  on the edges works with every background.

Also, the logo needs to be cropped and I recommend deleting the white background in a program like Photoshop and saving it as a PNG (JPEG doesn't save transparently).

While I do like the blue bordering, I recommend dropping the multi-color rainbow background. Too intense and distracting.

Let me know of any updates please.
  • 1

HTML / CSS / Web Design


Discuss, share, ask, learn and teach HTML5 and CSS3.