How to Make a Web Comic, Part 2 : Drawing and Publishing
By Kelly | April 6, 2008
This in-depth tutorial covers the stages of creating a web comic, from start to finish. As an example I’ll be using my short comic Nymph. Be sure to read Part 1 of How to Make a Webcomic for a detailed look at the first few steps.
The process can be broken down into 8 stages:
- 1. Brainstorm
- 2. Rough Story
- 3. Character Design and Planning
- 4. Final Script
- 5. Drawing the Comic
- 6. Get it Online
- 7. Get it Seen
- 8. Profit?
Part 2 of this tutorial covers steps 5-8: Drawing the Comic, Get it Online, Get it Seen, and Profit(?).
5. Drawing the Comic
The first steps laid all the groundwork so that I can quickly and efficiently draw my webcomic. With the characters designed, story plotted, and script complete, the next step is to start sketching layouts for my pages.
I created a layout template file to help at this stage. The script for two pages is printed at top, and the boxes are the same aspect ratio as the final comic page. If you’d like to use my template, download the PSD file here. Print the template page in ‘landscape’ mode for the best results.
I can loosely sketch out my pages in the boxes. The benefit of having two on each page is that, if the comic is printed, the two facing pages of the book can be planned and laid out in a complementary fashion. You probably will want to avoid, for example, two pages with the same layout side-by-side. There are no unbreakable rules for layout, but keep in mind that for western readers, the eye moves from top to bottom, and from left to right. Your first panel should begin at the top left, and lead the eye in a zig-zag across and down the rest of the page by use of panel shapes and composition.
Above are some examples of page layouts I frequently use. My webcomics usually have 5-6 panels per page, which I find suits the size and pacing for my stories. Feel free to experiment with the size, shape, and number of panels to best suit your comic!
As you can see from the example, my layout drawings are really rough. It’s essentially a stick figure, with some attention to pose and facial expression. It’s ok to draw rough, because you can just toss the rough layout and draw a new one if you want to change things up. The final page has a somewhat different layout from the initial rough sketches above.
If you’re interested in learning more detail about comic page layouts and storytelling, I highly recommend Will Eisner’s Comics and Sequential Art. A good companion is Scott McCloud’s Understanding Comics. Both books can be had very cheaply as used copies, or in the local library.
After completing layouts, I draw the final page artwork, then clean up and color it in Photoshop. A more detailed walk-through of my process can be found in this tutorial. Use whichever style and color scheme best suit the theme of your comic.
Tada! Finished page. Now, I’m going to assume that you know how to draw your comic the way you’d like, so I won’t discuss how to finish up the page. There’s plenty of other tutorials to cover that if you still feel unsure.
6. Get it Online
Great! Now you have a comic, but how will anyone ever read it?
The internet makes it easy to get an audience – don’t worry about printing or conventions, just get a website. There are several web communities dedicated to webcomics, which provide free hosting (web page server space) as well as the scripts that will automatically update your comic.
Webcomics Nation has a free membership option, as well as a beefier premium mode for about $10/month.
Comic Genesis appears to be the new incarnation of KeenSpace, a longtime free webcomic host. Popular comics can get listed on their premium site, Keenspot.
Drunk Duck has a spotty track record, but appears to be reborn as a solid option for budget-conscious comicers.
These sites are great for testing the waters with a new webcomic, but be cautious as any free online service can up and disappear with a moment’s notice. If you can’t afford much else, you can register a domain name for your webcomic, and have it redirect to the free webcomic site. If the site dies or your comic moves, you can simply change the URL that your domain points to, and your viewers won’t notice the difference.
example of the Wordpress control panel
The more advanced option is to pay for webhosting (generally $5-15 a month) which usually guarantees your comic won’t disappear abruptly. However, you’ll have to design a website, and install any scripts needed to update comic pages automatically.
The design and updates can be combined in one package by using blog software such as Wordpress. There’s even a popular webcomic variation called ComicPress that can be installed. These scripts require a web host with PHP and mySQL, and can be intimidating to less tech-savvy artists. The benefit is that you have full control of the site, and that comic pages can be scheduled to appear on dates in advance.
An easy alternative is Walrus, a php webcomic script that can be incorporated into any php pages. It has a lot of the same functionality as the blog scripts, but lacks the more advanced (and complex) features. There are plenty of similar php scripts floating around online, so there’s always an alternative if you hit a wall trying to install one.
Photoshop also has a function for generating image galleries in html, which you can use to make your comic website. Chose the option File > Automate > Web Photo Gallery, and set up the options as you like. More advanced users can create a custom template to change the style of the web pages. To update these sites quickly, for example to add or remove some images, just run the script again to overwrite the old pages. Then you can upload the files Photoshop creates onto your webserver.
Or, as I did in the case of ‘Nymph’, you can just use good ol’ fashioned HTML to code your page, and do all the updates manually. For short or infrequently updated sites, this is the simplest and most elegant solution. I like to use html goodies to refresh my memory for html tags and css tricks.
7. Get it Seen
So, your comic is online now, but will anyone see it? And how will you know if they do?
Let’s tackle the second question first. Once we know how visitors arrive to the comic website, we can analyze how to direct more and better traffic there. Google Analytics is a great free tool for traffic analysis. By pasting the analytics code on every webpage you want to track, you can see detailed statistics for your site visitors.
example of the Google Analytics dashboard screen
Some important factors to consider:
Usability : which browser and screen resolution is most common? You can find out under “visitors – browser capabilities”
Keywords : which search engine terms are most popular for your website? You can find out under “traffic sources – keywords”
Referring sites: which webpages are linking to your website? You can find out under “traffic sources – referring sites”
Usability
The web browser and screen resolution used by visitors to your website is important. If folks can’t see your comic properly the first time, they might not come back! Make sure your website looks good in a variety of web browsers and screen resolutions. For Nymph, almost 50% of visitors use third-party web browser Mozilla Firefox. 30% used the latest version of Internet Explorer. 12% used the older IE 6 browser. The rest use Safari or other less mainstream browsers. There’s a handy tutorial here that explains how to test your site in various browsers. To test how it looks in different resolutions, go here. 1024×768 is a pretty safe resolution these days. Try to design your website to maximize the number of visitors that can see it properly.
Keywords
Keywords are the terms users type into a search engine (like Google) to find your website. Google uses data from meta tags as well as content from the webpage itself. Meta tags are information embedded into the website itself. While these are used less and less by search engines lately, it’s still good to include. Try to find the most precise phrases to describe your site, as well as terms you think users would input to find it. It might help to check a similarly-themed webcomic and see which meta data they’ve included.
Here’s an example from Nymph:
It’s helpful to think of keywords as phrases – ‘kelly hamilton webcomic’ is more likely to pull up my Nymph site than just ‘nymph’. Since many search engines give higher priority to page content than to meta tags, be sure to include the keywords in the body of your page as well. Use plain text instead of images, or image alt tags when you can. Don’t overdo it, though- google with punish sites that try to work the system, by giving them low priority in search results. Play fair and it will work to your advantage!
nymph website – a simple navigation system and uncluttered design
Referring Sites
Sites that link your pages are referrers. By using Google Analytics, or alternatives such as Cpanel, you can find out what site your visitors were at previously. This is handy to figure out not only which sites link to yours, but also what kind of sites your visitors tend to like. You can use this info for advertising (more on that later). But how can you get other sites to link to yours?
First, create a few ad banners and include them on your site. You’d be surprised at the number of folks who will link to your site with an ad banner, because they like your comic and want to share it.
nymph banner example
Popular sizes are 200×40 pixles, 88×31, and 468×60. Chose a colorful or appealing image from your comic to catch a viewer’s eye.
Next, why not include links to some of your favorite webcomics as well? They may notice and return the favor. Be sure to warn your visitors before they head off to websites with adult content (unless, of course, your site is adults-only as well).
Request a ‘link exchange’ with other webcomics. Many popular comics won’t bother with this, but if you contact smaller sites or more niche interest comics (furry, for example) you may get a positive response. Webcomicers are a generally friendly bunch, so don’t be afraid to ask. You could alternatively contact the webmaster simply to let them know you like their comic and have linked them. They may respond positively and link you in return, but would ignore a ‘cold call’ link exchange request. Remember that nobody ‘owes’ you a link, so mind your manners. And don’t ask permission to link to another website, it’s proper ‘netiquette’ just to link them without the bother.
Get your comic listed on the many webcomic directories online. Be sure to read the requirements of each site and make sure your comic qualifies.
Online Comics
Belfry Webcomics Index
The Webcomic List
ChoiceComics
TomGeeks
ComicSpace
TopWebComics
BuzzComics
Be sure to promote your webcomic on your blog, personal website, and online art gallery as well. Check the Art Online tutorial for some examples of where you can post your artwork online to get more exposure.
8. Profit?
Your comic is online, and people are reading it! Great, right? but how will you pay the hosting bill? and why bother with the effort of making a webcomic anyway?
If you want to turn your passion into profits, then you’ll need to figure out ways to gain revenue from the webcomic. Advertisements have been a long-time source of revenue for many sites. When the ad market crashed, many relied on profits from merchandise. Some earn money from print editions of their comics. You’ll have to find the right balance on your own, but here are some options that can help repay your efforts.
Google Adsense : displays flash, image and text ads based on your site meta data and content.
Yahoo Publisher Network : similar to google ads. You won’t get paid for non-USA visitor views and clicks.
Amazon Associates : earn a percentage of sales by advertising Amazon products.
Project Wonderful : banner ad network, created by a group of webcomic artists. Mostly webcomics participate.
Lulu.com : Print-on-demand books, comics, and artwork.
Paypal : Sell subscriptions, merchandise, or solicit donations without need for a credit card merchant account.
Ebay : Sell original artwork or commissions.
Furbid : it’s like ebay, for furries.
CafePress : Print-on-demand merchandise like shirts, mousepads, posters, etc
Zazzle : similar to cafepress, POD merchandise
I’ve tested all these services and found them honest and easy to use.
project wonderful ad management page
Some other ideas:
Diesel Sweeties has a newspaper deal, in addition to revenue from PW ads and merchandise.
Penny Arcade does commissioned print comics for various game publishers. They only advertise products they personally test and approve, ensuring visitors can trust the integrity of third party merchandise advertised on their site.
Jay Naylor offers two free PG-13 webcomics with regular updates, but the adults-only spinoffs and side projects have to be purchased. He also has a subscription-based sketchblog- again, adults only.
Wowio offers participants a piece of the profits from downloads of PDF webcomic ebooks. Membership seems to be invite-only now, though.
In Conclusion…
Don’t forget that the sky is the limit for webcomics. There’s no right or wrong way to draw, host, or publicize your comic. That mysterious charm that launches certain webcomics to fame and fortune can’t be formulated. Hopefully, though, this tutorial will help your webcomic reach the quality and recognition it deserves.
Happy comicking!
Topics: Comic tutorials | 17 Comments »
17 Responses to “How to Make a Web Comic, Part 2 : Drawing and Publishing”
Leave a Reply
 |
 
