Editing Design of xkcd.com
Warning: You are not logged in. Your IP address will be publicly visible if you make any edits. If you log in or create an account, your edits will be attributed to your username, along with other benefits.
The edit can be undone.
Please check the comparison below to verify that this is what you want to do, and then save the changes below to finish undoing the edit.
Latest revision | Your text | ||
Line 1: | Line 1: | ||
− | [[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 | + | [[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. 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: |
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 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. | ||
Line 39: | Line 39: | ||
==Comic== | ==Comic== | ||
[[File:xkcd_comic.png|right|150px]] | [[File:xkcd_comic.png|right|150px]] | ||
− | |||
− | + | 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]]. | |
− | : | + | *This is where the comics are displayed. |
− | : | + | **Above the comic is the title, in large bold letters. |
+ | ***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== |