Web Design Icons
Check out these free high quality web icon sets. They look great for use in future design work and we will probably be using a few on our website too.
![]()
If you want to see more web icon sets then click here.
Check out these free high quality web icon sets. They look great for use in future design work and we will probably be using a few on our website too.
![]()
If you want to see more web icon sets then click here.
A webmaster is someone who controls the ins and outs of your website. They take care of all of the maintenance of the website, including; the structure, the content (text, graphics, design), page names, files, testing, etc. On top of this, the webmaster should also provide web analytics for your website.
Webmasters aren’t designers, they are more likely to have a programming background. They are very technically minded and have a wealth of experience in getting websites to run smooth and effectively.
If you have a webmaster to look after your website then you will be rest assured that you won’t have to spend anytime at all testing or fixing errors. In fact, your only problem will be if you try to get involved in any of your own testing! Webmasters are very territorial and like to be in full control of the websites they are managing.
Here’s a quick step by step guide to turning your website idea into a live website on the net.
1. Choose a Domain Name
Think of a domain name that’s going to best reflect your company and create a great brand OR just think of a domain that you like the look of for your personal website / blog, etc. Go to who.is where you can check the availability of your chosen domain name but don’t purchase it yet!
2. Web Hosting
Now you have chosen a domain name, you need somewhere to host your website. The easiest way to purchase both the domain and hosting space is by getting them both through the same company. We would recommend using Fasthosts, Pickaweb or EUKhosts who are the top UK hosting suppliers. Depending on the size of the website that your going to create, choose the hosting package accordingly.
3. Design your Website
Whether your looking for a corporate or personal website, jot down your design ideas. Build your website on your local machine from start to completion. You may need a qualified web designer for this bit!
4. Uploading your Website
Now you need to grab the ftp (File Transfer Protocol) details from your web hosting set up email and upload your completed website.
5. Testing
Yes testing! It has to be done to ensure that your website is going to run smoothly and that it doesn’t contain any errors. Testing can be as simple as checking for spelling and grammatical errors, checking for broken or missing links, or checking to make sure that all the web pages have been correctly uploaded.
Finished! You can now tell the world about your website and start using it to promote your business.
The jQuery lavalamp navigation is really cool and simple to implement onto your website. Check out our hover buttons above to get a feel for how they look. Just follow the step by step guide below to create your own:
Open a blank html document and insert the following code:
<ul class=”lavaLamp”>
<li><a href=”#”>Home</a></li>
<li><a href=”#”>Page 1</a></li>
<li><a href=”#”>Page 2</a></li>
<li><a href=”#”>Page 3</a></li>
</ul>
Create a new CSS document and link it from the <head> section of your html sheet e.g. <link href=”stylesheet.css” rel=”stylesheet” type=”text/css” />
/* Styles for the entire LavaLamp menu */
.lavaLamp {
position: relative;
height: 29px; width: 421px;
background: url(”../image/bg.gif”) no-repeat top;
padding: 15px; margin: 10px 0;
overflow: hidden;
}
/* Force the list to flow horizontally */
.lavaLamp li {
float: left;
list-style: none;
}
/* Represents the background of the highlighted menu-item. */
.lavaLamp li.back {
background: url(”../image/lava.gif”) no-repeat right -30px;
width: 9px; height: 30px;
z-index: 8;
position: absolute;
}
.lavaLamp li.back .left {
background: url(”../image/lava.gif”) no-repeat top left;
height: 30px;
margin-right: 9px;
}
/* Styles for each menu-item. */
.lavaLamp li a {
position: relative; overflow: hidden;
text-decoration: none;
text-transform: uppercase;
font: bold 14px arial;
color: #fff; outline: none;
text-align: center;
height: 30px; top: 7px;
z-index: 10; letter-spacing: 0;
float: left; display: block;
margin: auto 10px;
}
Insert the following code into the <head> section of your html document:
<script type=”text/javascript” src=”scripts/jquery.standard.js”></script>
<script type=”text/javascript” src=”scripts/jquery.easing.js”></script>
<script type=”text/javascript” src=”scripts/jquery.lavalamp.js”></script>
<script type=”text/javascript”>
$(function() { $(”.lavaLamp”).lavaLamp({ fx: “backout”, speed: 700 })});
</script>
Now all you need to do is download the three Javascript files and save them a folder named ‘Scripts’ in the root level of your website. Here are the files; jQuery Standard, jQuery Lavalamp, jQuery Easing. Enjoy!