Text TGP Design

If you decide to convert your thumb-preview TGP to a text-only version and you don’t want to flush your site’s productivity straight down the toilet, a lot more thought is required than merely replacing thumbnails with text links. You may not be able to use your existing design at all. And of course all the factors in this article apply to brand new designs or when tweaking existing sites.

Basic Considerations

  • Since most webmasters have broadband connections, we tend to forget that even in the US, almost 50% of domestic internet users are still on dial-up. Text-based TGP’s in particular attract visitors who have slower connections so you must be careful not to undermine this appeal and thus before using any graphic, ask yourself whether it is adding value for the surfer or to the site. For example, cartoons can add a lot of site-appeal, but more mundane header graphics, if used at all, should be kept to within 10k-20k. If that sounds too restrictive, take a look at Shemp’s 6K logo or at Fucked11 which uses no logo at all (he actually displays keywords rather than a domain/site name).
  • Although surfers only visit a few galleries, they need to see lots of links. You should show at least 300 links on your main page and add archives to reinforce the impression they create, as well as for adding the depth which search engines like to see.
  • TGP surfers always want to know they are seeing something new, so place today’s date in a prominent position.
  • Do not let your design be influenced by the big, long-established sites. The momentum they picked up in less competitive times lets them get away with design flaws that would cripple start-up sites.

Layout & Design

  • Most visitors will be used to reading from left to right, top to bottom, so their eyes will naturally attempt to follow that pattern. Your designs need to take advantage of that and avoid disturbing it. Boxes and lines can be useful design tools, but if not handled correctly can also present a barrier to the eyes’ natural movement.
    A light border is okay for a navigation bar with links the surfer wants to see clearly visible nearby
    Link to gallery
    Link to gallery
    Link to gallery
    but it doesn’t work as we (usually) want if the emphasis is reversed.
    A heavier border and bold text traps the surfer’s eyes and that can work for us or against us
    Link to gallery
    Link to gallery
    Link to gallery
  • Always remember that the surfer is there for free porn, not to visit our sponsors nor our trade links, so we have to work at pulling his eyes where we want them to go. Separating the two types of link is only likely to work if we ensure that the links we want the surfer to click are the strongest. At the same time, we must not hide the links he is looking for, so a careful balance is necessary.
  • One of the easiest layouts to work with natural eye movement is with gallery links in 1, 2 or 3 column-wide blocks, broken up by a small number of large links to trades or sponsors. Unless he quits the page, the surfer has to look at what we want him to see.
    One of the easiest layouts to
    One of the easiest layouts to
    One of the easiest layouts to
    One of the easiest layouts to
    work with natural eye movement
    work with natural eye movement
    work with natural eye movement
    work with natural eye movement
    Simple Vertical Blocks With Breaks
  • If the page needs color which cannot be provided some other way, a very pale background can be put behind the links, but variations in font, size and color may provide enough interest by themselves.
  • Columnar designs, when we place trade/sponsor links alongside gallery links are more tricky. The surfer will spot the column of freebies and ignore anything which is left or right.
    We must force his eyes
    We must force his eyes
    We must force his eyes
    towards what we want
    towards what we want
    towards what we want
    our trades
    & sponsors
    We must force his eyes
    We must force his eyes
    We must force his eyes
    towards what we want
    towards what we want
    towards what we want
    our trades
    & sponsors
  • If space permits, we can use a 3-column design, for example placing trade and sponsor links in a column between columns holding the navigation and gallery links. The aim is to force the surfer’s eyes to pass over the links which are important to us.
    Our Categories
    amateur
    teen
    More Free Porn
    trade one
    trade two
    Galleries For Date
    gallery link
    gallery link
    gallery link
  • 800×600 pixel resolution no longer dominates and monitors are getting bigger. But that is still the most common resolution and monitors larger than 19 inches are in the minority. If your layout skills are up to it, a liquid design is best, one which fills a screen of any size, combined with font-sizes which adapt to users’ settings and can be changed to suit their tastes. If you cannot do liquid designs, I recommend you design for 780px usable width. And if you cannot design at 800×600 on a 17-inch or 19-inch monitor, use a tool like Browser Sizer to check your designs. It is also important to check designs at least in Explorer and in Firefox (which largely behaves like Netscape and Opera) to ensure your site does not look like crap to a significant percentage of your visitors.
  • Text TGP’s can use both “busy” designs or ones which leave a lot more white space. The busy style tends to create more interest and is easier to see as attractive, but they are also harder to accomplish effectively, because without care and skill, everything becomes cramped and runs together. Although Moms Hardcore Porn uses white space more obviously, with anything from 20px to 40px+ horizontal space between blocks, Sun Porno cleverly uses a combination of white space and graphic plus font highlighting to keep the site clean and working as it should.

