FREE CSS Gallery Template - SE Optimized with sample stylesheet - GoFuckYourself.com

PSD CSS XHTML · 04-12-2009, 01:39 AM

OK, I'm sure most of you have seen CSS Zen Garden.

It illustrates better than anything, how flexible CSS is. It shows how amazingly different webpages can be while they have the exact same HTML.

SO, I thought it would be cool to have a gallery template we could do the same thing with, and here it is.

HTML

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>Page Title : Include Keywords</title>
<link rel="stylesheet" type="text/css" href="styles.css" media="screen" />
<!--[if IE]><link rel="stylesheet" type="text/css" href="iestyles.css" media="screen" /><![endif]-->

</head>
<body>


<div id="container">

	<div id="header">
		<h1>Main Description. Include Keywords</h1>
	</div>
	
	<div id="gallery_wrapper">
		<div id="gallery_header">
			<h2>Longer, more detailed description. Include Keywords again Longer, more detailed description. Include Keywords again Longer, more detailed description. Include Keywords again</h2>
		</div>
        
		<div class="nav_links">
			<ul>
            <li><a href="#">Link 1</a></li>
            <li><a href="#">Link 2</a></li>
            <li><a href="#">Link 3</a></li>
            </ul>
		</div>
		
		<div class="content">
			<div class="thumbs">
					<a href="#"><img src="manuel_uncut/images/t1.jpg" alt="thumb" /></a>
                    <p>2 Minute Preview Clip from ManuelUncut</p>
                    <p><a href="#">Download the Full Length Video</a></p>
			</div>
			<div class="thumbs">
					<a href="#"><img src="manuel_uncut/images/t1.jpg" alt="thumb" /></a>
                    <p>2 Minute Preview Clip from ManuelUncut</p>
                    <p><a href="#">Download the Full Length Video</a></p>                    
			</div>                        
		</div>
		
		<div class="ad_wrapper">
			<div class="ad01">
			<h3><a href="#">Main Link Out to Tour</a></h3>
			</div>
	
			<div class="ad02">
			<p>Keyword rich paragraph of text. Keyword rich paragraph of text. Keyword rich paragraph of text. 
			   Keyword rich paragraph of text. Keyword rich paragraph of text. Keyword rich paragraph of text.</p> 
			</div>
		</div>	

		<div class="content">
			<div class="thumbs">
					<a href="#"><img src="manuel_uncut/images/t1.jpg" alt="thumb" /></a>
                    <p>2 Minute Preview Clip from ManuelUncut</p>
                    <p><a href="#">Download the Full Length Video</a></p>                    
			</div>
			<div class="thumbs">
					<a href="#"><img src="manuel_uncut/images/t1.jpg" alt="thumb" /></a>
                    <p>2 Minute Preview Clip from ManuelUncut</p>
                    <p><a href="#">Download the Full Length Video</a></p>                    
			</div>
		</div>
        
		<div class="ad_wrapper">
			<div class="ad01">
			<h3><a href="#">Main Link Out to Tour</a></h3>
			</div>
	
			<div class="ad02">
			<p>Keyword rich paragraph of text. Keyword rich paragraph of text. Keyword rich paragraph of text. 
			   Keyword rich paragraph of text. Keyword rich paragraph of text. Keyword rich paragraph of text.</p> 
			</div>
		</div>        
   		 
		<div class="footer_links">
			<ul>
            <li><a href="#">2257 Link</a></li>
            <li><a href="#">Webmasters</a></li>
            </ul>
		</div>    
        

	</div>
</div>

</div>

</body>
</html>

CSS

Code:

@charset "utf-8";

* {margin: 0; padding: 0;}
body {
	background: #040404;
	background-image: url(manuel_uncut/images/body_bg.jpg);
	background-repeat: no-repeat;
	background-position:top;
	margin: 0;
	padding: 0;
	font-family: "Trebuchet MS", Georgia, "Times New Roman", Times, serif;
	font-style: normal;
	font-variant: normal;
	font-weight: normal;
	font-size: medium;
	line-height: normal;
	word-spacing: normal;
	letter-spacing: normal;
	text-decoration: none;
	text-transform: none;
	text-align: left;
	text-indent: 0ex;	
}
	
#container {width: 800px; margin: 0 auto;}	
#header {
	width:780px; 
	height:49px; 
	text-align:right; 
	padding:95px 20px 0 0;
	font-size:14px;
	text-transform:uppercase;
	font-weight:bold;
	}	
