Template Designing Tutorials

DavidS7 · #1 (**permalink**) 01-13-2008, 01:09 AM

Could anyone be so kind and help me search for GOOD tutorials to learn how to make HTML, or even Flash templates? Would be cool that they show you in Adobe Photoshop and Dreamweaver.

Or if any of you is advanced in this topic, please post here or send me a PM!

Thanks,
DS

jaressloo · #2 (**permalink**) 01-13-2008, 05:30 PM

html templates are pretty easy to do as long as you have html experience. so...to get this straight...when you say template, do you mean, "creating something where you can make the layout of the site and add different content when you want to?" kind of thing? or did you just want help with creating a website in general?

Bingo · #3 (**permalink**) 01-13-2008, 05:39 PM

If you are only starting to learn HTML I'll suggest learning CSS. I find it easier than using pure HTML.

If you are interested and have dreamweaver use its help file and the above link. Get some free CSS templates and play around with the code.

jaressloo · #4 (**permalink**) 01-13-2008, 05:48 PM

it seems to me that learning css first is kind of backwards...you need the basics of html before css will make any sense. don't you think? once you understand it, however, css is GREAT! i love it, but you really need the knowledge of basic html before learning how to apply css to it.

for some other wonderful tutorials on both, go to
http://w3schools.com/html/default.asp - for html

http://w3schools.com/css/default.asp - for css

the w3 is the world wide web consortium. their website is pretty boring but their w3 schools website (links listed above) are VERY useful for many different languages.

Bingo · #5 (**permalink**) 01-13-2008, 05:53 PM

Quote:

Originally Posted by jaressloo

it seems to me that learning css first is kind of backwards...you need the basics of html before css will make any sense. don't you think?

Actually yes you are very right, my bad.

DavidS7 · #6 (**permalink**) 01-13-2008, 07:05 PM

Yup I know HTML, well not a pro but I know it.
What I want to know sincerely is what does a template include (ex. header, logo, stuff like that), and some tips when making it in Photoshop.

DS

jaressloo · #7 (**permalink**) 01-13-2008, 07:49 PM

ok. well... one thing that catches my eye is that photoshop is a purely an imaging program.

here's a perfect example:

http://amazingtechguys.com/beta2 is a layout or "template" of a site that i have discontinued. i made this in photoshop...but as you can see, they're all images. there's no text because if i had text on it, the text would be stored in the image. not on the site...if that makes sense.

photoshop is a good tool to use if you want to design the layout of the site first...but i would not recommend building a site with it and then using the image slices that you create in photoshop as your website. the reason why is that a site designed in photoshop is merely one image that was "sliced" up into different pieces and then stored in a table. this is not so good because your site (depending on your hosting provider) may take FOREVER to load because of all of the images that it needs to load.

i don't know if that makes sense or not...

anyway, if you wanted to go ahead and use photoshop anyway, you'll need to create the site using photoshop (which once again, is merely an image) and then use a text editor like Textpad or Notepad to actually make it into a site. you will use your html and css knowledge to accomplish this.

the best way, as stated earlier, if you want to use photoshop to create your site, is to simply create the DESIGN in photoshop. then...use ONLY the images that you NEED to use in order to create the site in purely html and css.

a good example of this is http://www.vccandles.com/beta. i originally created this site in photoshop. after i was done and i was happy with the design of the site, i started to replicate it in html and css. using only 3 or so images (where the photoshop designed site would have used probably around 30). using html and css, you can create wonders!

i know that this was not the easiest post to understand...let me know if you have questions.

TechieGuy · #8 (**permalink**) 01-14-2008, 07:44 AM

The current design of my site was done in Photoshop and then I sliced the image into pieces.

One problem with this is you have to make sure you don't have too many images, especially if they are large.

I attempted to keep the images small, especially with repetitve backgrounds. For example, the outside border around the content is one pixel high and 900 pixels wide. there is only two colours in the image so it isn't very big.

Another problem is that you have to know HTML to piece together the images. This can be quite frustrating as you would probably need to manage padding and margins to get things the way you like. This is where learning CSS comes in handy.

Rob · #9 (**permalink**) 01-14-2008, 12:21 PM

Hey David,

I also use Photoshop to slice up my images and then code them in with a CSS document its a good method and works well, flash is a hard topic it became popular in my opinion for about a year then completely died down the search engines despise of them and most people dont have flash player/shockwave installed.

Heres an article about should you chose flash over html.

http://www.drquincy.com/resources/ar...ebsiteinflash/

But saying all this isn't really helping you better for you to find out by your self who knows you might enjoy yourself.

Adobe Flash CS3 / Macromedia Flash

http://www.bytescout.com/swfscout_us...templates.html

Flash resources (free to edit)

http://www.freeflashintros.com/

DavidS7 · #10 (**permalink**) 01-14-2008, 10:56 PM

Whoah, thank you guys for all the help.

Yeah, so the best choice might be just to do like the layout in HTML and only include the logo and REALLY important stuff in images.

WB Sponsors