Fonts

  • Fonts can impact on text-TGP productivity more than just about anything else. Once your TGP is online, test different font sizes and styles. Small lettering for gallery links will rarely maximise productivity but even a 1 or 2 pixel increase can produce good results.
  • If you are going to use font sizes below 12px for large blocks of text, you should almost certainly use Verdana, because it was designed for readability at small sizes. Of the fonts which are installed by default on most PC’s, Arial is the easiest-to-use alternative, followed by ‘Trebuchet MS’ and Tahoma (hard to tell from Verdana except at bigger sizes). Georgia is an easier to read and less old-fashioned option in place of Times, but perhaps too formal for say teen or amateur sites. These two categories can get away with ‘Comic Sans MS’, but it is a very pale, jagged font at small sizes and it can be a good idea to make the text bold). The more decorative fonts can be tiring if used throughout, so it is often a good idea to stick with Verdana or Arial for the main text, using the others for headlines. Impact is useful for big headlines, but becomes hard to read under about 22px.
  • In the absence of graphics, make fonts work for you. You should not normally use more than 2 different faces and 3-4 sizes on a single page, but you can use bold and color to good effect. Be very careful with italics, because most fonts go jagged when set to italic. Never underline anything except links.
  • letter-spacing: 1px; using appropriate positive or negative values can be effective. line-height: 300%; again with values to suit is an easy way to create or reduce white space. font-variant: small-caps; and text-transform: capitalize; are also useful styles.

Color

  • Readability affects whether or not a surfer is comfortable on your site(s) and good contrast is an important part of that. Remember too that without the visual impact of thumbnails, strong colors can much more easily dominate your content. The text-book answer would be black on white, with one or two other colors for highlights, but that can require more design skills than a more complex layout. Using an overall background pattern the way that Sticky Hole does is one solution. Shemp’s use of two shades of a similar color is another and you can also use variations on the image below, with/without the gradient and/or borders:

    Tiled backgrounds need not involve large graphics and gradients can be reduced to a 1px or 2px strip (with the borders applied by CSS), so there are plenty of options which do not break any of the other “rules”.
  • If you are going to use color at all, use it to maximum advantage. Choose colors which will suggest your niche to the surfer and since the pages will not have lots of thumbnails to brighten them up, you could try strong, contrasting colors from within the appropriate palette. Take care to avoid dull color variations for headlines and bright backgrounds.

Top Lists

  • In terms of effective top list placement for full-on trading sites, this is hard to beat. But if low-traffic sites fill the whole first screen with trade and/or sponsor links, they will kill themselves. A much better way for such sites are as Fucked 11 or Sun Porno do it, with just a few links up top (perhaps alongside the logo) so that the surfer can seem them, but also what he came for: the gallery links. There are a couple of gotchas lurking in here. If the aim of your site is income rather than impressive trade stats, you almost certainly want to think twice about giving your most valuable real estate to trades. Even if aggressive trading is your aim, take another look at Mature Nights. He has sixty-five trades in that list, so even if it is clicked a lot, the clicks will not be focused on just one or two trades. I recommend at least 20 links for a table placed as prominently as this and the more the better.
  • One thing you can carry over from thumb-TGP practise is placed trade links between blocks:
    Trade Link
    trade description
    Trade Link
    trade description
    Trade Link
    trade description
  • You must have a top list on your main page these days, if only because other traders expect one, but for sites not aimed primarily at generating traffic, any list longer than 20 sites should appear on a separate page to ensure that maximum advantage goes to your better trades. And regardless of what kind of lists you show and where you place them, always finish your pages off with a single, big bold link to your trade script, promising “More Free Porn” or whatever. Not many surfers will reach the bottom of the page and those who do are more likely to click when a link is obvious and there is no choice to make. This could be how you use a keyword-loaded “h3″ link as mentioned in the next section.