|
The Weatherly Guide to Drawing Animals |
 
|
Drawing the Head and Figure |
 
|
Cartoon Animation |
 
|
The Art of Animal Drawing |
drawfurry.com © Copyright 2007. No material from this site may be used without express permission.
December 14th, 2009 at 10:24 pm
You should add SmackJeeves to the publishing comic list, it’s quite good for new comic artists, easy to use, free, etc. etc. It stays up a lot too, I think I’ve seen it go down… once or twice, like two years ago.
December 5th, 2009 at 6:23 am
Great post..Keep them coming :) Thanks for sharing.
November 22nd, 2009 at 1:42 pm
Thank you for that wonderful tutorial! I personally found it very helpful and insightful. I will definitely be coming back in the future to reread this and make use of those links.
Thanks for writing and posting this!
<3 graceia
November 5th, 2009 at 2:20 pm
Hey thanks, but I’m a little bit confused about how you post some on blog sites, since I think I’ll get my own blog site before posting my web comic. I want the comic to be there but I don’t know…Can you help me figure it out? thanks.
May 9th, 2009 at 5:22 pm
This has been really helpful, I may actually be starting my own comic here soon, my website is where it will be put up.
May 7th, 2009 at 8:48 am
I would tweak what was said about the Meta tags and encourage people to put at least one full, descriptive sentence in the “description” tag. If Google et al don’t find a nice strip of text with the search terms on the site somewhere, it will see if it can grab something useful from the description tag. So, in Kelly’s example, I’d have at least the name “nymph” in that tag too. The Title tag (not the meta “title” tag) should also be unique per page, if you do like Lackadaisy have a “name” for each page of panels.
And if you DO have much text content (not just a comic laying out there) do use header tags (h1, h2, h3, just like you would in a report paper) to let visitors and googles know the most important chunks of your page (and what’s not so important). Great tut Kelly.
March 21st, 2009 at 12:22 am
oh god thank you, this is really going to help alot