< Browse > Home /

Editing the CSS Template to Make a Website

June 10th, 2009 | No Comments | Posted in Web Development by Diego | - [Full Entry]

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

Getting ready to edit your template to make a website

In this part of our series you will start editing your template to make your website. Don’t worry, I’ll guide you every step of the way so you don’t get lost.


What do you need?

  1. The BigSpaceLove template found on Free-CSS-Templates
  2. A browser to open your website. (e.g. Internet Explorer, Firefox…)
  3. A text editor to edit your website. Preferably one that supports syntax highlighting. Programmer’s Notepad is free and is what I’ll be using.


Start editing the template

Open up index.html using your text editor. If you remember the basic structure of a website we taught you can notice that it is the same way the html file is structured.

  • The header contains “Website Title” and “Subheader, website description H2″ in this case
  • The body is separated into a left section containing the content the and a right section containing the menu.
  • The footer contains information about the person who created the template.

You will notice these sections are denoted with the following tag in the HTML document:

The <div> </div> tag

You can think of the div tag as a section within your HTML document. They will usually be named after the sections described above.

structurebigspace1

Read more »

Learn how to create a website using a Template

May 28th, 2009 | 2 Comments | Posted in CSS, HTML, Web Development by Diego | - [Full Entry]

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

Getting started on your first website

Ever wanted to create a website but had no idea where to get started? No worries, I’ll guide you through the simple process and it will require no prior experience. Is it really that easy? After you complete my series of tutorials, it sure will be. We’ll be using the template BigSpaceLove found on Free-CSS-Templates to create a simple personal website similar to my personal website.

You don’t need to know anything. I’ll even make sure you understand the fundamentals so you can continue learning more on your own afterwards. So no, you don’t need to know how to design a web page, or even how to code one.

csstemplates
This series will teach you how to make a similar website pictured above


This series of tutorials will start by showing you where to find a template online (and for free!) so you can edit to your choosing. Remember, the product will only be limited by your imagination.


Why would I need a website anyways?

First of all, a website might serve a great variety of purposes such as the following:

  • You may post your resume, CV, or portfolio online to attract potential employers
  • Might want to share a hobby
  • Promote a product you are selling or endorsing
  • Start a community
  • Simply to learn!

In reality, the possibilities are endless. It’s actually quite a good skill to have and it can pay off. While I was in highschool I managed to create websites and get paid pretty darn well for it since people think its more complicated than it looks.
Read more »