.clear{clear: both;}

#gallery_wrapper {width:800px;}
#gallery_header {
	width:500px; 
	height:90px;
	padding:10px 20px 0 280px;
	font-size:12px;
	}
	
	
	
/*------------------------(   nav links   )---------------------------------------------(  nav links  )------------*/	
.nav_links {width:790px; height:35px; padding:10px 0 0 10px; 
			background-image: url(manuel_uncut/images/nav_bg.gif); background-repeat: repeat-x;
			border-bottom:#000000; border-bottom-width:1px; border-bottom-style:solid;
			border-top:#000000; border-top-width:1px; border-top-style:solid;}
			
			.nav_links a {
			color: #fff; text-decoration: underline;}

			.nav_links a:visited {
			color: #fff;}
	
			.nav_links a:hover {
			color: #FF0000; text-decoration: none;}

			.nav_links ul {
			margin: 0; padding-right:30px; text-align:left;}

			.nav_links li {
			list-style-type: none; display: inline; color:#fff; padding-right:20px;}
			
			

/*------------------------(  content  )------------------------------------------------------(  content  )------------*/
.content {height: 400px; width:800px; background-color:#FFFFFF;}

.thumbs {
	width:400px;
	height:400px; 
	float:left; 
	background-color:#FFFFFF;
	}
	.thumbs img {
	margin:8px 6px 10px 6px;
	border:#000000; border-width:medium; border-style:solid;
	}
	.thumbs p {text-align:center;}
	.thumbs p a:hover {color:#FF0000;}



/*--------------------------(  ad  )------------------------------------------------------------(  ad  )------------*/
.ad_wrapper {
	width:760px;
	height:140px;
	background-color:#FFFFFF;
	clear:both;
	padding:10px 20px 20px 20px;
	}
	.ad01 {
	width:760px;
	text-align:center;
	}
	.ad01 a {
	color:#0000FF;
	font-size:36px;
	}
	.ad01 a:hover {
	color:#666666;
	}
	.ad02 {
	width:760px;
	text-align:center;
	}
	.ad02 a {
	color:#0000FF;
	font-size:16px;
	}
	.ad02 a:hover {
	color:#666666;
	}

/*----------------------(  footer  )-----------------------------------------------------------------(  footer  )-----*/
.footer_links {width:790px; height:35px; padding:10px 0 0 10px; 
			background-image: url(manuel_uncut/images/nav_bg.gif); background-repeat: repeat-x;
			border-bottom:#000000; border-bottom-width:1px; border-bottom-style:solid;
			border-top:#000000; border-top-width:1px; border-top-style:solid;}
			
			.footer_links a {
			color: #fff; text-decoration: underline; font-size:10px;}

			.footer_links a:visited {
			color: #fff;}
	
			.footer_links a:hover {
			color: #FF0000; text-decoration: none;}

			.footer_links ul {
			margin: 0; padding-right:30px; text-align:left;}

			.footer_links li {
			list-style-type: none; display: inline; color:#fff; padding-right:20px;}

And here's the gallery

I kept this real simple, and the code as clean as possible so even CSS noobs can dive right in.

I already have a dozen ideas for how this layout can be altered, so grab the code and make your own.

and if you want custom versions of this template for your program, hit me up. Imagine how cheap you can make a ton of templates faster than ever before.

Thanks.

PSD CSS XHTML · 04-12-2009, 11:51 AM

Nobody wants it? Maybe I need to whip up another template.

MoreMagic · 04-12-2009, 11:54 AM

I am a css freak and love what you did there. Didn't cum like that for ages.

Ozarkz · 04-12-2009, 11:57 AM

Very nice example.

brassmonkey · 04-12-2009, 02:03 PM

looks good there

Vox · 04-12-2009, 02:08 PM

Awesome, thanks for sharing.

fris · 04-12-2009, 03:40 PM

nice, css gallery templates as so much easier to deal with

candyflip · 04-12-2009, 03:52 PM

Thanks for sharing.

qxm · 04-12-2009, 04:08 PM

dude... CSS is SOOOO Sexy!

PSD CSS XHTML · 04-12-2009, 09:04 PM

Thanks. I hope someone posts their versions of the gallery.

I wonder if anyone would want a version for tgp/mgp.

Does the average porn webmaster know CSS?

Deej · 04-12-2009, 10:25 PM

I like your style

devine · 04-12-2009, 11:41 PM

the page isn't validating because you have one more div in excess at the bottom, remove it and it should be OK

eMonk · 04-12-2009, 11:44 PM

Quote:

Originally Posted by PSD CSS XHTML

Does the average porn webmaster know CSS?

i don't think so but i'm learning it along with php/mysql

PSD CSS XHTML · 04-12-2009, 11:57 PM

Quote:

Originally Posted by devine

the page isn't validating because you have one more div in excess at the bottom, remove it and it should be OK

Good catch. It was almost 5AM when i got this idea and threw it together for this thread. I didn't bother to validate it because I knew there was nothing in there to give me an error.. unless i did something dumb like add an extra /div.

I actually was going to make this thread a sort of primer for anyone just getting started with CSS, and give some tips and answer questions if there were any, but it appears most of you guys in here already know what you're doing.

yoeleven · 04-13-2009, 01:26 AM

thanks for this

v4 media · 04-13-2009, 01:43 AM

It's nice, but having an uncut 90k image loading at the top can hammer a gallery productivity. but the code's still useful.

boneless · 04-13-2009, 06:24 AM

care to post a sample psd file for the header bg so noobs like me can started right away and make their own stuff.

i love the template and am digging into it when i return from the vets.

tranza · 04-13-2009, 06:47 AM

This is awesome!

PSD CSS XHTML · 04-13-2009, 10:03 AM

Quote:

Originally Posted by v4 media

It's nice, but having an uncut 90k image loading at the top can hammer a gallery productivity. but the code's still useful.

Valid. Of course, the bg image in the sample was just one layout approach, and it is probably a good idea for all galleries to set the .thumbs to preload in the css. That way the thumbs are the first images to appear.

Any more thoughts or ideas? I think we are building the perfect gallery template.

PSD CSS XHTML · 04-13-2009, 10:22 AM

Quote:

Originally Posted by boneless

care to post a sample psd file for the header bg so noobs like me can started right away and make their own stuff.

i love the template and am digging into it when i return from the vets.

I can post it, but let me explain too..

The template is set up so that the "container" is where the gallery lives, and it's restricted to 800px so the surfers still surfing on a 13" emachine don't get a horizontal scroll bar, but the bg can be 1024 wide or even 2 or 3,000px wide.

Just keep an eye on the filesize. I think 100 to 150kb should be the max, even once the thumbs are set to preload. This is still just a gallery after all.

So, when making your own bg, use the guides in photoshop to show you where the dead center of the page is, and 400px on either side shows you where the gallery will sit. Then just make your bg around that.

and in case you are not familiar with "guides"

If you have a 1000px bg and want to know exactly where your 800px gallery will sit..
You'll need a guide at the 100px point and the 900px point..

So, in photoshop select View > New Guide
Select Verical and 100px

Then repeat at 900px and now you can see exactly where your gallery will fall.

PSD CSS XHTML · 04-13-2009, 04:05 PM

If you have a network of sites you need galleries for, let me see them. I can develop a real cheap css template solution for you to use across them all.

I'm reviewing sponsor lineups now and I have so many ideas I'd love to try, but I need to know it's going to make me money before I spend too much time on it, and there's no way I'll ever get around to submitting them. That doesn't look like any fun at all.

But, I would love to work with a program that has 10 or more hot sites.

Since I don't submit or have the traffic to really test this sample, so if anyone who runs a large tgp network wants to run a couple of these galls, I'll make you a couple free versions and we can test the ctr.

Si · 04-13-2009, 04:14 PM

Nice

Could be very useful.

Bored · 04-13-2009, 04:15 PM

Nicely done. I wouldn't consider this fully SEO optimized however.

I would recommend using a strict doctype.
Meta tags are a must, keywords, description
Font size should not be declared in px. Only use em or %
Extra divs are not needed (container, gallery_header). You can target html, body,h2 to get the same effect
css and html could be reduced quite a bit, using short hand css and removing redunant div tags

Other than that, its fairly straight forward, clean and semantic.

PSD CSS XHTML · 04-13-2009, 04:33 PM

Quote:

Originally Posted by Bored

Nicely done. I wouldn't consider this fully SEO optimized however.

I would recommend using a strict doctype.
Meta tags are a must, keywords, description
Font size should not be declared in px. Only use em or %
Extra divs are not needed (container, gallery_header). You can target html, body,h2 to get the same effect
css and html could be reduced quite a bit, using short hand css and removing redunant div tags

Other than that, its fairly straight forward, clean and semantic.

As I mentioned, it's kept very basic for the broadest usability. CSS shorthand and em measurements are not good for noobs figuring out what is what and that's more about scalability than SEO.

As for the extra divs, it was a conscious decision to make it as flexible as possible. This could be used for submitting with standard recip buttons or as a super FHG with a very hard sell. Of course the sample gall could be done differently, but this is a template solution.

The meta tags was kind of an assumed thing which i guess I shouldn't have assumed

potter · 04-13-2009, 08:22 PM

Quote:

Errors found while checking this document as XHTML 1.0 Transitional!
Result: 3 Errors

Validation Output: 3 Errors

1. Error Line 92, Column 6: end tag for element "div" which is not open

</div>

✉

The Validator found an end tag for the above element, but that element is not currently open. This is often caused by a leftover end tag from an element that was removed during editing, or by an implicitly closed element (if you have an error related to an element being used where it is not allowed, this is almost certainly the case). In the latter case this error will disappear as soon as you fix the original problem.

If this error occurred in a script section of your document, you should probably read this FAQ entry.
2. Error Line 92, Column 6: XML Parsing Error: Opening and ending tag mismatch: body line 11 and div

</div>

✉
3. Error Line 94, Column 7: XML Parsing Error: Opening and ending tag mismatch: html line 2 and body

</body>

Quote:

Warnings (18)
URI : http://organicautomotive.com/temp/styles.css
54 Same colors for color and background-color in two contexts .ad_wrapper and .nav_links a
54 Same colors for color and background-color in two contexts .thumbs and .nav_links a
54 Same colors for color and background-color in two contexts #content and .nav_links a
57 Same colors for color and background-color in two contexts #content and .nav_links a:visited
57 Same colors for color and background-color in two contexts .thumbs and .nav_links a:visited
57 Same colors for color and background-color in two contexts .ad_wrapper and .nav_links a:visited
66 Same colors for color and background-color in two contexts #content and .nav_links li
66 Same colors for color and background-color in two contexts .ad_wrapper and .nav_links li
66 Same colors for color and background-color in two contexts .thumbs and .nav_links li
126 Same colors for color and background-color in two contexts .ad_wrapper and .footer_links a
126 Same colors for color and background-color in two contexts #content and .footer_links a
126 Same colors for color and background-color in two contexts .thumbs and .footer_links a
129 Same colors for color and background-color in two contexts .thumbs and .footer_links a:visited
129 Same colors for color and background-color in two contexts .ad_wrapper and .footer_links a:visited
129 Same colors for color and background-color in two contexts #content and .footer_links a:visited
138 Same colors for color and background-color in two contexts .thumbs and .footer_links li
138 Same colors for color and background-color in two contexts #content and .footer_links li
138 Same colors for color and background-color in two contexts .ad_wrapper and .footer_links li

Quote:

Originally Posted by PSD CSS XHTML

As I mentioned, it's kept very basic for the broadest usability. CSS shorthand and em measurements are not good for noobs figuring out what is what and that's more about scalability than SEO.

As for the extra divs, it was a conscious decision to make it as flexible as possible. This could be used for submitting with standard recip buttons or as a super FHG with a very hard sell. Of course the sample gall could be done differently, but this is a template solution.

The meta tags was kind of an assumed thing which i guess I shouldn't have assumed

You can try to make up any excuses as you'd like. But I think you pretty much just shot yourself in the foot.

PSD CSS XHTML · 04-13-2009, 09:00 PM

Quote:

Originally Posted by potter

You can try to make up any excuses as you'd like. But I think you pretty much just shot yourself in the foot.

Could you show me exactly where I "shot myself in the foot"?

I admitted there was an extra closed div tag, but if that's really all you got.. because if you take the time to check, that will eliminate all the errors.

and I have no idea what you are running the css through to get those color errors but that is really hilarious. What should I be worried about there? A little redundancy at the worst case. Remember, this is a template so people can easily customize it.

I never claimed it was the holy grail of XHTML/CSS perfection.

potter · 04-13-2009, 09:12 PM

Quote:

Originally Posted by PSD CSS XHTML

and I have no idea what you are running the css through to get those color errors but that is really hilarious. What should I be worried about there? A little redundancy at the worst case. .

woooooooow

shot in the foot again

http://jigsaw.w3.org/css-validator/

http://jigsaw.w3.org/css-validator/v...ng=1&la ng=en

devine · 04-13-2009, 09:27 PM

Quote:

Originally Posted by potter

You can try to make up any excuses as you'd like. But I think you pretty much just shot yourself in the foot.

Man, if you take that div out it validates, there are not 3 errors, just one that causes the other two, and everyone can make a mistake. I'd check for errors first myself, but it's not like the end of the world. Obviously the guy is trying to promote his services and there's nothing wrong with that, he's doing it by providing some kind of freebie or example of his work.

Now, I assume you're beyong w3.org since I get this:

with CSS2.1 profile

Quote:

W3C CSS Validator results for http://organicautomotive.com/temp/ (CSS level 2.1)
Congratulations! No Error Found.

This document validates as CSS level 2.1 !

To show your readers that you've taken the care to create an interoperable Web page, you may display this icon on any page that validates. Here is the XHTML you could use to add this icon to your Web page:

with CSS3 profile

Quote:

W3C CSS Validator results for http://organicautomotive.com/temp/ (CSS level 3)
Congratulations! No Error Found.

This document validates as CSS level 3 !

To show your readers that you've taken the care to create an interoperable Web page, you may display this icon on any page that validates. Here is the XHTML you could use to add this icon to your Web page:

btw, I remember a thread where you were trying to sell some CSS designs and a lot of people attacked you. I didn't like that at all, I understand this is GFY, but still. However, now you do the same to someone else? Way to go...

PSD CSS XHTML · 04-13-2009, 09:27 PM

Quote:

Originally Posted by potter

woooooooow

shot in the foot again

http://jigsaw.w3.org/css-validator/

http://jigsaw.w3.org/css-validator/v...ng=1&la ng=en

No errors! Thanks for the link.

Now, there are warnings about divs having the same color as text found in other places on the page. It's a WARNING, in case you have them overlapped somewhere.

It's just telling you that there may be a case of invisible text, but that issue is not present in my template.

Anything else? My feet are fine. How are yours?

potter · 04-13-2009, 09:45 PM

You claim to be a CSS/XHTML expert, come on GFY and provide an example of your work which doesn't even validate and has a bunch of CSS warnings?

You expect any different?

Quote:

Originally Posted by devine

btw, I remember a thread where you were trying to sell some CSS designs and a lot of people attacked you. I didn't like that at all, I understand this is GFY, but still. However, now you do the same to someone else? Way to go...

I even went back and reread the thread. The only non-trolls defended me, or couldn't back up their "attacks" with any urls/examples. I even mentioned early on trolling was to be expected.

PSD CSS XHTML · 04-13-2009, 09:51 PM

Come on man. I understand you have to stick to your guns now that you've made such a big deal, but you are basically bitching about an extra </div> The color warnings mean nothing and you know it (at least i hope you do).

I also never claimed to be an "expert"

potter · 04-13-2009, 10:01 PM

Quote:

Originally Posted by PSD CSS XHTML

Come on man. I understand you have to stick to your guns now that you've made such a big deal, but you are basically bitching about an extra </div> The color warnings mean nothing and you know it (at least i hope you do).

I also never claimed to be an "expert"

Stick to my guns? No. Anyone on here who knows me, knows when it comes to code I'm extremely anal.

potter · 04-13-2009, 10:05 PM

And don't feel too bad. I do the same sometimes as well.

http://jigsaw.w3.org/css-validator/v...ning=1&lang=en

It was pretty dumb to not validate your shit though before you started this thread.

PSD CSS XHTML · 04-13-2009, 10:16 PM

I'll admit it was dumb if you admit the stuff your nitpicking over has ZERO impact on the effectiveness of the template.

And seriously, I ALWAYS validate, but this was so basic, I knew there were no errors along the lines of me coding something incorrectly, and not just forgetting to delete a close tag from another iteration.

Brujah · 04-13-2009, 10:36 PM

Why is potter being an asshole? Thanks for the sweet free template, PSD.

Bored · 04-13-2009, 10:39 PM

validation is a great tool to check your code for errors. It allows you to track down specific errors and correct them.

It is recommended that you use a strict doctype to reduce the amount of 'errors' or redundancy in your code but it is really depends on the situation.

More over, a site that validates 100% doesn't mean its coded properly. You can get a blank document to validate 100%.

PSD CSS XHTML posted a fantastic template for a gallery. Not only is it purely css driven, sematic and clean, but it also has a lot of SEO elements most templates wouldn't provide. If it doesn't validate, big deal, make the changes and get it to validate yourself. In the end, he has provided this FREE for people to use.

Validation is not the be all and end all of properly coded HTML/CSS

04-12-2009, 11:51 AM	#2
PSD CSS XHTML Confirmed User Join Date: Mar 2009 Location: I was right here a minute ago Posts: 546	Nobody wants it? Maybe I need to whip up another template. __________________ . . psd to xhtml/css conversions . . cost effective css template solutions . . and now offering css lessons . . My XBIZ profile

04-12-2009, 02:03 PM	#5
brassmonkey Pay It Forward Industry Role: Join Date: Sep 2005 Location: Yo Mama House Posts: 77,188	looks good there __________________ TRUMP 2025 KEKAW!!! - The Laken Riley Act Is Law! DACA ENDED - SUPPORT AZ HCR 2060 52R - email: brassballz-at-techie.com

04-12-2009, 03:40 PM	#7
fris Too lazy to set a custom title Industry Role: Join Date: Aug 2002 Posts: 55,363	nice, css gallery templates as so much easier to deal with __________________ Since 1999: 69 Adult Industry awards for Best Hosting Company and professional excellence. WP Stuff

04-12-2009, 03:52 PM	#8
candyflip Carpe Visio Industry Role: Join Date: Jul 2002 Location: New York Posts: 43,061	Thanks for sharing. __________________ Spend you some brain. Email Me

04-12-2009, 04:08 PM	#9
qxm Confirmed User Join Date: Jul 2006 Location: NoHo Posts: 5,970	dude... CSS is SOOOO Sexy! __________________ ICQ: 266990876

04-12-2009, 11:54 AM	#3
MoreMagic Confirmed User Join Date: Feb 2006 Posts: 2,848	I am a css freak and love what you did there. Didn't cum like that for ages.

04-12-2009, 11:57 AM	#4
Ozarkz So Fucking Banned Join Date: Jan 2009 Posts: 2,377	Very nice example.

04-12-2009, 02:08 PM	#6
Vox Confirmed User Industry Role: Join Date: Mar 2002 Location: Montreal Posts: 2,710	Awesome, thanks for sharing.

04-12-2009, 09:04 PM	#10
PSD CSS XHTML Confirmed User Join Date: Mar 2009 Location: I was right here a minute ago Posts: 546	Thanks. I hope someone posts their versions of the gallery. I wonder if anyone would want a version for tgp/mgp. Does the average porn webmaster know CSS? __________________ . . psd to xhtml/css conversions . . cost effective css template solutions . . and now offering css lessons . . My XBIZ profile

04-12-2009, 10:25 PM	#11
Deej I make pixels work Industry Role: Join Date: Jun 2005 Location: I live here... Posts: 24,386	I like your style __________________ Deej's Designs n' What Not Hit me up for Design, CSS & Photo Retouching Icq#30096880

04-12-2009, 11:41 PM	#12
devine Confirmed User Join Date: Jul 2006 Posts: 620	the page isn't validating because you have one more div in excess at the bottom, remove it and it should be OK

04-13-2009, 01:26 AM	#15
yoeleven Confirmed User Join Date: Jun 2007 Posts: 200	thanks for this

04-13-2009, 01:43 AM	#16
v4 media Confirmed User Industry Role: Join Date: Feb 2005 Location: Spain Posts: 2,934	It's nice, but having an uncut 90k image loading at the top can hammer a gallery productivity. but the code's still useful.

04-13-2009, 06:24 AM	#17
boneless Confirmed User Industry Role: Join Date: Dec 2002 Location: in your head Posts: 3,625	care to post a sample psd file for the header bg so noobs like me can started right away and make their own stuff. i love the template and am digging into it when i return from the vets. __________________ icq:148573096 skype:dabone2 email:boneless(a)mgpteam(.)com

04-13-2009, 06:47 AM	#18
tranza ICQ: 197-556-237 Join Date: Jun 2003 Location: BRASIL !!! Posts: 57,559	This is awesome! __________________ I'm just a newbie.

04-13-2009, 04:05 PM	#21
PSD CSS XHTML Confirmed User Join Date: Mar 2009 Location: I was right here a minute ago Posts: 546	If you have a network of sites you need galleries for, let me see them. I can develop a real cheap css template solution for you to use across them all. I'm reviewing sponsor lineups now and I have so many ideas I'd love to try, but I need to know it's going to make me money before I spend too much time on it, and there's no way I'll ever get around to submitting them. That doesn't look like any fun at all. But, I would love to work with a program that has 10 or more hot sites. Since I don't submit or have the traffic to really test this sample, so if anyone who runs a large tgp network wants to run a couple of these galls, I'll make you a couple free versions and we can test the ctr. __________________ . . psd to xhtml/css conversions . . cost effective css template solutions . . and now offering css lessons . . My XBIZ profile

04-13-2009, 04:14 PM	#22
Si Such Fun! Industry Role: Join Date: Feb 2008 Posts: 13,900	Nice Could be very useful.

04-13-2009, 04:15 PM	#23
Bored Confirmed User Join Date: Feb 2002 Location: Canada Posts: 1,011	Nicely done. I wouldn't consider this fully SEO optimized however. I would recommend using a strict doctype. Meta tags are a must, keywords, description Font size should not be declared in px. Only use em or % Extra divs are not needed (container, gallery_header). You can target html, body,h2 to get the same effect css and html could be reduced quite a bit, using short hand css and removing redunant div tags Other than that, its fairly straight forward, clean and semantic. __________________ If Satan Wore a Hairpeice, there would be HELL TOUPEE!! HTML Porn pbbc fo li Last edited by Bored; 04-13-2009 at 04:16 PM..

04-13-2009, 09:51 PM	#31
PSD CSS XHTML Confirmed User Join Date: Mar 2009 Location: I was right here a minute ago Posts: 546	Come on man. I understand you have to stick to your guns now that you've made such a big deal, but you are basically bitching about an extra </div> The color warnings mean nothing and you know it (at least i hope you do). I also never claimed to be an "expert" __________________ . . psd to xhtml/css conversions . . cost effective css template solutions . . and now offering css lessons . . My XBIZ profile

04-13-2009, 10:05 PM	#33
potter Confirmed User Industry Role: Join Date: Dec 2004 Location: Denver Posts: 6,559	And don't feel too bad. I do the same sometimes as well. http://jigsaw.w3.org/css-validator/v...ning=1&lang=en It was pretty dumb to not validate your shit though before you started this thread. __________________

04-13-2009, 10:16 PM	#34
PSD CSS XHTML Confirmed User Join Date: Mar 2009 Location: I was right here a minute ago Posts: 546	I'll admit it was dumb if you admit the stuff your nitpicking over has ZERO impact on the effectiveness of the template. And seriously, I ALWAYS validate, but this was so basic, I knew there were no errors along the lines of me coding something incorrectly, and not just forgetting to delete a close tag from another iteration. __________________ . . psd to xhtml/css conversions . . cost effective css template solutions . . and now offering css lessons . . My XBIZ profile

04-13-2009, 10:36 PM	#35
Brujah Beer Money Baron Industry Role: Join Date: Jan 2001 Location: brujah / gmail Posts: 22,157	Why is potter being an asshole? Thanks for the sweet free template, PSD. __________________ Free Premium Domain Lists and Tools at Clickmojo.com For Sale: Obscenity.com

04-13-2009, 10:39 PM	#36
Bored Confirmed User Join Date: Feb 2002 Location: Canada Posts: 1,011	validation is a great tool to check your code for errors. It allows you to track down specific errors and correct them. It is recommended that you use a strict doctype to reduce the amount of 'errors' or redundancy in your code but it is really depends on the situation. More over, a site that validates 100% doesn't mean its coded properly. You can get a blank document to validate 100%. PSD CSS XHTML posted a fantastic template for a gallery. Not only is it purely css driven, sematic and clean, but it also has a lot of SEO elements most templates wouldn't provide. If it doesn't validate, big deal, make the changes and get it to validate yourself. In the end, he has provided this FREE for people to use. Validation is not the be all and end all of properly coded HTML/CSS __________________ If Satan Wore a Hairpeice, there would be HELL TOUPEE!! HTML Porn pbbc fo li