xkcdFavicon.png

Difference between revisions of "Design of xkcd.com"

Explain xkcd: It's 'cause you're dumb.
Jump to: navigation, search
m
m (added a sentence describing the color of the text in the xkcd logo)
 
(9 intermediate revisions by 2 users not shown)
Line 1: Line 1:
[[File:xkcd_website.png|thumb|right|250px|The four segments on [[xkcd|xkcd.com]]]]{{TOC}}The '''design of [[xkcd|xkcd.com]]''' includes four white segments. These segments are separated by a thin black border and a light blue-gray background color. Here is a list of the changes that have been made:
+
[[File:xkcd_website.png|thumb|right|250px|The four segments on [[xkcd|xkcd.com]]]]{{TOC}}The '''design of [https://xkcd.com xkcd.com]''' includes four white segments, which are separated by a thin black border and a light blue-gray background color. All text on the page uses a small caps font, except for the word "xkcd" in the logo image. Here is a list of the changes that have been made:
  
<!--EDITOR NOTE: Below here is only meant to be a list of huge changes to the entire page and only changes that can be documented with a web archive link. Give a date (in the correct format as shown in [[1340: Unique Date]]) of the link first and sort after newest at the top: 2006-07-10
+
The design has changed many times over the years, but mainly in the beginning. Prior to [https://web.archive.org/web/20041024201125/http://68.57.186.221:8080/ October 24, 2004], the website didn't mention the name "xkcd" and didn't include any comics. During that time, the site's message simply stated: "I don't use this page for much. It goes un-updated for a long time, and I don't really change the content, though I'm thinking of putting together a good links page. For now I just mostly use this to host pictures.". Before [https://web.archive.org/web/20051018051614/http://www.xkcd.com:80/ October 18, 2005], the website was redesigned to be used to host xkcd comics. Between [http://web.archive.org/web/20060706040359/http://xkcd.com:80/ July 6, 2006] and [http://web.archive.org/web/20060710090528/http://www.xkcd.com:80/ July 10, 2006], the design of the website changed dramatically to one very similar to the current one.
-->
 
The design has changed many times but mainly in the beginning. This was the first time that a design [http://web.archive.org/web/20060710090528/http://www.xkcd.com/ close to the current] was used. [[126: Red Spiders Cometh]] was up at the time.
 
*2006-02-07 This was [http://web.archive.org/web/20060207154349/http://www.xkcd.com/ how the web site looked] after Randall had closed down for LiveJournal releases the week before on January 30th, 2006 (with the release of [[56: The Cure]]). The link is to the first copy on the web archive after that happened, and it was saved the day after [[60: Super Bowl]] was released.
 
*2006-01-09 This was [http://web.archive.org/web/20060109071222/http://www.xkcd.com/ how the web sited looked] three days after the second comic, [[46: Secrets]], was released simultaneously [[:Category:Posted on LiveJournal after xkcd|on both LiveJournal and xkcd]]. The page was saved on the 9th of January 2006, before that day's comic ([[47: Counter-Red Spiders]]) had been released. Randall had taken a long break from xkcd since and had just begun posting again on both sites from January 4th, 2006, with [[45: Schrodinger]]. The 41 comics released earlier throughout 2005 was at that time all included on the xkcd page as if they had been inserted on New Years Day (2006-01-01). Thus disregarding that, they had almost only been released using the still going Monday, Wednesday, Friday schedule from September 30th 2005, with the first being [[7: Girl sleeping (Sketch -- 11th grade Spanish class)|7: Girl sleeping]] and the last being [[39: Bowl]] released on December 5th 2005. Thus, he took 30 days without a release from there and had released. And as would be clear he also disregarded the order as the first is now [[1: Barrel - Part 1]] (which was though released the same day as the Girl, but still only as number 3), and the last number of those 41 comics is now [[44: Love]], which thus also shows that three other comics have been inserted among the first 44 to make the first xkcd release number 45.
 
  
 
==Links==
 
==Links==
Line 25: Line 21:
 
==Header==
 
==Header==
 
[[File:xkcd_header.png|right|150px]]
 
[[File:xkcd_header.png|right|150px]]
The second segment is the header, which contains the logo, the [[Tagline|tagline]], and the [[Header text|header text]]. The header is wider than the first segment but has the same height. The xkcd logo is positioned on the upper left corner and serves as a clickable link to the front page.
+
The second segment is the header, which contains the logo, the [[Tagline|tagline]], and the [[Header text|header text]]. The header is wider than the first segment but has the same height. The xkcd logo is positioned on the upper left corner and serves as a clickable link to the front page. The image used in the logo of xkcd is from the first panel of [[77: Bored with the Internet]], showing only the characters and the chair and the desk with a now old fashioned computer screen. The color of the text in the logo is a shade of grey/gray(spelling varies with location), with a hex value of #6e7b91, and an rgba value of (110,123,145,255).
  
 
===Tagline===
 
===Tagline===
 
:''For more information, visit the [[Tagline|main article]].''
 
:''For more information, visit the [[Tagline|main article]].''
 +
 
Next to the logo is the tagline, a short text that appears regardless of which comic is being viewed. There have been eight taglines displayed over the course of the site's history, with the current one being added in 2006. It states:
 
Next to the logo is the tagline, a short text that appears regardless of which comic is being viewed. There have been eight taglines displayed over the course of the site's history, with the current one being added in 2006. It states:
  
Line 35: Line 32:
 
===Header text===
 
===Header text===
 
:''For more information, visit the [[Header text|main article]].''
 
:''For more information, visit the [[Header text|main article]].''
 +
 
The header text is updated whenever Randall has news to share. After the novelty of the news ends, the page usually goes back to its default header text, which states:
 
The header text is updated whenever Randall has news to share. After the novelty of the news ends, the page usually goes back to its default header text, which states:
  
Line 41: Line 39:
 
==Comic==
 
==Comic==
 
[[File:xkcd_comic.png|right|150px]]
 
[[File:xkcd_comic.png|right|150px]]
 +
This section of the website is dedicated to displaying comics. Positioned above the comic is the title, presented in large and bold lettering. Just below the title, but above the primary comic image,  there are five buttons. They follow a fairly standard layout: on the outer edges are the <li style="background-color: #6E7B91; border: 1.5px solid #333333; border-radius: 3px 3px 3px 3px; box-shadow: 0 0 5px 0 gray; display: inline; font-size: 11px; font-variant: small-caps; font-weight: 600; margin: 0 4px; padding: 1.5px 0;"><span style="color: #FFFFFF; padding: 0 12px;">|<</span></li> and <li style="background-color: #6E7B91; border: 1.5px solid #333333; border-radius: 3px 3px 3px 3px; box-shadow: 0 0 5px 0 gray; display: inline; font-size: 12px; font-variant: small-caps; font-weight: 600; margin: 0 4px; padding: 1.5px 0;"><span style="color: #FFFFFF; padding: 0 11px;">>|</span></li> arrows, which transport the user to the first or most recent comic accordingly. Adjacent to these are the <li style="background-color: #6E7B91; border: 1.5px solid #333333; border-radius: 3px 3px 3px 3px; box-shadow: 0 0 5px 0 gray; display: inline; font-size: 12px; font-variant: small-caps; font-weight: 600; margin: 0 4px; padding: 1.5px 0;"><span style="color: #FFFFFF; padding: 0 11px;"><&nbsp;Prev</span></li> and <li style="background-color: #6E7B91; border: 1.5px solid #333333; border-radius: 3px 3px 3px 3px; box-shadow: 0 0 5px 0 gray; display: inline; font-size: 12px; font-variant: small-caps; font-weight: 600; margin: 0 4px; padding: 1.5px 0;"><span style="color: #FFFFFF; padding: 0 11px;">Next&nbsp;></span></li> buttons, allowing navigation between the comics immediately before and after the currently displayed one. In instances where the displayed comic is the first or the last, attempting to access the previous or next comic will simply result in the page being reloaded. At the center there is a <li style="background-color: #6E7B91; border: 1.5px solid #333333; border-radius: 3px 3px 3px 3px; box-shadow: 0 0 5px 0 gray; display: inline; font-size: 12px; font-variant: small-caps; font-weight: 600; margin: 0 4px; padding: 1.5px 0;"><span style="color: #FFFFFF; padding: 0 11px;">Random</span></li> button, which, when clicked, loads a comic at random. The same set of buttons is duplicated below the comic as well. While this redundancy isn't needed in most comics, it ensures that the buttons are conveniently accessible both before and after scrolling, especially for [[:Category:Large drawings|large comics]].
  
This is the main segment where the comics are. On the front page, the newest comic will always be displayed. This is therefore changing, typically three times a week, but these changes are not considered a change to the front-page design. This segment is as broad as the two above together and as broad as the one below it has a rectangular shape most of the time but shapes itself after the [[482: Height|height]] of the comic. So, it can be very short [https://www.xkcd.com/1123/ like here] [[1123: The Universal Label]] and very long for instances [https://www.xkcd.com/1732/ like here] with [[1732: Earth Temperature Timeline]].
+
Finally, beneath this second row of buttons, two links are provided. The first functions as a permalink, directly linking to the comic currently displayed on the page. In some cases, custom permalinks are used for various versions of the same comic, such as in some of the [[:Category:Interactive comics|interactive comics]] like [[1350: Lorenz]] and [[1663: Garden]]. The structure of this link consists solely of the [https://xkcd.com xkcd.com] domain followed by the respective comic number. For instance, the link for comic [[2000: xkcd Phone 2000]] would appear as: "https://www.xkcd.com/2000/". The second link leads to the image URL suitable for hotlinking or embedding, in this case "https://imgs.xkcd.com/comics/xkcd_phone_2000.png". This link is stored within a comics-specific logical subdirectory of the server. The filenames of these images typically align with the comic titles, although exceptions arise, particularly in cases of [[:Category:Comics sharing name|title conflicts]] or when the visible comic is dynamically generated or a composite rendering.
  
*This is where the comics are displayed.
+
:Permanent link to this comic: https://xkcd.com/2000/
**Above the comic is the title, in large bold letters.
+
:Image URL (for hotlinking/embedding): https://imgs.xkcd.com/comics/xkcd_phone_2000.png
***As always Randall uses a small caps font. By copying text to another program without preserving the font format, it shows both capital and lowercase characters.
 
**Below the title and above the main comic image there is a row of buttons. These are fairly standard:
 
***The two outermost "to the limit" arrows, <nowiki>|<</nowiki> or <nowiki>>|</nowiki>, take the user to either the very first or the most recent comic.
 
***Next to those are the ''< Previous'' and the ''Next >'' buttons, taking the user to the two adjacent comics to the one currently displayed.
 
***In the middle is the ''Random'' button comic which chooses a random comic.
 
****If the user is on the main page, the two rightwards-pointing buttons will not do anything as there are no newer comics than the one displayed already.
 
****Similarly, explicitly visiting the first or latest comics removes the utility of the respective directional choices.
 
**These buttons are repeated below the comic. For smaller comics this is not so relevant, but for taller comics this ensures the buttons are at hand both before and after any scrolling down that may have heen required.
 
**Finally, beneath the second row of bottoms there are two links.
 
***The first is a permalink to the current comic displayed on the page.
 
***Permalink is also used in some of xkcd's interactive comics see the [[1350:_Lorenz#Permalink|permalink section]] on [[1350: Lorenz]].
 
***The link is just<!--check for exceptions? --> the xkcd server address with the number of the comic. So, for the comic [[1791: Telescopes: Refractor vs Reflector]], the link would just be:
 
****https://www.xkcd.com/1791/
 
***The other link is:
 
****The image URL (for hotlinking/embedding):
 
****http://imgs.xkcd.com/comics/telescopes_refractor_vs_reflector.png  
 
***Here the link is also on xkcd, but indicates that it is stored within a comics-specific logical subdirectory of the server, with individual filenames often in line with the comic title (though there are exceptions, especially where title clashes occur or the visible comic is actually a dynamic/composite rendering) plus the extension for the image-type, which is often .png but may be .gif or otherwise in some instances.
 
  
 
==Bottom segment==
 
==Bottom segment==
Line 69: Line 51:
 
=== Footer comics ===
 
=== Footer comics ===
 
:''For more information, visit the [[Footer comics|main article]].''
 
:''For more information, visit the [[Footer comics|main article]].''
 +
 
The footer comics are likely selected for representing the topics covered on xkcd. There have been five changes to the footer comics over the course of the site's history, with the last one being added in 2019. They are:
 
The footer comics are likely selected for representing the topics covered on xkcd. There have been five changes to the footer comics over the course of the site's history, with the last one being added in 2019. They are:
  
:[[150: Grownups]] | [[730: Circuit Diagram]] | [[162: Angular Momentum]] | [[688: Self-Description]] | [[556: Alternative Energy Revolution]]
+
{| class="wikitable"
:[[1732: Earth Temperature Timeline]]
+
|+
 +
|[[150: Grownups]]
 +
|[[730: Circuit Diagram]]
 +
|[[162: Angular Momentum]]
 +
|[[688: Self-Description]]
 +
|[[556: Alternative Energy Revolution]]
 +
|-
 +
|colspan="5" style="text-align:center;"| [[1732: Earth Temperature Timeline]]
 +
|}
  
 
===Feeds===
 
===Feeds===
Line 81: Line 72:
 
===Comics I enjoy===
 
===Comics I enjoy===
 
Beneath the two feeds there is a list of Randall's favorite webcomics with links:
 
Beneath the two feeds there is a list of Randall's favorite webcomics with links:
 +
 
:Comics I enjoy:
 
:Comics I enjoy:
 
:[http://threewordphrase.com/ Three Word Phrase]
 
:[http://threewordphrase.com/ Three Word Phrase]
Line 95: Line 87:
  
 
===Other things===
 
===Other things===
 +
Beneath the "Comics I enjoy" section, there is another section of links to external sites. Since [https://web.archive.org/web/20190226192426/https://xkcd.com/ February 26, 2019] there have been three links. They are:
 +
 
:Other things:
 
:Other things:
 
:[https://medium.com/civic-tech-thoughts-from-joshdata/so-you-want-to-reform-democracy-7f3b1ef10597 Tips on technology and government],
 
:[https://medium.com/civic-tech-thoughts-from-joshdata/so-you-want-to-reform-democracy-7f3b1ef10597 Tips on technology and government],
 
:[https://www.nytimes.com/interactive/2017/climate/what-is-climate-change.html Climate FAQ], [https://twitter.com/KHayhoe Katharine Hayhoe]
 
:[https://www.nytimes.com/interactive/2017/climate/what-is-climate-change.html Climate FAQ], [https://twitter.com/KHayhoe Katharine Hayhoe]
  
*Beneath the web comic links is another section of external writings.
+
On [http://web.archive.org/web/20170321030609/https://xkcd.com/ March 21, 2017], this section was added to [https://xkcd.com xkcd.com] for the first time. It stated:
*Since [http://web.archive.org/web/20190226192426/https://xkcd.com/ 2019-02-26] there have been three links under the text "Other things:"
+
 
**[https://medium.com/civic-tech-thoughts-from-joshdata/so-you-want-to-reform-democracy-7f3b1ef10597 Tips on technology and government]
+
:[http://womenalsoknowstuff.com/ Women Also Know Stuff], [https://techsolidarity.org/ Tech Solidarity]
**[https://www.nytimes.com/interactive/2017/climate/what-is-climate-change.html Climate FAQ]
+
 
**[https://twitter.com/KHayhoe Katharine Hayhoe]
+
On [http://web.archive.org/web/20170715021703/https://xkcd.com/ July 15, 2017], the third link was added:
***The two bottom links replaced the two original links from when this section began.
+
:Other things:
*On [http://web.archive.org/web/20170715021703/https://xkcd.com/ 2017-07-15] a third link was added to the two original:
+
:[http://womenalsoknowstuff.com/ Women Also Know Stuff], [https://techsolidarity.org/ Tech Solidarity], [https://medium.com/civic-tech-thoughts-from-joshdata/so-you-want-to-reform-democracy-7f3b1ef10597 Tips on technology and government]
**[http://womenalsoknowstuff.com/ Women Also Know Stuff]
 
**[https://techsolidarity.org/ Tech Solidarity]
 
**[https://medium.com/civic-tech-thoughts-from-joshdata/so-you-want-to-reform-democracy-7f3b1ef10597 Tips on technology and government]
 
***The two original links was removed in favor of two other links after [http://web.archive.org/web/20190225185416/https://xkcd.com/ 2019-02-25].
 
***The new link then moved to the top.
 
*On [http://web.archive.org/web/20170321030609/https://xkcd.com/ 2017-03-21] this section became part of xkcd with two links:
 
**[http://womenalsoknowstuff.com/ Women Also Know Stuff]
 
**[https://techsolidarity.org/ Tech Solidarity]
 
***There where only two links until [http://web.archive.org/web/20170714015753/https://xkcd.com/ 2017-07-14]. The day after a third link was added.
 
*Up until [http://web.archive.org/web/20170320025830/https://xkcd.com/ 2017-03-20] this section was not a part of the xkcd design.
 
  
 
===Warning===
 
===Warning===
 
:''For more information, visit the [[Warning|main article]].''
 
:''For more information, visit the [[Warning|main article]].''
 +
 
The warning on xkcd was originally added to the site in 2006, but it was removed in 2016. It stated:
 
The warning on xkcd was originally added to the site in 2006, but it was removed in 2016. It stated:
  
Line 150: Line 135:
 
:That is, you don't need my permission to post these pictures on your website (and hotlinking with <img> is fine); just include a link back to this page. Or you can make Livejournal icons from them, but -- if possible -- put xkcd.com in the comment field. You can use them freely (with some kind of link) in not-for-profit publications, and I'm also okay with people reprinting occasional comics (with clear attribution) in publications like books, blogs, newsletters, and presentations. If you're not sure whether your use is noncommercial, feel free to [mailto:[email protected] email me] and ask (if you're not sure, it's probably okay).
 
:That is, you don't need my permission to post these pictures on your website (and hotlinking with <img> is fine); just include a link back to this page. Or you can make Livejournal icons from them, but -- if possible -- put xkcd.com in the comment field. You can use them freely (with some kind of link) in not-for-profit publications, and I'm also okay with people reprinting occasional comics (with clear attribution) in publications like books, blogs, newsletters, and presentations. If you're not sure whether your use is noncommercial, feel free to [mailto:[email protected] email me] and ask (if you're not sure, it's probably okay).
  
[[Category:Design of xkcd.com|A]]
+
[[Category:Design of xkcd.com| 1]]
 
{{xkcdmeta}}
 
{{xkcdmeta}}

Latest revision as of 03:02, 19 January 2024

The four segments on xkcd.com

The design of xkcd.com includes four white segments, which are separated by a thin black border and a light blue-gray background color. All text on the page uses a small caps font, except for the word "xkcd" in the logo image. Here is a list of the changes that have been made:

The design has changed many times over the years, but mainly in the beginning. Prior to October 24, 2004, the website didn't mention the name "xkcd" and didn't include any comics. During that time, the site's message simply stated: "I don't use this page for much. It goes un-updated for a long time, and I don't really change the content, though I'm thinking of putting together a good links page. For now I just mostly use this to host pictures.". Before October 18, 2005, the website was redesigned to be used to host xkcd comics. Between July 6, 2006 and July 10, 2006, the design of the website changed dramatically to one very similar to the current one.

Links[edit]

xkcd links.png
For more information, visit the main article.

The first segment is at the top left of the page, and it contains links to navigate around on xkcd.com and his social accounts. There have been multiple changes to the links over the course of the site's history, with the last one being made in 2023. It states:

Archive
What If?
About
FeedEmail
TWFBIG
-Books-
What If? 2
WI?TEHT

Header[edit]

xkcd header.png

The second segment is the header, which contains the logo, the tagline, and the header text. The header is wider than the first segment but has the same height. The xkcd logo is positioned on the upper left corner and serves as a clickable link to the front page. The image used in the logo of xkcd is from the first panel of 77: Bored with the Internet, showing only the characters and the chair and the desk with a now old fashioned computer screen. The color of the text in the logo is a shade of grey/gray(spelling varies with location), with a hex value of #6e7b91, and an rgba value of (110,123,145,255).

Tagline[edit]

For more information, visit the main article.

Next to the logo is the tagline, a short text that appears regardless of which comic is being viewed. There have been eight taglines displayed over the course of the site's history, with the current one being added in 2006. It states:

A webcomic of romance, sarcasm, math, and language.

Header text[edit]

For more information, visit the main article.

The header text is updated whenever Randall has news to share. After the novelty of the news ends, the page usually goes back to its default header text, which states:

xkcd updates every Monday, Wednesday, and Friday.

Comic[edit]

xkcd comic.png
This section of the website is dedicated to displaying comics. Positioned above the comic is the title, presented in large and bold lettering. Just below the title, but above the primary comic image, there are five buttons. They follow a fairly standard layout: on the outer edges are the
  • |<
  • and
  • >|
  • arrows, which transport the user to the first or most recent comic accordingly. Adjacent to these are the
  • < Prev
  • and
  • Next >
  • buttons, allowing navigation between the comics immediately before and after the currently displayed one. In instances where the displayed comic is the first or the last, attempting to access the previous or next comic will simply result in the page being reloaded. At the center there is a
  • Random
  • button, which, when clicked, loads a comic at random. The same set of buttons is duplicated below the comic as well. While this redundancy isn't needed in most comics, it ensures that the buttons are conveniently accessible both before and after scrolling, especially for large comics.

    Finally, beneath this second row of buttons, two links are provided. The first functions as a permalink, directly linking to the comic currently displayed on the page. In some cases, custom permalinks are used for various versions of the same comic, such as in some of the interactive comics like 1350: Lorenz and 1663: Garden. The structure of this link consists solely of the xkcd.com domain followed by the respective comic number. For instance, the link for comic 2000: xkcd Phone 2000 would appear as: "https://www.xkcd.com/2000/". The second link leads to the image URL suitable for hotlinking or embedding, in this case "https://imgs.xkcd.com/comics/xkcd_phone_2000.png". This link is stored within a comics-specific logical subdirectory of the server. The filenames of these images typically align with the comic titles, although exceptions arise, particularly in cases of title conflicts or when the visible comic is dynamically generated or a composite rendering.

    Permanent link to this comic: https://xkcd.com/2000/
    Image URL (for hotlinking/embedding): https://imgs.xkcd.com/comics/xkcd_phone_2000.png

    Bottom segment[edit]

    xkcd bottom.png

    Footer comics[edit]

    For more information, visit the main article.

    The footer comics are likely selected for representing the topics covered on xkcd. There have been five changes to the footer comics over the course of the site's history, with the last one being added in 2019. They are:

    150: Grownups 730: Circuit Diagram 162: Angular Momentum 688: Self-Description 556: Alternative Energy Revolution
    1732: Earth Temperature Timeline

    Feeds[edit]

    Below the footer comics, there are three feeds links. These links consist of a RSS feed, an Atom feed, and, starting from February 6, 2019, a subscription link for receiving news via email. On June 11, 2019, the last two links were also added to the links at the top for easier access. They are:

    RSS Feed - Atom Feed - Email

    Comics I enjoy[edit]

    Beneath the two feeds there is a list of Randall's favorite webcomics with links:

    Comics I enjoy:
    Three Word Phrase
    SMBC,
    Dinosaur Comics,
    Oglaf (nsfw),
    A Softer World,
    Buttersafe,
    Perry Bible Fellowship,
    Questionable Content,
    Buttercup Festival,
    Homestuck,
    Junior Scientist Power Hour

    Other things[edit]

    Beneath the "Comics I enjoy" section, there is another section of links to external sites. Since February 26, 2019 there have been three links. They are:

    Other things:
    Tips on technology and government,
    Climate FAQ, Katharine Hayhoe

    On March 21, 2017, this section was added to xkcd.com for the first time. It stated:

    Women Also Know Stuff, Tech Solidarity

    On July 15, 2017, the third link was added:

    Other things:
    Women Also Know Stuff, Tech Solidarity, Tips on technology and government

    Warning[edit]

    For more information, visit the main article.

    The warning on xkcd was originally added to the site in 2006, but it was removed in 2016. It stated:

    Warning: this comic occasionally contains strong language (which may be unsuitable for children), unusual humor (which may be unsuitable for adults), and advanced mathematics (which may be unsuitable for liberal-arts majors).

    Footnote[edit]

    For more information, visit the main article.

    The footnote on xkcd is written in a very tiny font, which makes it very hard to read without zooming in. There have been two major footnotes displayed over the course of the site's history, with the current one being added in 2016. It states:

    xkcd.com is best viewed with Netscape Navigator 4.0 or below on a Pentium 3±1 emulated in Javascript on an Apple IIGS
    at a screen resolution of 1024x1. Please enable your ad blockers, disable high-heat drying, and remove your device
    from Airplane Mode and set it to Boat Mode. For security reasons, please leave caps lock on while browsing.

    License and copyright[edit]

    Randall allows people to use his comics for free as long as they do not make money on them and as long as they credit him with the work. There are two notes:

    This work is licensed under a Creative Commons Attribution-NonCommercial 2.5 License.
    This means you're free to copy and share these comics (but not to sell them). More details.

    "More details" is a link to xkcd.com/license.html, which expands on what people are and are not allowed to do. It states:

    This work is licensed under a Creative Commons Attribution-NonCommercial 2.5 License.
    This means that you are free to copy and reuse any of my drawings (noncommercially) as long as you tell people where they're from.
    That is, you don't need my permission to post these pictures on your website (and hotlinking with <img> is fine); just include a link back to this page. Or you can make Livejournal icons from them, but -- if possible -- put xkcd.com in the comment field. You can use them freely (with some kind of link) in not-for-profit publications, and I'm also okay with people reprinting occasional comics (with clear attribution) in publications like books, blogs, newsletters, and presentations. If you're not sure whether your use is noncommercial, feel free to email me and ask (if you're not sure, it's probably okay).