Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Using a static page for your one page website - Part 2


Published on

Part two of our 'using a static page for your one page website' article. If you require web designer services in Hull, please get in touch.

  • Be the first to comment

  • Be the first to like this

Using a static page for your one page website - Part 2

  1. 1. <ul><li>Using a static page for your one page website – Part 2 </li></ul><ul><li>This is part two of ‘Using a static HTML page for your one page website‘. Now we will cover the content, privacy policies, social buttons and colours. </li></ul>
  2. 2. <ul><li>Step 4 – The content. </li></ul><ul><li>You regularly see holding pages scrolling into the abyss, which no doubt will impact click-thru rates. </li></ul><ul><li>However if someone stays on your web page longer, it will increase your visitor time on the website, which is useful for Google ranking, as it could be deemed your page is indeed relevant to the search query. </li></ul><ul><li>However that said, it probably is advisable to include important links at the top of the page, as well as at the bottom. </li></ul>
  3. 3. <ul><li>Step 5 – The Privacy Policy. </li></ul><ul><li>This is one of the biggest areas website owners let themselves down. </li></ul><ul><li>If you are using an Ad network such as Google AdSense, then you do require a privacy policy, which means your one page website, should turn into a two page site! </li></ul><ul><li>Always make sure your website meets compliance with any T&C’s. </li></ul>
  4. 4. <ul><li>Step 6 – Going social! </li></ul><ul><li>Perhaps you wish to have active social media connections, such as Facebook, Flickr, LinkedIn, Twitter, YouTube and others? </li></ul><ul><li>A great way to clearly show you have social network accounts, is to create a tab to the side of the screen, and this way it doesn’t clutter your main content. In the HTML file, place this code directly underneath the <body> element: </li></ul>
  5. 5. <ul><li><div id=&quot;social&quot;> </li></ul><ul><li><a href=”” target=”_blank”><img src=”linkedin.png” width=”41″ height=”24″ border=”0″ alt=”linkedin” /></a><BR> </li></ul><ul><li><a href=”” target=”_blank”><img src=”youtube.png” width=”41″ height=”24″ border=”0″ alt=”youtube” /></a><BR> </li></ul><ul><li><a href=”” target=”_blank”><img src=”twitter.png” width=”41″ height=”26″ border=”0″ alt=”youtube” /></a><BR> </li></ul><ul><li><a href=”/optional-if-you-decide-to-have-a-social-page” target=”_blank”><img src=”follow.png” width=”41″ height=”100″ border=”0″ alt=”social details” /></a> </li></ul><ul><li></div> </li></ul>
  6. 6. <ul><li>The accompanying CSS code in the style.css file could look like: </li></ul><ul><li>#social float: right; margin-top:25%; </li></ul><ul><li>Now all you need to do is use a package such as the Gimp to create your images for the individual networks, which shouldn’t take long, if you modify free use images with the appropriate image licenses. </li></ul>
  7. 7. <ul><li>Step 7 – Using the correct colours. </li></ul><ul><li>It is important that you are not tempted to use colours that overwhelm the content. </li></ul><ul><li>The content and links should stand out, with clear headings, which colours can assist with. </li></ul><ul><li>Keep it simple is probably the best advice and if you have a logo, make sure the colour scheme reflects a planned house style. </li></ul>
  8. 8. <ul><li>Step 8 – Monitor your website statistics and tweak. </li></ul><ul><li>Don’t forget to monitoring your website statistics, tweak your page and test alternative layouts. </li></ul><ul><li>If you require a Hull web designer , please get in touch. </li></ul>