Rules and details can be found in the Xyliatales forum.

Here is what you need to design for as you go about creating your webcomic website:

1: TITLE

Preferably, this should be a graphic. Comics, whether on the web or not, are a graphical medium! A text title shouts “I’m boring and too lazy or inexperienced to make my own logo!”  While I may often use title graphic and logo synonymously, I should point out that they are NOT always the same thing. You can have your logo on TOP of a title graphic.  Your logo is either your comic’s title, with or without an accompanying image that is recognizable at large and small sizes, or a symbol that stands for your comc title. For example, Xyliatales, Wayfarer’s Moon, and No Need for Bushido. Your title graphic or banner may include that as WELL as more graphics.  For example in increasing size/complexity, Gunnerkrigg Court, Galaxion, Calling Home, LadyStar.

Well, how large or small should your title be? I’m not much keen on taking sides in the text vs. graphics web battles, especially since the internet is so bloody fast nowadays. Good webdesign puts the focus on where it needs to be (in this case, your comic) while ALSO focusing on fast loading and solid aesthetics, but at the same, as comic creators, we know we need to brand the site.  I usually see SMALL title/logo graphics when people want to have above the fold ad space. I usually see LARGE graphics when ads are not part of the site.  I see small graphics on image-lite sites with the “validated” text at the bottom. I see large graphics on sites made by beginners who haven’t yet learned how to get large impact out of a small area.  The bottom line: your title or logo needs to be LARGE enough it will be seen and recognized by new visitors, and small enough that more important content is readily visible without a scroll.

2: SITE NAVIGATION MENU

I’m going to make a quick distinction here between SITE navigation, and ARCHIVE navigation, so no one gets lost. Site navigation is your links to other webpages. Archive navigation deals only with the comics.  Either directly beside your title or underneath it, you need to have your site navigation menu. This menu can be horizontal or vertical, but it definitely must be above the fold, and given priority over other content (the comic, the comic navigation, buttons, other non-essential images). Your “Home” button/link needs to be FIRST in the list even if you are ordering the rest of the list alphabetically. All other page links should appear either in order of importance or alphabetically. I prefer to order buttons in order of importance, or really, which pages a new visitor would want to visit first: “Home, Archive, Cast …….. Links, About.” I have “about” as last because generally that link is always last, and that is where I am accustomed to seeing it.  Buttons/links on either end of the menu get seen more, which is generally how it works. Between cast and links is where my other pages go.

3: COMIC NAVIGATION MENU

I’m going to say this now: first, I already wrote an article on the necessity of having the FULL comic navigation menu, below AND above the comic if your comic extends below the fold. Second, I HATE ComicPress’ design of having comic navigation in the SITE navigation menu. It’s disorienting, and it means you most often DON’T have the 4 necessary links (first/prev/next/last) because there’s not enough room for all that crammed into your site menu.  I GUESS I understand the reasoning why it’s there (“navigation is navigation, right?” Wrong.), but they are two very separate systems! If you have CP and you have your comic navigation in the default place and you don’t have all four links, I strongly encourage you to change that!

Your comic navigation menu needs to be made using recognizable symbols, fonts and/or text titles. Don’t name these links as something inane and silly that only you understand! For example, a mega fail: “Baby Food, Granola Bars, Garbage Plate, Coronary.” As always, title things exactly what they are. Either first/beginning/start/etc; previous/prev/back/before/etc; next/tomorrow/after/etc; last/today/etc, or the appropriate symbols of double arrows and single arrows. Both together are good too.

4: YOUR COMIC

Please notice that your comic is FOURTH on this list. Not first, not second, not third. Your title and all navigation should appear above and/or left of your comic. However, as much as possible of your comic should appear above the fold. If your comic is on your front page and not immediately visible in a 1024×768  browser, you need to redesign your site, because you are only wasting room.  If your comic does not appear on the front page, then the links to the first page and most recent page must have prominence.

5a: BOTTOM COMIC NAVIGATION

(see section 3)

5b: NEWS/BLOG

It is very important that your blog or news area does NOT take precedence over your comic other more imporant comic elements.  There are ways to get around this using sidebars, twitter, or not blogging at all, but the safest place to have your blurbs is right below the comic AND bottom comic navigation. It is very annoying for some people to have to scroll through your news to find the “next” button/link, so don’t do that.  I already wrote an article about what should be posted here and when, so I’m not going to repeat myself.

6: FOOTER

Your footer is very important. It should not only contain a copyright block (copyright should also appear on your comic images), but also redundant “contact” information and other links of choice (for example, privacy policies).  It makes me very sad when I come to comic site that has no copyright block anywhere.  You may automatically own that copyright, but people online are thieving idiots. It’s best to explicitly and clearly state that “this”  is yours, and how to get in contact with you if people want to copy, use or redistribute. It won’t stop thieves from doing it anyways, but you do what you can.

————-

The above are my personal BARE MINIMUM recommended elements. Obviously, there is more you can include, but I do NOT recommend less.  Lastly, don’t forget to add alts and titles to your links and images! Webcomic sites OUGHT to be graphic-centered, in my opinion, but that means you need to do a little more to make your sites appear in search engines.

Next Up: Webcomic Website Review

First! CMS stands for Content Management System. “Content” for this means your comic and the news or notes or extra webpages which accompany it. “Management” as in, able to handle large amounts of information in the way a manager handles all the people who work under him or her.  A “system” implies something a bit…automatic. Like automatic drive on your car, this is a good thing for people who want it easy.  So, easy comic handling. No hand-coding of archives! GOOD THING. This also forces you to display your comic in way in which readers are accustomed! Yes, there are some precedents for webcomic display, and that includes NOT displaying 20 comic pages on ONE webpage, or having one 1 navigation button for the “next” comic, etc. Don’t make me pull my hair out when I’m trying to read your wonderful comic, basically!

