Member Guides: Graphics Tutorials

1.  Working With Text

Text can be both an effect and "just" text in an image. Effects from text include repeating the same line over and over in a pattern, or creating a shape out of a sentence. They can create a nice mood or set the topic for your table. When using text as an effect, readability can become compromised. If you want to make sure the reader at some point also is able to clearly read the text , you should duplicate it and place it on the image again with better readability.

2.  Signatures

2.1  Transparent Signatures

Most graphics programs operate with layers. Layers works like the word seems; it's like many sheets of paper on top of each other, only you can adjust opacity and color effects and all kinds of cool things. To make signatures transparent, you should work from a blank layer.

Open your graphics program of choice and create a new layer (In Photoshop, press CTRL+Shift+N, In GIMP IDK). If your program has a default background layer to new files, delete it first, and you will see that the canvas is now no longer white, but "see-through". The gray and white chessboard pattern marks areas where the image is transparent.

3.  Graphics for Tables

3.1  Seamlessly Fading Images

Many tables have an image behind the text that fades into a background-color. To make these, take your image and open your program of choice. You should figure out (for example via google!) how you can use gradients in that program. Create a gradient that fades into a solid (to ensure this works 100%, make sure opacity is set to 100%) color at the bottom/top, and that color should be the background-color for the table coding so it blends perfectly.

3.2  Separate Images

Separate images can be used for tables, creating a nice separator between the text to come and the header or bottom of a table. It's nice to add a border to it, so the picture doesn't just go from picture into a background-color, which can give an unfinished look. If you use borders on the complete table code, you only need to add a border to the top/bottom of the image which will precede/follow the text.

3.3  Mobile Compatible Tables -- by Tammi

A lot of folks at 'Souls browse on their cellphones. When coding a table, there are a few tricks you can use to make sure someone else can easily read the thread on their phone. These may seem like no-brainers, but hopefully someone can use them as a checklist!

  • Don't specify a static width: One of the easiest ways to make sure your post fits on a small screen is to eliminate static widths. This means don't set a width:300px or a width:450px in the table.
    Use a flexible width table or a heraldic text table and specify your width in terms of percentages instead of pixels. This means that it'll be easier to read. Note that if you have an image beside your table (such as with a heraldic width table), your text may show up below the image instead of beside it.
    -> Eg: width:90%
  • Don't use a scrollbar: Most cellphones cannot scroll within a secondary scrollbar, so eliminating them from your coding helps a lot! This also goes for profiles.
  • Use high contrast between your background colour and your text colour: Since the screen is smaller, it can sometimes be more difficult to read the text. That being said, cellphone screen displays are usually pretty bright, so you might be able to get away with low contrast. ;) Either way, it's generally good practice to make sure people can read your table! c:

4.  Copyright? Creative Commons?

Many people do not fully understand copyright law -- it is a common misconception that any and all graphics found on the Internet are there for public use, and you can simply google up an image and use it. THIS IS ABSOLUTELY NOT TRUE! Copyright is a very serious matter, and copyright law absolutely extends to the Internet. It is very important to respect copyright law -- it is the law, after all! Some forms of copyright violation -- for example, art theft, where a user claims another artist's work as his or her own -- can and will result in a ban from 'Souls.

Fortunately, there are some things you can do!

  • Try to use Creative Commons images -- these are images that people purposefully release to the public for their use.
  • Try to also use public domain images -- these are images that are either so old the copyright has expired, or are otherwise immediately relegated to the public domain.
  • Try to use other non-copyrighted images. For example, all photographic work done by United States government employees as a part of their job duties are automatically licensed under the public domain and thus free to use -- images from NASA, images from the Fish and Wildlife Services, and many other images are all perfectly fine for you to use.

See Graphics Resources for a list of places you can get Creative Commons and other free-to-use images.

5.  Programs

6.  Member Tips

Members: Feel free to add your own tips, however brief, here! Remember, you can sign your tip with four tildes (~)

  • Don't stick to one specific stock image site. Look around a few different ones, because you may not find a sutible image on one site, but you may find a really awesome one on another. If you stick to one you'll never find out! -Rose

7.  More Information and Resources

Category: Stubs