Showing posts with label web developing. Show all posts
Showing posts with label web developing. Show all posts
Thursday, 5 November 2009
Working on things
Hi guys I have currently been working on getting the table layout for my website up and running. This is taking me a while but I will do it eventually. Once I get the tables positioning up and running I can churn out a few website templates. I hope to get to the stage where these are market-able so that I can make some money back from all the time I have spent on it. Anyway time to hit the hay. I have a long day ahead of me tomorrow.
Wednesday, 4 November 2009
Tutorial 5 : CSS Basics and background color
Welcome to Tutorial 5 : CSS Basics. In this tutorial I shall show you how to use CSS files to make website creation easier and quicker. For example; It is far easier to write one piece of code once than have to write it 50 times for 50 webpages in a website.
Firstly I want you to open up Microsoft Visual Web Developer which is a free easy to use and powerful tool which will help you a lot in website creation. It can be downloaded from the Microsoft website.
I want you to start a new website. Make sure its an empty website, and then add both a HTML file and a Style sheet. Name them whatever you want.
Next I want you to open up the HTML file, as you can see the basic HTML structure is laid out for you already. Next in the head section I want you to type the following line
<link rel="stylesheet" type="text/css" href="StyleSheet.css" />
Make sure that you change StyleSheet.css to whatever you have named your style sheet.
Now we have a link to our style sheet from our HTML file.
Secondly I would like you to open up your Style sheet as we are now going to be writing some CSS!
If all goes to plan you should have something similar to this:
body{
}
This means that whatever you code into the brackets will directy effect whatever is in your &alt;body> tags which is your whole website.
Now I would like you to type in:
background-color:Red;
Now when you go back and preview your webpage it should have a Red background. As you can see this could be incredibly useful if you have hundreds of webpages all following the same design.
So congratulations you have completed Tutorial 5 : CSS Basics and background color.
Please stay tuned for more HTML and CSS tutorials and remember to follow my blog either view RSS or through blogger's follow function! Thanks!
Firstly I want you to open up Microsoft Visual Web Developer which is a free easy to use and powerful tool which will help you a lot in website creation. It can be downloaded from the Microsoft website.
I want you to start a new website. Make sure its an empty website, and then add both a HTML file and a Style sheet. Name them whatever you want.
Next I want you to open up the HTML file, as you can see the basic HTML structure is laid out for you already. Next in the head section I want you to type the following line
<link rel="stylesheet" type="text/css" href="StyleSheet.css" />
Make sure that you change StyleSheet.css to whatever you have named your style sheet.
Now we have a link to our style sheet from our HTML file.
Secondly I would like you to open up your Style sheet as we are now going to be writing some CSS!
If all goes to plan you should have something similar to this:
body{
}
This means that whatever you code into the brackets will directy effect whatever is in your &alt;body> tags which is your whole website.
Now I would like you to type in:
background-color:Red;
Now when you go back and preview your webpage it should have a Red background. As you can see this could be incredibly useful if you have hundreds of webpages all following the same design.
So congratulations you have completed Tutorial 5 : CSS Basics and background color.
Please stay tuned for more HTML and CSS tutorials and remember to follow my blog either view RSS or through blogger's follow function! Thanks!
Website Finished
I have finished my second website design. This one is a bit more bland than the first, but this one was all about coding in better functionality. For instance if you put in lots of text to your main column. Your sidebars adjust to the correct height. I will show you how to do it soon although for now I am still working on getting a couple more templates up so that you can have a look at the code and possibly use it for your own devices.
Anyway I will put another tutorial up tonight. And possibly another website. I have been having a few ideas as to what to add to my websites. Although I would like to find a suitable place that gives images for place holders. So that I can spice up my websites a bit.
I am also going to try a little javascript to spice up my navigation bars as well as add a bit more functionality to the sites I create.
Bye for now and please remember to click to follow me here on blogger!
Thanks.
Anyway I will put another tutorial up tonight. And possibly another website. I have been having a few ideas as to what to add to my websites. Although I would like to find a suitable place that gives images for place holders. So that I can spice up my websites a bit.
I am also going to try a little javascript to spice up my navigation bars as well as add a bit more functionality to the sites I create.
Bye for now and please remember to click to follow me here on blogger!
Thanks.
Tutorial 4 : Creating Links
Tutorial 4 will concentrate on showing you how to link to either other pages on your site or a different website. Links are used in nearly every website as they are a functional and easy to use way of navigating the web. For instance when you search in google and press the search button, you are in fact clicking a link. This takes you to another webpage.
Links are very easy to implement to your website and they have, by default, a blue text color and are underlined once. This can be changed to fit in with your website if need be. For now though we will concentrate on how to create links.
To create a link all you need to do is type the following line:
<a href="#"> Hello </a>
This line produces the following:
Hello
This as you can see does not take you anywhere but if you replace the pound sign with a website URL of your choice you can make it so that the link takes you to that URL.
For instance linking to my site I would put the following:
<a href="http://emforce-webdev.blogspot.com">My Website</a>
Thats all from Tutorial 4 : Creating Links I hope you found it intuitive.
In the next tutorial I shall show you how to use CSS to help create your websites. Please stay tuned and if you found this tutorial useful please become a follower and learn along side others learning both HTML and CSS.
Thank you!
Links are very easy to implement to your website and they have, by default, a blue text color and are underlined once. This can be changed to fit in with your website if need be. For now though we will concentrate on how to create links.
To create a link all you need to do is type the following line:
<a href="#"> Hello </a>
This line produces the following:
Hello
This as you can see does not take you anywhere but if you replace the pound sign with a website URL of your choice you can make it so that the link takes you to that URL.
For instance linking to my site I would put the following:
<a href="http://emforce-webdev.blogspot.com">My Website</a>
Thats all from Tutorial 4 : Creating Links I hope you found it intuitive.
In the next tutorial I shall show you how to use CSS to help create your websites. Please stay tuned and if you found this tutorial useful please become a follower and learn along side others learning both HTML and CSS.
Thank you!
Monday, 2 November 2009
Introduction
So guys I am a young web developer and am hoping to give you tutorials and tips on how to program your own website. I am learning everyday so the intention of this blog is to provide you with useful tips as well as Ideas and tools you can use to create your own websites.
I thought I would start by saying that I also program games as a hobby. I enjoy creating something from nothing and programming either with HTML or C# seem to be an easy way to create a limitless amount of different things :D
Stay tuned for tutorials on how to create your own website, These tutorials will be for people who want to learn HTML and CSS. Hope you enjoy!
I thought I would start by saying that I also program games as a hobby. I enjoy creating something from nothing and programming either with HTML or C# seem to be an easy way to create a limitless amount of different things :D
Stay tuned for tutorials on how to create your own website, These tutorials will be for people who want to learn HTML and CSS. Hope you enjoy!
Labels:
css,
html,
html css,
programming,
tutorials,
web developing,
website creation
Subscribe to:
Posts (Atom)