A Basic Primer

ishkey · Aug 10, 2008

I've created a basic info txt file about understanding the templates and files in them, to help get people started.
Hope it helps.

For some reason the link is ifffy. Scroll down this post and read it here. 3/18/09

CovertPea · Aug 10, 2008

Brilliant idea Ishkey!

pezboy45 · Aug 11, 2008

Stickied!

Also, changed the link to where it was uploaded, so it will not get pruned...
And its hosted at 10 different places...

ishkey · Aug 11, 2008

Comming from you 2, I guess I did Ok.
Thanks Guys.

ishkey · Sep 14, 2008

The Links are Down - So here it is again...

:..A Basic Primer..:
You always want to be a Web Designer and you found this great Web Site FWT, that has Free Templates. It can't get any better than this. The adrenalines pumping, your mind is racing. You Previewed and Downloaded the perfect template.
Now What???
You haven't a clue what to do! You read all of the Forums Q&A and still it makes no sense. Can't someone just tell me what to do, this can't be that hard, I've got all the software that I've never knew how to use!!! Should I join the Forum and if I do, how do I ask my question without sounding dumb, but my Web has to get done.
Let's stop right here with with th BS and get to it.
First of all Google is your friend, ask and you will be served up.
The download is in a ZIP format.
Zip is a compressed file, to reduce size and wrap all files in 1 neat package.
Google - zip extension to find out more.
Windows can unzip files or get 7-zip (google) or pay for a program.
Now unzip the files into a working directory - one you can remember and find, we need a place to work.
Are you with me so far. (if not you need to get an understanding of computers)
In our working directory we should see;
a directory named - images
a graphics file - some_file_name.psd
a html file - index.html
a Cascading Style Sheet - style.css
These files are the basis for your template.
A template is a framework for web pages and sites. It is a way to give a uniform (laid out the same throughout) "look and feel" to your web.
Click on the index.html file and it will open in your browser. It looks just like the one on line, great. (You can always view your work in your rowser)
Open the image directory and you will see images, most will be linked to the style.css file. Some you will recognize, some you won't and some may not even look like there is anything there. Look back and forth at the images and the index.html open in the browser. Things start to become more clear. Images are referenced and saved in the image directory and yes you should put your new ones there. After all we are using this templates format.
A little Stop, Looking and Thinking can answer alot of questions.
*** What do I want to do, what do I have and what tools do I need! ***
*It's an old fashion thought process*
Now we need a "text editor" - just a basic one will do. (you can get all the power from another one later - just remember to learn your software or you are powerless)
We will use "Notepad" - it's on your computer.
Right click on the style.css file. Open with Notepad.
You are now viewing what controls the style and layout of your web pages. (the header section, menus, basic layout, colors,, etc.)
You should even see some of those images from the images directory.
If you make changes here it will be refected in your web on every page.
This is also the place where you may have extra code only for special pages in your web.
Can you edit this? Yes just make sure you save the file when you are done editing.
Do you know the css language? Try http://www.w3schools.com/css/
(This a basic primer - you have too learn some things on your own)
Right click on the index.html file. Open with Notepad.
You are now viewing where you put your content (all that stuff you want the world to see)
What is an HTML File?
HTML stands for Hyper Text Markup Language
An HTML file is a text file containing small markup tags
The markup tags tell the Web browser how to display the page
An HTML file must have an htm or html file extension
An HTML file can be created using a simple text editor.
If you take your time looking, things start to jump off the page at you and your mind goes, I can do this. Until you get stumped, because right now you are only replacing text and you page isn't really what you want.
Try http://www.w3schools.com/html/default.asp
(This a basic primer - you have too learn some more things on your own)
Finally that some_file_name.psd
In short "psd" falls into the Raster Image Catagory
It's a Document created by Adobe Photoshop, the most commonly used professional image editing program; can include image layers, adjustment layers, layer masks, annotation notes, file information, keywords, and other Photoshop-specific elements. Supports RGB, CMYK, grayscale, monochrome, duotone, indexed color, Lab color, and multichannel color modes.
This is the file that is the Creative Genius of the author. It's their Vision, their Design.
Basically they made a graphic, with lots of layers, colors and their tricks of the trade. They then made small pieces and coded in html and css to bring you a template.
Do you need to do anything with this file - NO - Just thank them for it. You do not need it for your web. You can use it to learn what they have learned.
Try http - No that's for another day.
(This a basic primer - you have too learn even more things on your own)
This should give you a good basic start of templates.
Half the questions this forum gets, are above. You can answer most of your own questions and remove the frustration by just looking at
*** What do I want to do, what do I have and what tools do I need! ***
Then you will understand too a greater degree, so you can ask a question which will get you over the hump. It's more fun to learn and create then get burnt out.
People volunteer their knowledge and time to help you. These are the same people who have taken the time to learn it and make a living by what they have learned.
So remember to learn and give back to this forum and others... The world will be a better place if you do.
And believe me.... We all started right where you are.
Ishkey....
10 August 2008

