Talk Binary » xhtml http://talkbinary.com Programming Resources, Technology, Computers Mon, 06 Feb 2012 17:01:43 +0000 en hourly 1 http://wordpress.org/?v=3.3.1 Choosing a template for your website http://talkbinary.com/web-development/choosing-a-template-for-your-website/ http://talkbinary.com/web-development/choosing-a-template-for-your-website/#comments Tue, 09 Jun 2009 06:46:19 +0000 Diego http://talkbinary.com/?p=1789   Full Article… ]]>

Table of contents for Learn how to create a website series

Below is the complete list of entries to this series.
  1. Learn how to create a website using a Template
  2. Understanding the Basic Structure of a Website
  3. Choosing a template for your website
  4. Editing the CSS Template to Make a Website

Finding the right template

Finding the correct template for your needs can be quite tricky. For example, I needed something clean and fresh while maintaining a level of professionalism so I decided to go with the layout found on my personal website. If you noticed, you can get a nice looking website once you find the right template.

But how did I find it first of all? I simply dug around the internet. Google for me was a great place to start but for those that need help, I’ll show you a couple of sites that will give you a head start.

picture-1

Note for tutorial

For purposes of the tutorial I encourage everyone to use BigSpaceLove found on the front page of Free-CSS-Templates so you can follow me step by step. This template is fairly easy to edit.

Where to find free CSS templates

So once I have a template what now?

You are almost there. Once you have a template all we have to do is set up our environment, and start editing! (Remember, to use BigSpaceLove found on the front page of Free-CSS-Templates so you can follow my tutorial step by step.)

Previous: Understanding the Basic Structure of a Website

Next: Editing the CSS Template to Make a Website

]]> http://talkbinary.com/web-development/choosing-a-template-for-your-website/feed/ 0 Understanding the Basic Structure of a Website http://talkbinary.com/web-development/understanding-the-basic-structure-of-a-website/ http://talkbinary.com/web-development/understanding-the-basic-structure-of-a-website/#comments Thu, 04 Jun 2009 20:51:22 +0000 Diego http://talkbinary.com/?p=1757   Full Article… ]]>

Table of contents for Learn how to create a website series

Below is the complete list of entries to this series.
  1. Learn how to create a website using a Template
  2. Understanding the Basic Structure of a Website
  3. Choosing a template for your website
  4. Editing the CSS Template to Make a Website

What is a website made out of anyways?

If you take a good look at a couple of websites, you might notice their structures share a couple of things in common. (If you are wondering why you need to know this, you’ll learn why really soon.) Each website usually contains the following basic elements:

  • A header usually contains the logo of a website along with a brief description. Sometimes you may find a menu there as well.
  • The main body or content which may take up most of the website which contains the content of the website.
  • A sidebar which usually contains the navigation of your website.
  • A footer which usually contains copyright and licensing information.

Not all websites follow this traditional structure. It all depends on what type of website you need to suit your needs.

So what is under the hood?

So, what makes a website a website? Under the hood websites are made up of different coding languages that serve different purposes. I’ll only describe the basic ones you need to be aware of and will be working with.

Don’t worry, you don’t need to know anything. I’ll help you every step of the way.

HTML

HTML stands for Hyper Text Markup Language. It consists of HTML tags that are used to mark up content and usually have a starting and ending tag. If you have worked with website development in the past, edited a profile on a social site such as MySpace you probably already are familiar with the basics of HTML. An example of HTML is below.

<html>
<head>
<title>This is the title of a website</title>
</head>
<body>
<h1>This is a header</h1>
<p>This is a paragraph</p>
 
 
</body>
</html>

Note: If you really wanted to, you could create an html document say, index.html, copy the above code into that document, save it, run it on firefox, and view your website!

Cascading Style Sheets

CSS are Cascading Style Sheets. They can be embedded withing your website or be found in an external file (.css) that is linked to your website. You can think of them as style sheets. If you want to define or alter an attribute of an element of your website such as a font, image, link color, or any other element, you define it in the CSS document, and it would apply to all such elements on your site. I’ll show you an example later.

XHTML

XHTML stands for Extensible HyperText Markup Language. It is more of a standard for writing in HTML. So if you see a website or layout saying its XHTML Compliant, well now you know why.

Ok, now what?

Scared yet? Don’t worry. It will all make sense later. So what’s next? In the next tutorial I’ll help you find a template to start our website, then we’ll start editing it. Stay tuned for the next tutorial. If you have any comments or suggestions feel free to post them below.

Previous: Learn how to create a website using a Template

Next: Choosing a template for your website

]]> http://talkbinary.com/web-development/understanding-the-basic-structure-of-a-website/feed/ 0