Web Design Color Palette, Font and Layout

I have finally done a layout drawing of how I want my website/web profile to look like. I decided how many pages and what each page was going to consist of. Below is a deign of my home or index page, all the rest will look similar just with different content.

I then thought about my colour scheme, I didn’t want to go too over the top, decided on greys and orange. See below for colour palette, I have decided the right two circles and the ever so light grey background.

The background hexadecimal is #F0F0F0, most text will be #9e9c9e and the highlight colour will be #fa7e1e. I decided my highlight colour by place a few orange items together and taking a picture for inspiration.

I think all my titles should use the css code @font-face and use ‘sansation’ as I previously found as an inspirational typeface for GraphicDesign. The font can be used free and downloaded from http://www.fontsquirrel.com/fonts/Sansation. The rest of the font I would like to have as ‘helvetica neue’, helvetica, arial, san-serif. I have chosen these fonts as they are no fuss, easy to read, also they are available pre downloaded on many operating systems. I have checked how strong my font stack is and the percentage of each users as to which font will most likely to appear  by using http://www.codestyle.org/servlets/FontStack.As I now have decided on layout and colours. See below for results.

So now I have decided on pages, layout, colours and font, I feel the next stage is to start building my content so I can start the hand coding of the HTML on each page. I will need to research into how to do tabs and floating columns and footers as this is what I will need to do the layout I have designed.

Advertisements