Thread Design & Banners

This topic is listed in Contests - Auditions. It has been viewed 15,177 times and 2 replies have been made.

AnnieLEVEL 86

Edited post by AnnieGOLD

This is a simple Cheat Sheet to help you when setting up your contest thread and providing banners to your contestants. You'll also find some fantastic Community Generated Banner And Design Resources listed below.

BBCode Rules:
1) When combining tags, you need to close them in the reverse order of the way you opened them.

2) All tags must have a closing tag (i.e. one opening tag and then one at the end with a backslash before it to close it).

3) Colors can be added in either Color Name or in HEX code. (The HEX code must always have the # sign ahead of it).

4) When centering nested tags, be sure that the center tag is the outermost pair.

Example of tags being closed in opposite order of being opened:

[center][color=blue][b][i]This is sample text.[/i][/b][/color][/center]

Terms to know:
This is the 'address' of the link or image you are adding. Links and images should both start with http:// . Links will end with .com, .net, .gov, etc. Images will end with .jpg, .gif, or .png.

Nesting: This term refers to grouping tags together in order to apply several styles to one item. (i.e. Bold, Italic, Colored text)

Bold Text

[b]Text Here[/b]

Italic Text

[i]Text Here[/i]

Colored Text

[color=blue]Text Here[/color]


[color=#0000FF]Text Here[/color]

Font Size

[size=20]Text Here[/size]
*Font Size can be any number between 10 and 29

Centered Text

[center]Text Here[/center]

Clickable Text

[url=Link Goes Here]Text Here[/url]

Inserting an Image


Providing your banner code to your contestants (this method shows only the code box):

[code]Image URL goes here[ / code]
*Eliminate the spaces in the closing tag. They were inserted here simply to allow the code to show to you.

Providing your banner code to your contestants (this method displays both the image and code with the same command:

[img code = show]url to image[/img]
*Eliminate the spaces in between code=show. They were added in this example solely to be able to display the code to you.

Combining Tags (Nesting):
You may want to create text using one or more of these styles. To do so, you need to nest the tags around your text. Remember that closing tags must be set in reverse order of how they were opened. See some examples below:

Red, Bold Text

[color=red][b]Red, Bold Text[/b][/color]

Centered, Bold, Italic, Blue Text

[center][b][i][color=blue]Centered, Bold, Italic, Blue Text[/color][/i][/b][/center]

Design Notes
Colored text is difficult to read for long periods, and may even be impossible for some. Use font styles as points of emphasis rather than as an entire post or comment, and it is the VERY rare occasion that you should use more than one color in a post. Making sure that the color that you are using has enough contrast against the background is important as well. For example, light pink is extremely difficult to read on a white background, but would be very stunning on black.

Keep images at a reasonable size. A reasonable size for any thread post or comment would be around 300px X 300px with the exception of a banner in an opening post which can be much larger. Animated images are annoying. I'm sorry if you like them, but I'm just being honest. Most people don't. If you want animated images on your own pages, go to town! However, courtesy would dictate that you do not leave them on others' pages unless you've received specific permission. Keep in mind though that others visit the recording as well and would be subject to the flashing.

It's best to keep most text aligned to the left. Use centering for emphasis rather than as an entire paragraph. This makes it much easier to read and comprehend.

I hope the above helps. :) Be sure to use the Preview button below the text box before posting to be sure your post looks the way you want it to. You can avoid a lot of editing mistakes this way. It will also help you avoid the 30 minute cut off for editing.

AnnieLEVEL 86

Edited reply by AnnieGOLD


Edited reply by RobSTAFF +3

Community Generated Design And Banner Resources Listed Alphabetically

Chez's Contest Templates & Banners

If you have created a resource that you'd like added to this list please contact Rob and request it be added.