An example of a CMS is this blog. The CMS is Wordpress, which uses something called a “mySQL” database to work. I don’t edit that database when I add a post, I don’t code it or screw with it or even know how the hell it works. It is a magical thing to me, and I’m happy that I don’t have to mess with it.  All I did was create it by giving it a name and a password in my host’s admin panel.  Not all CMS use databases. In this article, I’m going to tell you about all of the CMS that I know of that you can use for your webcomic.

Before I get into this, I just want to say that I will not be touching on CMS systems of free webcomic hosts. I’m going to save that for the reviews OF those hosts.  This article is more for people who host themselves, but don’t have a system in place yet to manage their webcomic.

I’m going to start with a popular choice: Wordpress/Comicpress. Wordpress is your CMS, and Comicpress is your theme that specializes the CMS for your webcomic. Comicpress works much easier with the CP manager plug-in (an extra little bit of specialized automation for your wordpress blog).  Two examples of WP/CP sites in action are Tales from the Middle Kingdom and Xyliatales.

Pros: WP/CP is constantly upgraded freeware, and each version is better than the last. There are 5 default templates available for every type of comic. You get perma-links (more search-friendly URLs), RSS, comic news and extra blog news. You get to use PHP, a very useful type of coding. CP 2.7 also has a bunch of handy new features, including archiving by storyline, comic hover text, and comic transcripts.  You can upload your comics though an online admin interface (obviously accessible from any computer, just in case any supernoobs were reading this), write your comic blurbs online, etc. Has a commenting (and moderation) system, and the ability to schedule pages for future days!

Cons: WP/CP is NOT  user-friendly if you don’t know what you’re doing in the code, especially if you want to personalize your site. WP requires a database, which can get corrupted, and furthermore, you have to have top-level admin access on your host panel to even make a database.  WP also can severely tax your host, so you either need to not be a huge comic, or install WP-super-cache plug-in.   Finally, because WP/CP are constantly being upgraded, YOU have to keep upgrading your site, which is extremely annoying.

Bottom line: Recommended for advanced users only, or those interested in becoming that. For more about WP/CP, go read a 2-part interview I gave at The Floating Lightbulb.

Next, an alternative to WP/CP for less-advanced coders called Inkblot. Like CP, Inkblot works with Wordpress, so you still have to go about creating a mySQL database.  In this case, Inkblot is the theme, and WebComic is the  name of the plug-in.  I have not used this CMS, but example of a WP/IB site in action is The Adventures of  Wiglaf and Mordred.

Pros: Much easier to use than WP/CP, and with the great majority of functionality (more in some cases!). Instead of dealing with code, a lot of the time you only deal with settings, and anyone who can fill out paperwork can change “settings.”  This is Kez’s way of saying IT’S NOT AS HARD AS YOU THINK. Also, has a commenting (and moderation) functionality! For more, check out  this handy-dandy comparison list of CP vs. IB, though I don’t think it’s been updated for CP 2.7.  Correct me if I’m wrong, Mike!

Cons: Still requires a database, upgrading, installation, and perhaps, the cache plug-in described in WP/CP’s cons.

Bottom line: recommended as an excellent alternative to CP. I’m told once you use IB, you don’t go back

The next CMS up for bat is SomeryC. Unlike the previous 2 examples, SomeryC does not require a database. I swear the version I first used of this did not. It appears the newest version DOES need a database. M’bad! Sorry about that.  Unlike WP/CP or WP/IB, SomeryC ONLY handles your comic—not extra webpages, or sidebars or any other aspect of the site EXCEPT for archiving your webcomic. An example of a site using SomeryC is Crowfeathers.

Pros: extremely easy to install.  A convenient “tag” system for comic placement, navigation buttons, news, etc. For those of you who don’t know, tags are pieces of code that stand for more complex code functions. Instead of dealing with a huge string of incomprehenisble garble, you deal with something more like “put comic here.” SomeryC also leaves site design up to you. For some people, not dealing with default templates is a HUGE pro.  Even though you don’t have a database, you still have an online interface for adding comics and news.

Cons: previously SomeryC sites have been hacked, and I’m unsure if new, more secure versions have been released.  Other than that, some people may find that not having a system that deals with ALL aspects of the site a major con. I personally like a little bit of manual control every now and again.

Bottom line: recommended for people who don’t like Wordpress and for people not comfortable outside of HTML/CSS.  Also recommended for people who (like me) like to sometimes hand-code things themselves.

Next, a CMS with all of WP’s functionality, but with far less hassle, Movable Type! An example of a site using MT is busybee comics.

Pros: Since I’ve never used MT, I’m going to draw straight from an interview given by fluffy, creator of busybee comics.  First, and this is a huge pro, MT can run multiple comics from a single admin panel on ONE site. It’s easier to use AND install than WP, doesn’t rely on PHP (for those who fear it), and has better security. You don’t often hear about MT sites getting hacked, unlike WP sites.  Has commenting ability!

Cons: Again, may require a database depending on what functions you want to use, and definitely requires CGI capability (this latter bit isn’t a con so much as something you need to be aware of).  MT also has its own markup language apparently, so there are somethings you’d need to learn.

Bottom line: for both advanced and beginner coders.  Since I only know of one site that uses this for webcomics, I don’t really have much to say on it though. It exists! So try it and let me know what you think.

Part II will be a short article dealing with Comikaze, i-strip,  Blogspot/other free blogs, and any other system I may be vaguely familiar with people may mention in comments.  I’m far more familiar with systems offered by free webcomic hosts, but even if I don’t know as much about all of these as I would like, I think it’s still important people know about them!