Forum Moderators: not2easy
I wonder how templates monster slice their templates,I am trying to do the same but without results,anyone who knows how they do..
Iso
It's been a long day, so I may be missing the obvious here but I'm afraid I don't quite understand what you are asking!
Are you asking how sites using templates take the designers view and create the HTML template from that?
Then save it as a webpage and Photoshop will give you the code
It's a bad idea to use Photoshop / Fireworks etc to generate html. Generally speaking they do an appallingly bad job of it. The resulting code will be bloated, complex and difficult to maintain.
As a general rule, it's better to let the markup drive how--or if--you use sliced images than it is to let how the images are sliced determine the markup that you use.
-b
I bought a template and I opened the Html folder,the index.html page but I am curious to know how they did it because I want to learn.
When I opened the template in photoshop I get confused,lot of layers, what I should do with "text" layer.
How template monster get the nice "text" without pasting a picture in the Html file?
Is much better to only export the "selected slices" without generating html code?
I hope there are not any stupid questions here but I just want to learn,I asked the TM support but I didnīt get a straight answer.
When I opened the template in photoshop I get confused,lot of layers, what I should do with "text" layer.
Layer->Flatten image will render the text into a non-editable bitmap that can then be saved as .gif or .jpg.
Slicing may be visually appealing but see bedlam's post, it is generally a bad idea. Try to use as little slicing as possible. Most of the time, you're better off using an imagemap and one image.
When you "slice" an image, you're doing at least three things that are bad overall:
1. A sliced image is now many images, I've seen as many as 100+ images on one page including mouseovers. Although the cumulative file size is roughly the same, you now have 100+ requests to the server for EVERY page. This slows things down drastically.
2. This almost always positively locks you into a VERY heavy table layout, and once started is hard to break out of. You wind up nesting tables inside other tables, and in case you don't know, tables are discouraged as a method of creating a layout. Tables are for tabular data; if the symantics don't bother you, then you should probably be concerned that heavy table use will cause your page to load slowly.
3. When you allow a program to automate the slicing process, your images will not be optimized and/or may suffer greatly in quality. For example, that upper right corner piece there that only has white in it - that can be saved as a 8 bit or 2 color .gif. But the one with the picture in it, jpg high-q (8 or 9,) or even 256 color .gif. The more info, the greater the file size. Most programs will "optimize" all images in a slice to the same parameters. To fully optimize images, you need to do it manually and actually assess each piece of the "slice" for the optimum format and color depth.
Tedious work to do it "right." :D
thanks again!
iso
It's a bad idea to use Photoshop / Fireworks etc to generate html.
I definitely agree that the code is ugly when all is said in done. I was just answering the OPs original question. If you do take this route, it is advisable to read through the code and get rid of all the unnecessary additions. It's always better to write code that isn't using a bunch of tables filled with images. Your pages will load faster and your visitors will thank you.
I don't really prefer to make my pages this way but there are a lot of them out there and I have to work with them often.
The obvious advantage is the ease of creating a beautiful graphic intense page. The additional page size really is starting to not be a problem as internet access speeds keep getting faster making the time to display of this style of template not bad.
What you really have to watch with these templates is the size of any Flash elements. They can be rather sizable. In almost all cases I have to open the Flash elements and resave with close attention to compression. I can generally cut the size of these Flash elements by 50% or more.
It cleans what I call mistakes, but does not do much for clunky code.
Just thought I would offer something else?
