Forum archives » Regarding Stripcreator » Spicing up your comics

Aylear
April 5, 2009 2:38 PM

HTML Code: Cruise control for comedic genius

There are a number of ways you can spice up your comics. Italics, underlines, varying text size, and a couple of other very neat tricks all used in moderation can be used to emphasise words, statements, and even whole sentences. I'll outline a few of the best and most popular tags, as well as show some examples of perfect usage in the form of comics.

The trick is to use HTML code, mostly HTML tags which form the backbone of any web site. Here's the basics:

HTML tags in their simplest form consist of a lesser-than sign (<), a command, and a greater-than sign (>), like so: <command>. Any text following the tag is subject to the nature of the command. To cancel the tag and bring the text back to normal, add a new tag with the same command, but add a slash to the command, like so: </command>. This cancels whatever command is in effect, and any text following the slash command is returned to normal.

Most HTML tags won't work on Stripcreator. It's worth keeping in mind that most HTML tags will, in fact, appear to have the proper effect in the comic preview screen, but the commands are cleaned out before the comic is finalized and generated.

There are four worthwhile tags to keep in mind. The two most useful tags by far are <i>italics</i> and <u>underlines.</u> Italics, especially, are great for word emphasis. So, for instance, the following line:

:: I told you, I will <i>not kill a <u>kitten!</u></i> Stop asking!

will show up in your comic as:

:: I told you, I will not kill a kitten! Stop asking!

An example of absolutely perfect use of italics:

/comics/Injokester/391177/

 

One thing to notice is that you can't use bold tags (<b>) on Stripcreator since all text in comics is bolded by default, thus it has no effect. You also can't cancel the default bolding with </b>.

Two other great tools are the brilliant size-altering command <small> and its less-useful cousin <big>. Small may be useful to emphasise whispering or something said under his/her breath, or something said in a weak/defeated tone of voice. An example:

 

/comics/Aylear/457833/

 

Also note the italics for emphasis on the word "yeah", as if said in a sarcastic or dubious tone of voice.

Finally, there's a very neat trick I want to show you. You can also use HTML code in the comics - more specifically, you can input the HTML name of a specific character in place of that character. A HTML name, consisting of an ampersand, some letters or numbers and a semicolon, is the HTML designation for any one specific character. For instance, &#44; is the designation for a comma, and you could actually use it in place of a comma if you so desired. &#33; is an exclamation mark, &#65; is a capital A, &#66; is a capital B, etc.

Not overwhelmingly useful on the whole, save one: &nbsp;

&nbsp; inserts a non-breaking space instead of a regular space. What this means is that two words separated by &nbsp; is actually counted as one word. Therefore, the sentence:

:: Oh&nbsp;shit,&nbsp;I&nbsp;may&nbsp;be&nbsp;in&nbsp;trouble.

shows up as 

:: Oh shit, I may be in trouble.

in the browser, but the entire sentence - by the grace of &nbsp; - is treated by the browser as if it is one word. Therefore, the words in the sentence won't get pushed down onto the next line, nor will the phrase appear on the line above it if there is no room for it to do so on the whole. As a visual aide, I present the following comic:

 

/comics/Aylear/458253/

Note the four lines that make up each part of the poem. Normally, after the first line "And as I sit 'neath light of night", the first words in the second line, "No sun", would appear on the first line because they fit within the text frame. The trick is to type the next sentence as "No&nbsp;sun;&nbsp;no&nbsp;moon, no stars in sight", turning "No sun, no moon" into a word and making it too long to fit in the first line of the text frame, thus forcing it onto the second.

The third line, equally, is written as "yet&nbsp;you&nbsp;excite, for in that light", rendering the phrase "yet you excite" too long to fit into the previous line and forcing it onto the next.

It's a neat little trick. Note you don't need to write a poem to make use of it; it's often a great tool to clean up dialogue boxes and make words appear in the line you want them to.

Final example of using &nbsp; to clean up dialogue boxes:

/comics/Aylear/457963/

Here I use multiple &nbsp; commands after another to form a blank word and therefore push the next word, "Unfortunately.", one line down. Doing this requires a LOT of &nbsp; though.

So basically HTML code is awesome.

Once again, the list of commands:

<i>italics</i>
<u>underline</u>
<small>small text</small>
<big>big text</big>

&nbsp : non-breaking space

And that's about it. If you have any questions, ask and I'll respond ASAP. (Here's to hoping this post shows up right.)

Post #269997link

crabby
April 5, 2009 2:45 PM

Thank you very much for this. It is very much appreciated. 

Post #270001link

elmnt
April 5, 2009 3:01 PM

Perfect! This is exactly what I needed. Now I'm gonna need to donate and go back and edit some of my strips. Thanks!

Post #270004link

TheGovernor
April 6, 2009 9:00 AM

You can also use html character codes for non standard characters, for instance the music symbol ♫

& #9835;

(remove the space between the & and the #)

Post #270056link

evil_d
April 27, 2009 6:11 AM

I'm seeing a lot of comics lately with "&nbsp" in them.  I assume this looks right to the people who make them, but it's showing up wrong for me.  The moral: remember to include the trailing semicolon (i.e., &nbsp; instead of just &nbsp).  Some browsers may support the semicolonless version, but some may not.

Post #270747link

ladyjdotnet
June 4, 2010 8:01 AM

I wish I had known about nbsp before. That's some useful shit right there.

Post #277753link

Aylear
March 4, 2013 12:14 AM

Oh, hello there.

Post #286927link

evil_d
March 7, 2013 6:39 AM

quote:

Aylear wrote:

Oh, hello there.


Hi.

Post #286960link

evil_d
April 18, 2016 6:34 AM

Bumping this thread.  If I could pin it, I would.

Post #294054link

four_legged_tripod
May 17, 2017 6:56 AM

So I'm an older fart who just missed all the tech growing up so I don't know how to do all the cool things others can.  So when I read this comic, my first thought was "How do you add emojis to the comics here?"

/comics/Miller12/596062/

 

Post #295629link

jes_lawson
May 29, 2017 9:33 AM

My first thought was "Why would you want to?"

 

But try http://unicode.org/emoji/charts/full-emoji-list.html

 

Post #295672link

dcomposed
May 29, 2017 5:55 PM

quote:

jes_lawson wrote:

My first thought was "Why would you want to?"

 

But try http://unicode.org/emoji/charts/full-emoji-list.html

 


🤦 👴 😂

Post #295673link

dcomposed
May 29, 2017 6:39 PM

💡 Also if you are on Win10💻 enable the touch keyboard⌨️ in your taskbar⚙️ and you can switch it to emoji🙂.

💯

Post #295674link

four_legged_tripod
January 9, 2018 9:08 AM

/comics/four_legged_tripod/601054/

Post #296254link

Forum archives » Regarding Stripcreator » Spicing up your comics

stripcreator
Make a comic
Forums
featuring
diesel sweeties
jerkcity
exploding dog
goats
ko fight club
penny arcade
chopping block
also
Brad Sucks