Search Engine Optimization

  • You cannot do much to control the text within your gallery links, but that is not a reason to avoid the basics. Pick 3-5 strong keywords and use them in a “title” tag of 6-8 words total. Repeat the 2-3 keywords you most care about in an “h1″ tag as close to the top of your page as possible. If you use a graphic logo

    an “h1″ tag in a small, bold font can go at the very top of your page without messing up the design

    . Otherwise you could skip a logo altogether

    And Use An “h1″ In Its Place

  • Next, get an “h2″ high up on the page. The most logical place which gives you the chance to include any keywords from your title which did not make the “h1″ (else additional keywords) is

    As A Header For Today’s Galleries

  • Don’t use “h” tags without thought. Although they are an easy way to highlight text on a page, because the search engines take them seriously, used carelessly they can end up diluting your keyword relevancy. You are also expected to use headlines in descending order, but the SE’s will treat each subsequent headline as less important and a good one is needed for the bottom of the page. So I recommend that once you have the “h1″ and “h2″ in place, don’t use headline tags again until the bottom of the page. Here you get your keywords into 

    An “h3″ Tag Perhaps As Part Of The Copyright Notice

     but anyway as close to the bottom of the page as possible.
  • Description and keyword metas, alt (except possibly for linked images) and title tags are reputedly not used by any but the smaller search engines. However that is not a reason to leave them out. Google will use the description tag for display if it gets too far into your site without finding text it can use. 15 comma-separated keywords is about right and the description should be in readable, properly punctuated english, about 20 words long.

Monetizing Your Sites

  • It is a while since run-of-the-mill banners have worked well and they may bring us into conflict with 2257 anyway (if that is a concern). But plain text links, unless the text is very striking, do not work a great deal better. The trick with both is to come up with something original and striking: you may find it easier to use the same type of name+description link that I suggested above for trade links, or take yet another look at Sun Porno for ideas about how to build text-rich promos.
  • For both effectiveness with surfers and with search engines, I recommend you build (short) descriptive text into your trade (except full-size tables) and sponsor links, even when they appear vertically down the side of your page. And remember, the very first screen (particularly the top and right side) is the most valuable real estate on your site. Links at the sides on lower screens are of minimal value. So if they get in the way of a clean design, let them go.
  • Otherwise, the best way to increase your income from a TGP is by using sponsor-provided content with your own gallery designs (sponsor-provided hosting too if you need to sidestep 2257 issues). Submitting your designs to other TGP’s is a good way to get lots of eyes on them so that you can judge the results and tweak as necessary. Once you have the designs right, they will prove a lot more effective than using FHG’s.

Tips

  • If you do not already know enough CSS to do away with tables completely, try to learn. Pages will be smaller and load faster without them, search engines will appreciate the higher text-to-code ratio.
  • If you do have to use tables, to speed up load times, give your bigger (gallery links) tables a class and then use this CSS:
    .yourtableclass {
    	table-layout: fixed;
    }
    
    BUT TAKE CARE when you use this, you MUST give the tables and the td’s a width. It doesn’t matter if those widths are expressed in pixels or %ages, but this tip only works if you tell the browser what the horizontal dimensions of the table are. Used properly, this makes even huge tables begin loading instantly, instead of that wait-for-it then everything appears at once thing.
  • Under no circumstances make your page a single table. If you need to wrap everything, for example to create a block of white on a bright or patterned background, do that with one or more “divs”. Use tables only when you must.
  • Work hard at selling by using your imagination on links and descriptions. But do not rely on link volume to make sales: it is more likely to work against you unless cleverly worked into the design. A dozen imaginative, well-placed links will usually earn more than endless columns of names. And don’t undo the that “big-site” impression by breaking your gallery links into too-short blocks. Always leave at least 30-50 rows in a gallery block. If you can get your promos right and placed at the top of your page, you can even have all your galleries in a single block.
  • If you are converting a site, remember that all your existing visitors are expecting a thumb-preview site. Your traffic and productivity are going to take a dive and many of your trades will become useless. Even when you expect this, the actuality is going to be hard to take and once you have designs up with which you feel comfortable, DO NOT PANIC. Before you start trying to tweak the designs, you will need to find trades with other text sites and give the search engines a little time to register your changes. Until you have surfers flowing through who are expecting text-based sites, you cannot hope to judge whether your designs are working or not. You might want to soften the blow by initially opening your text page on its own URL and using mod_rewrite to divert your new trades there (you can explain to them why) until you are totally happy with your design and have enough text trades to compensate for the drop in traffic from your older trades.

Leave a Comment

Tags: , ,

Related Posts