pezboy45 · Sep 15, 2008

[Now back online]

thecarpenter · Sep 16, 2008

Thanks for the primer, I have much learning to do and a short time to do it in.

pezboy45 · Sep 16, 2008

thecarpenter said: ↑

Thanks for the primer, I have much learning to do and a short time to do it in.

If you have ANY questions just start a new topic, and we'll try to help you out!

Good luck!

MagicMike · Nov 13, 2008

Thanks Ishkey

Just to Say thank you very much for the Basic Primer, Its amazing how someone can give you so much good info in a short space
I dont know if I can help you but it would be great to give something back
best regards Mike

charger820 · Dec 3, 2008

Your Basic Primer is just what I've been looking for....and in directions I think I can understand. Can't wait to try it. Thanks so much!

danmcminn · Apr 22, 2009

Thanks for the basics. I was wondering if I'd want to fiddle with the .psd file or index.html file. Now I know.

Cheers,

Dan

lightvayne_21 · Jun 25, 2009

ThaNK U ishkEY...

,, i was just looking for this..

,, I'm just starting to build my own site..

,, can't w8 to have to have one,,

,, hope i can return a favor someday,,

,, thanks...

charesem · Jun 26, 2009

thanks

I really didn't understand much because I am computer stupid, but I have paid like a ton of money on sites and I have never gotten what I wanted. Thanks for being there so I can learn how to get what I want from my site.

charese

Monica · Sep 9, 2009

COOL!!!! That's an excellent job!
Like a manual for those who've just started ))

bmcoll3278 · Sep 9, 2009

Dave that is a great job. I have truble with templates myself often enough.

May I ad one comment?

Alway make a backup copy of the template files in another folder then you can feel free to play with it and if you screw up you can reload from the backup.

That is how I have learned what little i know about php files . I make changes and try it if I screw it up totally I replace it with the backup and try again.

ishkey · Sep 9, 2009

You are absolutely right...
That's always been the way I've done it. Not to mention being able to look back and forth to see the difference.
I should remember most people today just want the answer, but then again sometimes it's better to screw up, to progress onward into a new thought process. Sorta like a higher plain of being.

csboucher · Sep 9, 2009

I am bummed, I am not new to website development, but I wanted to play around with some templates. I downloaded two and when I open the html file in my browser they do not look like they do on the website. What does this potentially mean?

reganstar · Sep 17, 2009

So useful tutorial. Great job and thank you.

jcalhoun813 · Sep 20, 2010

that was quite thoughtful. am sure it will help. Thanks

seanPaul · Oct 16, 2010

Thanks good info although I KNOW THIS ALREADY BUT IT'S good for beginners

Log in or Sign up

A Basic Primer

ishkey Mod - Designer

CovertPea Moderator

pezboy45 Mod/Design & Coder [Pro]

ishkey Mod - Designer

ishkey Mod - Designer

pezboy45 Mod/Design & Coder [Pro]

thecarpenter New Member

pezboy45 Mod/Design & Coder [Pro]

MagicMike New Member

charger820 New Member

danmcminn New Member

lightvayne_21 New Member

charesem New Member

Monica Banned

bmcoll3278 New Member

ishkey Mod - Designer

csboucher New Member

reganstar New Member

jcalhoun813 Banned

seanPaul New Member

Log in or Sign up

A Basic Primer

ishkey Mod - Designer

CovertPea Moderator

pezboy45 Mod/Design & Coder [Pro]

ishkey Mod - Designer

ishkey Mod - Designer

pezboy45 Mod/Design & Coder [Pro]

thecarpenter New Member

pezboy45 Mod/Design & Coder [Pro]

MagicMike New Member

charger820 New Member

danmcminn New Member

lightvayne_21 New Member

charesem New Member

Monica Banned

bmcoll3278 New Member

ishkey Mod - Designer

csboucher New Member

reganstar New Member

jcalhoun813 Banned

seanPaul New Member

Useful Searches