ENI have patched up my own blog layout but I’m no expert or a professional layout maker so my layout is mostly build with basic html and css codes. And it is still not done yet!I thank you for your positive comments and feedback too! Even though I’m no professional html and css coder I’d still like to share my tips, advices and handy sites I have used for my blog layout. NLMijn nieuwe blog layout heb ik zelf in elkaar geflanst ontworpen. Ik ben zelf geen expert erin dus mijn lay-out is inelkaar gezet met de meest eenvoudige html en css codering.Mijn layout is nog niet helemaal klaar hoor maar dankjewel voor de positieve reacties en feedback van jullie! Ik ben dus geen expert maar zou graag mijn tips, trucjes en handige sites die ik gebruikt heb met jullie delen.
- Get started!What I did firstly is draw out a rough sketch and concept on piece of paper. This way it gives you a look of what your future blog layout may look like! Have fun and set your creativity, idea's and the 'ifs' lose on paper!
All the visual aspects
- ColorsI have to admit that I'm a color person so I always have a dash of colors blooming in my blog. Bloggers who only use black and white as their main color often gives a nice clean and calm blog feel for readers. I want to achieve the same with colors! My tips:1. Find your colors by mix and match with paint testers!2. Choose no more than 3 main colors. To many colors distracts and it is also wise to know where to place the colors: if the background is colorful, make blogpost/sidebar more neutral.3. Colors = mood! My main colors are: light blue (relax), yellow (optimism) and coral (tranquilizing).4. White space: a very colorful and bright layout might bring clutter and overwhelm the readers. By adding white spaces it will make the elements in your blog layout more recognizable.
- BackgroundIn my previous layout I have a background pattern which I have left out in my newest layout. Not that I have outgrown patterned background but simply I want have a calmer and cleaner look. If you are planning to add patterned background make sure it is set to tiles.
- Head bannerFor my newest layout I have designed a head banner in Photoshop. Head banners are the first thing visitors will see and that is: the name of the blog (durrr) and a quick description of the blog abouts in words. My descriptions are not in words but instead I drew it.Make sure your banners speaks 'you' and your blog!
- Font and typographyMy current most used fonts: Georgia, Arial (Arial is the most readable font!) and Courier New. Not only are these fonts are used in my blogposts but also in the rest of blog layout. I think it's wise to limit the font use as it keeps legibility too. For other web fonts I get them from Google Fonts.My main language is English and a few years back I've translated my blogpost in Dutch too but not 100%. I want to provide easy reads to both groups by making 2 columns with Office Word. Though I'm still looking for another way to make the rest of my blogpost easy to read for English and Dutch visitors.
The layout placement
- SidebarFor my newest blog layout I want to have a sidebar because sidebar is a great space where I can place all my topics to be an eye catcher and to give visitors a clear idea of what to expect of my blog.UnclutteredMy plan for my sidebar is to keep it clean, neat and easy to navigate for visitors.I've decided to leave out commercial ads because honestly they are not really anyone's favorite right? And mostly they are not directly related to my blog content and plus it's a waste of sidebar space.Another plan for an uncluttered sidebar is to have a better 'intro' of my blog with profile picture, no screamy but subtle and enough to draw attention in my welcome greetings. The next thing is to make navigation through my blog easier.
- NavigationI am a lifestyle blogger and I have many topics and ideas that I want to share with the world. Making a simple and crystal clear navigation is very pre. I want to lead visitors as best as I can with buttons and categories. Hopefully I haven't made anyone tremendously lost in blog! Another great blog navigation is the 'search' bar for fast findings.I want my travel posts to stand out a bit more so I've made a map! A lot of guys have mentioned my little travel map and I've received positive comments of it! Thank you! I have created in Photoshop and upload it through Image-maps (free).NavbarI have made a scroll-with navbar with minimum button use. One of the new buttons are: press, categories and shop. I believe to not overdone the buttons or it will confuse visitors. Navbar or navigation bar is again a good shortcut for visitors to check out your blog.
- FooterThis time I've shorten and cleaned up my footer by removing my GFC, replacing my Instagram widget and blogroll. To personalize, I've add my little Ice Pandora motto and social media links on a nice yellow background.
- Html and css coding tips, tricks and hacks: I, II, III - it's meant for Wordpress mainly but a lot of these codes works for Blogspot too.
- Free blog templates: Designscrazed
- Stuck with a Html/css code? Get help at Stackoverflow, w3schools and leerhtml (Dutch)
- Create fun free graffiti names at Graffiti Creator
- My top 10 blogging tips, right here!