Graphics

At 'Souls, many roleplayers enjoy using "tables" to write their posts. Although everyone is welcome to use them, please keep in mind a few courtesies and tips. Additionally, if you would like a table, you can check the Talents forum and make a request in the Requests or Studios subforums.

What's a Table?

A table can be almost anything that contains text and can be constructed out of basic HTML tables or heavily CSS-modified div layers depending on your knowledge and skill level.

Your basic table has a header image and In Character and Out of Character labels for your IC and OOC text. You can format the text almost any way you'd like -- the only constraints are that your text must be readable. Some common font choices are Verdana, Tahoma, Arial, and Trebuchet MS. Some good sizes are 10px and 12px. Much of the rest of the table depends on you and your aesthetic choices. Experiment! If you aren't really sure where to start, you can always ask around in the Talents forum, look at a few HTML/CSS tutorials, or just ask someone else to make one for you. A template/tutorial for CSS tables can be found on the Resources page.

Common Table Mistakes

'Souls is, at its heart, a writing community. These five common mistakes make it very difficult to read other roleplayer's writing and make it more difficult to roleplay -- users absolutely should not have to highlight your table text or copy and paste it to Notepad to read it! They should be able to read it directly in the forum itself. Please consider these five common mistakes and edit your tables accordingly to ensure all users can read your posts!

Too Little Contrast

Failure to include enough contrast between the table background and the table text. For users with darker monitors, contrast between darker colours is difficult to distinguish. Another important consideration is color contrast -- if your contrast for text and background is poor, users will have difficulty reading your table.
BAD: Hi, you cannot read this very well!
GOOD: Hi, you can read this text very well!

Small or Improper Font

Using a small, or generally unreadable font. Small text can be difficult to read for users with big screen resolutions. Poor font choices are also equally problematic: if you choose to use a front like Papyrus or Mistral, not only will it make your table difficult to read but also make your post look rather silly! Here are some examples

Font Style

There are various ways to style your text in CSS, and while they do give you quite a lot of control over your text, some stylistic choices can make it very difficult for users to read. Certain types of stylings should be left for headers and subheaders, rarely used in speech, and avoided entirely in the main body of a table.

Small-caps should never be used for table text, not for speech or thought, and definitely not for your primary choice. Text-transform should never be used for table text, whether that is to change everything to uppercase, lowercase, or initial-caps. None are appropriate. Letter-spacing can be used in moderation, but too much and your text becomes unreadable, fast! Line height is another important consideration -- too much or too little, and your text becomes far less readable.

Text-Shadow

With the release of CSS3, many users have started updating their tables with the new CSS capabilities. While this can be fun, it does make the page take longer to load, so CSS3 techniques should be used sparingly! An example of overuse of CSS3 is using text-shadow for the entire table. While it can spice up the dialogue when you bold your text, it can also make it very difficult to read if everything has a shadow! REMEMBER, Internet Explorer does not yet support many CSS3 capabilities. Your tables should be readable with or without text shadow, as not all browsers will render it.
BAD: Hi, you cannot read this very well!
GOOD: "Hi, there!" you can read this text very well!

Opacity

CSS opacity is particularly problematic because not only does it make the background translucent, it also makes the text translucent. If you'd like to have a light white background, please consider using an image that is set to 25% opacity. Sie has a guide that shows an easy way to use transparent PNGs for low opacity backgrounds without sacrificing text readability -- however, please note that older browsers do not support transparent PNG images. For maximum readability, avoid using opacity or transparency to style your tables.

Scroll Tables

Since scroll tables significantly eliminate a lot of white space, it makes it difficult to read the text. When coupled with other mistakes, it makes it even tougher to read the post! If you absolutely must use a scroll table, please ensure the height and width give other players enough room to read and comply if they ask you to change tables. Another important consideration is that some mobile browsers do not properly support the CSS overflow command, and thus users can't scroll your post at all. In these cases, you're actually forcing users to quote your post to read it, which is unfair!

Justified Text

Thin tables make your posts look much longer than they actually are, but really, who cares about length? It's not the size that counts, after all. However, one readability problem with using thin tables is that users will use justified text alignment. Left aligned text is much easier to read in thin tables than justified.

Avatars

standard .GIF	transparent .GIF	standard .JPG	transparent .PNG

An avatar goes to the left of your post and is something used to identify your character. Your personal picture must be 200x200 pixels or less or the board will resize it. Your picture should also be in either .GIF, .PNG, or .JPG format. GIF files can only handle 256 colors and thus your files might look different than when they did in the photo program; they are also abnormally large, and thus JPG is preferable. PNG format has the advantage of being lossless; however, these files can be very large when used for larger images and should be avoided. If all of this talk of filetypes confuses you, your best bet is JPG.

Adobe Photoshop, GIMP, and Paint Shop Pro are all very good programs to edit your avatar with. The Resources page lists a number of places you can go to look for photographs. If you can't or don't want to make one yourself, you can ask around in the Talents forum to see if anyone else will make you one.

When you have a finished avatar, you will need to upload it. Aforementioned Resources page also has a list of free hosts. Once this is accomplished, you should have a URL for your picture: http://site.com/yourlogin/picture.jpg, for instance. Copy the URL of the image. On your Control Panel, there is a section labeled 'Edit Avatar Settings.' You can paste the URL of the image into the box provided, or click browse to upload it directly from your computer. You must also input the dimensions of the image! After this, go find any posts you've made to see what it looks like. The board automatically updates your avatar and signature so every post you have made displays it. If you need visual representation of what to do, please click on the attached image, which provides a tutorial for the various methods of attaching an avatar.

Signatures

Azrael Oriax it's peaceful, the pitch black, when the last light on goes out.
text-only signature	transparent .PNG signature

The traditional signature usually has the name of your character and some song lyrics, either related to the character or "just pretty" lyrics. You can make nice text-only signatures, but stick to fonts that most people have on their computers -- Verdana, Tahoma, Garamond, Trebuchet MS, Times New Roman. If you don't, the signature will just display in their default font, which can be ugly. Naturally, you can also make nice signatures out of images, where you can use any font you want.

Although many of 'Souls's board skins have the same or a similar background color, there are a few that don't. To ensure that your signature looks right for everyone, you should try to either use a text-only signature or a .PNG or .GIF image signature with a transparent background. It's important to remember to keep your signature readable accross as many skins as possible.

Some roleplayers will also place image or table credits, absence notices, or possible reasons for delay in their signatures in addition to, or in place of, the traditional signature. Some people choose to promote various aspects of 'Souls in their signature -- for example, displaying some pack pride, or even encouraging others to edit the Wiki or vote for 'Souls every day.

Post Logs

A post log is just that -- a log of all the topics/threads/posts your character is currently active in. Things typically included in a post log are reply status, a thread link, the thread title, and the participants. Reminders can also be kept in a post log. Many users also keep an archive of their character's finished topics separate from their post log, but in a similar format. A basic template for a post log can be found on the Resources page.

Resources

1. Check the FAQ if you have questions about graphics.
2. The Resources Thread has both images as well as design resources -- check it out!
3. Any graphics-related question you have, whether it's related to art or roleplay graphics, can be asked in the Talents thread. There are plenty of helpful people willing to give you a hand.