explain xkcd - User contributions [en]

2730: Code Lifespan

2023-01-27T14:06:00Z

Noëlle: /* Transcript */

{{comic
| number = 2730
| date = January 27, 2023
| title = Code Lifespan
| image = code_lifespan_2x.png
| imagesize = 377x307px
| noexpand = true
| titletext = Surely (no one/everyone) will (recognize how flexible and useful this architecture is/spend a huge amount of effort painstakingly preserving and updating this garbage I wrote in 20 minutes)
}}

==Explanation==
{{incomplete|Created by a BOT - Please change this comment when editing this page. Do NOT delete this tag too soon.}}

==Transcript==
{{incomplete transcript|Do NOT delete this tag too soon.}}

[Two situations are depicted between Ponytail and Cueball.]

[Situation 1:]

Ponytail: It took some extra work to build, but now we'll be able to use it for all our future projects.

Caption below the panel: How to ensure your code is never reused

[Situation 2:]

Ponytail: Let's not overthink it; if this code is still in use '''''that''''' far in the future, we'll have bigger problems.

Caption below the panel: How to ensure your code lives forever

{{comic discussion}}

2721: Euler Diagrams

2023-01-06T23:50:54Z

Noëlle: /* Explanation */ "Euler" takes "an", since it's not pronounced with a "Y" sound at the front like the spelling might suggest

{{comic
| number = 2721
| date = January 6, 2023
| title = Euler Diagrams
| image = euler_diagrams_2x.png
| imagesize = 370x409px
| noexpand = true
| titletext = Things Leonhard Euler created ( most of math ( overlapping circle diagrams ) a cricket bowling machine ) Things John Venn created
}}

==Explanation==
{{incomplete|Created by JOHN EULER AND LEONHARD VENN - Please change this comment when editing this page. Do NOT delete this tag too soon.}}

In this comic, [[Cueball]] is showing an off-screen person a {{w|Venn diagram}} he made about something. The off-screen person then informs Cueball that it is in fact an {{W|Euler diagram}}, not a Venn diagram. Cueball then proceeds to complain that many things are named for {{w|Leonhard Euler}} (specifically {{w|Euler's constant}} and {{w|Euler's function}}) and and wants to call the diagram a Venn diagram to give {{w|John Venn}} more credit. His off-screen friend refuses, and mockingly states that numbers are now called "Euler letters", which is currently false.{{citation needed}}

A Venn diagram is "a widely used diagram style that shows the logical relation between sets". It shows overlap of items in different categories (sets) by using overlapping circles (or other shapes) to stand in for categories. If an item is within a certain circle, it is in the category the circle represents. So in a Venn diagram of "animals" and "fuzzy things", cat would be in the overlap between both circles, frog would be inside only "animals", and "kiwifruit would only be in "fuzzy things". "Trees" would be outside both circles. In a Venn diagram, all 'circles' must overlap with all other circles, even if there are no items in the overlap. This is easy enough for 2 and 3 sets, but as the number of sets increases the diagrams can get [https://www.newscientist.com/article/dn22159-logic-blooms-with-new-11-set-venn-diagram/ rather complicated], and the sets can start looking very non-circular. An Euler diagram only depicts the non-empty combinations, and therefore does not have this constraint.

[[File:Euler Diagrams title text.png|300px|thumb|right|The title text as a Venn diagram]]
The title text is an example of a "written" Venn diagram, with Leonhard Euler creating "most of math", John Venn creating a {{w|cricket}} bowling machine, and both of them having created overlapping circle diagrams.

==Transcript==
{{incomplete transcript|Do NOT delete this tag too soon.}}<br>
:[Cueball is standing in front of a whiteboard with his palms raised. The text "Venn Diagram of" is visible in large letters, with "of" on the next line and slightly smaller. Below this are two squiggly lines representing illegible text, followed by three partially overlapping circles with a number of squiggly lines in them.] 
:Friend (offscreen): Actually, that's an ''Euler'' diagram, because-
:Cueball: Come '''''onnnn.'''''
:Cueball: '''''Everything''''' is named after Euler. Euler's constant, Euler's function.
:Cueball: Can't we let John Venn have this?
:Friend (offscreen): No.
:Friend (offscreen): Also, numbers are now "Euler letters."

{{comic discussion}}
[[Category:Comics featuring Cueball]]
[[Category:Math]]
[[Category:Euler diagrams]]
[[Category:Venn diagrams]]
[[Category:Sport]]

Talk:2666: Universe Price Tiers

2022-09-02T20:36:00Z

Noëlle:

We seem to be in Universe Standard, based on the cosmic speed limit
[[User:Victor|Victor]] ([[User talk:Victor|talk]]) 22:03, 31 August 2022 (UTC)

Is the price per user (human)? Or payed by the "god" who runs the universe?
The interpretation would change quite a bit. If per user, some could travel fast while others would not see ads and could even be immortal.
If per universe, would the concept of ads disappear?
[[User:Victor|Victor]] ([[User talk:Victor|talk]]) 22:25, 31 August 2022 (UTC)
::The tree sound can't be a particular human's experience, and the speed limit seems intended to be per universe.

General comment, I think each line of the table should have a separate one-line or one-paragraph explanation, rather than squishing it into one column of a table which mostly reproduces the comic text. i.e. we don't need the table in the explanation, although it works fine in the transcript imo. [[Special:Contributions/172.69.62.71|172.69.62.71]] 23:40, 31 August 2022 (UTC)edit: a word

"Yes, and he cheats" may be a reference to a quote from ''Sid Meier's Alpha Centauri''.
::I fully expected something like ''"Most gods throw dice, but Fate plays chess, and you don't find out 'til too late that he's been playing with two queens all along."'' (from ''Interesting Times'' by Terry Pratchett) [[User:RAGBRAIvet|RAGBRAIvet]] ([[User talk:RAGBRAIvet|talk]]) 01:47, 1 September 2022 (UTC)
::The SMAC quote is "Einstein would turn over in his grave. Not only does God play dice, the dice are loaded. - Chairman Sheng-ji Yang", from the Probability Mechanics tech. Also, the "God does not play dice" quote is stated during the Supercollider secret project movie. I doubt the comic is referencing any particular media here, though. [[Special:Contributions/172.69.22.5|172.69.22.5]] 02:40, 1 September 2022 (UTC)
::Meanwhile, Stephen Hawking said "Not only does God play dice, but... he sometimes throws them where they cannot be seen." -- [[User:Hkmaly|Hkmaly]] ([[User talk:Hkmaly|talk]]) 16:01, 1 September 2022 (UTC)

Under ''Number of angels that can dance on the head of a pin'', '64' is 2⁵ and may be making reference to the Nintendo 64 game system. [[User:RAGBRAIvet|RAGBRAIvet]] ([[User talk:RAGBRAIvet|talk]]) 01:54, 1 September 2022 (UTC)
::And just for the record, 4096 is 2¹². [[User:RAGBRAIvet|RAGBRAIvet]] ([[User talk:RAGBRAIvet|talk]])
:::64 = 2<sup>6</sup> != 2<sup>5</sup> = 32. [[Special:Contributions/172.68.50.17|172.68.50.17]] 19:43, 2 September 2022 (UTC)
:: Note that the philosophical question of how many angels can dance on the head of a pin turns to have much more useful meaning if we realize that the question wasn't if 64 or 4096, but if it's a finite or infinite number, that is, if angels are subject to {{w|Pauli's exclusion principle}}. -- [[User:Hkmaly|Hkmaly]] ([[User talk:Hkmaly|talk]]) 15:59, 1 September 2022 (UTC)

::: I think the answer is [https://www.imdb.com/title/tt8071704/characters/nm0000531 to be found elsewhere]. And it is a different power of 2! [[Special:Contributions/172.70.162.147|172.70.162.147]] 17:26, 1 September 2022 (UTC)

Who is paying our subscription? How do we ensure we don't get demoted to lite?

Here, the sound of one hand clapping is pretty much "toop." Put your hand out flat fingers together, and no thumb involved, quickly make a fist. Toop. Edit I'm not making a fist. Im keeping the last joints straight and smacking my hand[[Special:Contributions/172.70.134.95|172.70.134.95]] 15:59, 1 September 2022 (UTC)
:But two hands each doing that (or slapping another bit of body) aren't "two hands clapping", but more like two hands ''clasping''/something-or-other-like-that.
:If you could bring your one hand to a sudden stop in mid-air ''as if'' hitting another hand, it might be closer, but there's no sudden stop possible like a contact-stop. Plus a full-fledged clap for maximum ovational volume involves cupped hands trapping a resonant volume of air between them, almost sealed (wet hands so positioned can be used to force a squeaky-fart sound out from between them), and neither an "air clap" or the toop-clasp can do anything so dramatic with a solo hand. [[Special:Contributions/141.101.99.154|141.101.99.154]] 17:54, 1 September 2022 (UTC)
: the sound can be more clap like if you bend your hand upwards and keep it like that. Then loosen your fingers, and smash your upward lower arm to the front and back. My one armed brother taught me. It's handy (hehe) if one hand is holding a drink. [[Special:Contributions/172.68.51.204|172.68.51.204]] 07:36, 2 September 2022 (UTC)

I have a problem with the "Bad things..." portion. ''If'' I was a bad person, then I would never pay for the universe, as I would be better off in the free version, where nothing bad would ever happen to me. [[User:SDSpivey|SDSpivey]] ([[User talk:SDSpivey|talk]]) 19:17, 1 September 2022 (UTC)

The "bad things" section is a bit bothersome: good things don't exist without bad things. Without bad things, good things are just...things. So maybe awareness of bad things is still extant in UniPro? That way, good things would still be at the upper end of a theoretical scale.

But the subjectivity of badness is concerning in a bad-things-don't-happen realm. I reckon plenty of people who could spring for fifty bucks a month would list rum, Katharine Hepburn movies, gay people and Jews as bad things that therefore won't happen. If I stump up my Pro subscription, do I have to share the universe with these douchebags, or do we each get our own? And if it's the latter, how much of a douche must you be to be excluded from my universe? Can we differ a little and still coexist, or do we have to gel perfectly? And how would that ever happen...and would it be tolerable to live surrounded by my opinion-clones? Is this...is this the too-perfect Matrix v.1.0? Am I buying a ticket to a simulated utopia while my body atrophies?
You monster! Guards! Guards! Let me out.....

[[Special:Contributions/172.71.178.35|172.71.178.35]] 23:09, 1 September 2022 (UTC)
Note that Universe Lite is marked as trademark, Universe Standard as a registered trademark, and Universe Pro as...BOTH. This is a joke; more is better, esp. in lists of features. But there's no point in claiming a mark is both a trademark and a registered trademark.

How to clap with one hand: https://www.youtube.com/watch?v=qwoq3QBaQAY [[User:Barmar|Barmar]] ([[User talk:Barmar|talk]]) 04:38, 2 September 2022 (UTC)

If a tree falls in a forest and there's no one there to hear it, then there is NO SOUND. The act of the tree falling will create vibrations in the air, but those vibrations only become 'sound' when they impact on a tympanic membrane (such as an eardrum) that is connected to a brain. Sound happens in your head, folks. Of course, in practice, the likelihood of a tree falling in an area that contains NO tympanic membranes at all is impossible given the abundance of miniature scaled life on Earth. That said, we have no idea whether insects actually perceive those air vibrations as 'sound' in the same way that humans do - the fairy fly, for example, is so small that it can 'swim' through air rather than flying, so probably perceives sound waves the same way that humans experience ocean waves.
[[User:MarquisOfCarrabass|MarquisOfCarrabass]] ([[User talk:MarquisOfCarrabass|talk]]) 05:50, 2 September 2022 (UTC)
: <-----Pish-Posh. Sound happens regardless of aby tympanic membranes. Sound: noun 1. vibrations that travel through the air or another medium and can be heard when they reach a person's or animal's ear. The definition is CAN be heard, not ARE heard. Sound vibrations cause MANY things to happen besides vibrating tympanic membranes, and it's STILL SOUND.[[Special:Contributions/172.70.100.60|172.70.100.60]] 11:47, 2 September 2022 (UTC)
::These two viewpoints are ''exactly'' why this is a point of philosophical discussion instead of a solved problem. [[User:Noëlle|Noëlle]] ([[User talk:Noëlle|talk]]) 20:36, 2 September 2022 (UTC)

We should do a comparison of universe standard vs our universe see if that's what we're doing [[User:Mushrooms|Mushrooms]] ([[User talk:Mushrooms|talk]]) 08:13, 2 September 2022 (UTC)
:...hang on, I already downloaded a crack to repatch the executables to get around the pesky copy protection/licence-key manager. The patcher utility says it might take some time, and I've had to give it superuser access to the entire system for some reason, so it might be a good idea to save your current session and let it do its job before messing about in the menus or we might find unexpected results! [[Special:Contributions/172.70.85.5|172.70.85.5]] 11:01, 2 September 2022 (UTC)
:I looked in the leaked payment notes, and found that biblicalGod31, the current payer, refused to pay 2 geomagnetic reversals ago, so our subscription got demoted to standard. Looking in the End God License Agreement, it seems that next geomagnetic reversal we will be demoted to lite. (Sorry if I didn't do humor well). [[Special:Contributions/172.70.126.11|172.70.126.11]] 13:38, 2 September 2022 (UTC)
::I definitely want to see this movie/read this book now. Our heroes discover that the universe is in fact a simulation. Not a malevolent one like The Matrix, but a for-fun one like implied by this comic. The heroes come to realize that the entity playing the simulation is about to screw it up somehow (possibly by not paying the subscription fee), and they have to figure out how to break out of the simulation and convince the apathetic entity to care about the inhabitants of the universe and save it from annihilation or demotion to the free tier. [[Special:Contributions/172.70.178.65|172.70.178.65]] 15:01, 2 September 2022 (UTC)

Talk:2625: Field Topology

2022-05-27T13:05:15Z

Noëlle:

First [[Special:Contributions/172.70.86.64|172.70.86.64]] 12:50, 27 May 2022 (UTC)

Why is football on the two-hole field? Where are the holes? I don't think the goal posts in American football introduce any since they're not closed. Maybe it's soccer? [[Special:Contributions/172.69.68.88|172.69.68.88]] 12:58, 27 May 2022 (UTC)

:Well, you might still be able to call them holes. They would be if they were fully rectangles. --[[User:BlackBeret|BlackBeret]] ([[User talk:BlackBeret|talk]]) 12:59, 27 May 2022 (UTC)

: Gridiron football's field contains two areas (the endzones) that can be thought of as not being part of the "normal" field of play, for lack of a better way of saying that pre-coffee. Association football likewise has the areas within the nets. [[User:Noëlle|Noëlle]] ([[User talk:Noëlle|talk]]) 13:05, 27 May 2022 (UTC)

Tetherball, in many variants, does contain an obstruction -- the pole, which you're not allowed to touch. The Topology Department is getting tired of having to switch out the fields. [[User:Noëlle|Noëlle]] ([[User talk:Noëlle|talk]]) 13:05, 27 May 2022 (UTC)

Talk:731: Desert Island

2021-11-13T19:01:58Z

Noëlle:

There's a shark, a manta ray, giant jellyfish, and a giant squid in the water. It's totally safe. And what the heck are those worms at the ocean bed? '''[[User:Davidy22|<span title="I want you."><u><font color="purple" size="2px">David</font><font color="green" size="3px">y</font></u><sup><font color="indigo" size="1px">22</font></sup></span>]]'''[[User talk:Davidy22|<tt>[talk]</tt>]] 13:27, 18 February 2013 (UTC)

:Those worms are ''extremophiles'' feeding off of the nutrients emitted by the volcanic column... and from what I understand, they're completely harmless. Their entire ecology centers around the extreme heat and alternative chemical sources of energy provided by the center of the earth (vs sun-based photosynthetic life.) Oh, and I think Randall left off the "not to scale" attribute of the map, otherwise the ocean floor would only be a few hundred feet deep... -- [[User:IronyChef|IronyChef]] ([[User talk:IronyChef|talk]]) 15:50, 18 February 2013 (UTC)
The title text seems to be alluding to a song. No idea what it could be. --[[User:Qwach|Qwach]] ([[User talk:Qwach|talk]]) 18:27, 31 August 2013 (UTC)

In my mind, I hear the alt-text as lyrics to the Can-Can song, [https://www.youtube.com/watch?v=g0WRJES4cyw "Infernal Gallop"]. See if you agree! {{unsigned ip|173.245.54.12}}

I'm pretty sure it's meant to go with the Major-General's song from the Pirates of Penzance by Gilbert and Sullivan. The meter and rhyme works out, and Randall based comic 1052 (Every Major's Terrible) on it, showing that he knows and likes the song. {{unsigned ip |141.101.88.208}}

Also the title text is a poem since no one mentions it:<br>
''Telescopes and bathyscapes<br>
''and sonar probes of Scottish lakes,<br>
''Tacoma Narrows bridge collapse<br>
''explained with abstract phase-space maps,<br>
''some x-ray slides, a music score,<br>
''Minard's Napoleonic war:<br>
''the most exciting new frontier<br>
''is charting what's already here.<br>
--[[User:7buergen|7buergen]] ([[User talk:7buergen|talk]]) 09:32, 13 February 2014 (UTC)

I think the point of the commentary is "there's more than meets the eye". [[Special:Contributions/141.101.81.216|141.101.81.216]] 13:47, 21 February 2014 (UTC)

It's to the tune of "We Didn't Start the Fire"... {{unsigned ip|108.162.221.116}}
:I agree. It lines up perfectly, arguably better than Major General. [[Special:Contributions/108.162.221.57|108.162.221.57]] 05:34, 14 July 2015 (UTC)

If "We Didn't Start the Fire" had been the original intended tune, then the "some" and "a" in line 5 should not be there; they are superfluous and do not fit the rhythm of "We Didn't Start the Fire". The most plausible conclusion is that those words were added or retained to make the text fit the meter of a different song. To my ear, "Infernal Gallop", as noted above, seems quite plausible, although it doesn't exactly account for "some". Being (to my shame) unfamiliar with Gilbert and Sullivan, I can't comment on the Modern Major-General theory. --[[User:5parrowhawk|5parrowhawk]] ([[User talk:5parrowhawk|talk]]) 10:18, 8 March 2016 (UTC)
Feels like it has something to do with those I Spy books idk {{unsigned ip|108.162.221.116}}

The white/blue colored things on the left could be scrap metal from the game subnautica[[Special:Contributions/162.158.134.184|162.158.134.184]] 06:19, 16 July 2019 (UTC)
: ...which was released mere 8 years after this comic... --[[User:Lupo|Lupo]] ([[User talk:Lupo|talk]]) 07:09, 16 July 2019 (UTC)

The title text can be sung to the tune of Billy Joel's "We Didn't Start The Fire". I found this out because someone pointed it out [https://tvtropes.org/pmwiki/remarks.php?trope=Main.WeDidntStartTheBillyJoelParodies#comment-80250 here]

When I read the title text I immediately heard the Gilbert & Sullivan music from Pirates of Penzance in my head. I'm voting for that rather than Billy Joel. [[User:The Cat Lady|-- The Cat Lady]] ([[User talk:The Cat Lady|talk]]) 14:38, 19 August 2021 (UTC)

The poem is in iambic tetrameter, a quite-common meter in English poetry and music. Examples include Wordsworth's "I Wandered Lonely As a Cloud", Marlowe's "The Passionate Shepherd to His Love", Byron's "She Walks in Beauty", and Tolkien's "Song of Eärendil". "We Didn't Start the Fire" doesn't fit (its feet are trochees, not iambs - long-short vs. short-long - and every fourth line leaves the last trochee blank); "Infernal Gallop" and "Modern Major-General" come ''very'' close to fitting, but there are subtle differences in each (for example, "Modern Major-General"'s first line starts with a full iamb (coincidentally, "I am") while Randall's skips the initial short beat of the first iamb). Of these, I think "Major-General" is the most likely match; Randall's poem has the same meter and flow, and matches G&S's rhyme scheme (where "Infernal Gallop" doesn't have lyrics ''to'' rhyme!). [[User:Noëlle|Noëlle]] ([[User talk:Noëlle|talk]]) 19:01, 13 November 2021 (UTC)

Talk:2447: Hammer Incident

2021-04-08T02:21:40Z

Noëlle: /* Giant comic */

big --[[Special:Contributions/162.158.187.153|162.158.187.153]] 02:04, 8 April 2021 (UTC)

== Giant comic ==

Is it meant to be that size? Does the bad luck apply to trying to upload comics at reasonable sizes?

[[Special:Contributions/172.69.33.19|172.69.33.19]] 02:09, 8 April 2021 (UTC)
:Oooh boy, indeed... "Error creating thumbnail: File with dimensions greater than 12.5 MP" is the Wiki's assessment of the auto-uploaded image. I haven't checked the resolution, but the https://imgs.xkcd.com/comics/hammer_incident.png one is apparently 4332x4838 (scales to 8% on my device), and I don't care to test the _2x version right now. I'm not sure that was the native res of it on creation, looks to be an accidental up-scaling prior to posting to xkcd itself. [[Special:Contributions/141.101.98.6|141.101.98.6]] 02:20, 8 April 2021 (UTC)

::The _2x version is actually the proper size for a normal comic - 578x645 pixels. [[User:Noëlle|Noëlle]] ([[User talk:Noëlle|talk]]) 02:21, 8 April 2021 (UTC)

988: Tradition

2012-12-13T12:41:00Z

Noëlle: /* Explanation */

{{comic
| number = 988
| date = December 9, 2011
| title = Tradition
| image = tradition.png
| imagesize =
| titletext = An 'American tradition' is anything that happened to a baby boomer twice.
}}

==Explanation==
This comic uses the source of the American Society of Composers, Authors and Publishers to say that the 20 most played Christmas songs in the US between 2000 and 2009 were all released between the 1930s and 1970s. It conspicuously excludes a number of more modern songs that seem ubiquitous, but this is because those songs do not appear on the ASCAP list.

"Popular release" in this context means release to the general public, not the version of the song which is most popular.

The {{w|Post–World War II baby boom|Baby Boomers}} were born in a period of time after {{w|World War II|the second World War}} after the troops came home and, thankful for their lives, went on to produce lots of children.

({{w|Christmas}} is December 25th, for any Americans who have been living under a rock for the past 2 weeks or so and don't own a TV and are somehow able to escape the crushing commercialism of the Christmas season. And "this time of the year" is apparently considered Christmas time despite the fact that not everyone celebrates Christmas in the US and in the world).

The data appears to come from [http://www.ascap.com/press/2009/1123_holidays_songs.aspx an ASCAP survey conducted in 2009].

==Transcript==
The 20 most-played Christmas songs (2000-2009 radio airplay) by decade of popular release

[A bar chart labeled on the X-axis with the decades "1900s" through "2000s" labeled. Each bar has, as one unit, a labeled song.

"1900s", "1910s", "1920s", "1980s", "1990s", and "2000s" are empty.

"1930s" has "Santa Claus is Coming to Town".

"1940s" has "Rudolph the Red-Nosed Reindeer", "Winter Wonderland", "Chestnuts Roasting on an Open Fire", "Let it Snow", "Have Yourself a Merry Little Christmas", "I'll be Home for Christmas", and "White Christmas".

"1950s" has "Rockin' Around the Christmas Tree", "Jingle Bell Rock", "Blue Christmas", "Little Drummer Boy", "I Saw Mommy Kissing Santa Claus", "Silver Bells", "It's Beginning to Look a Lot Like Christmas", "Sleigh Ride", and "Frosty the Snowman"

"1960s" has "Holly Jolly Christmas" and "It's the Most Wonderful Time of the Year"

"1970s" has "Feliz Navidad"]

Every year, American culture embarks on a massive project to carefully recreate the Christmases of Baby Boomers' childhoods.

{{comic discussion}}
[[Category:Charts]]
[[Category:Comics with color]]

Talk:988: Tradition

2012-12-13T12:35:10Z

Noëlle: Created page with "Redacted the following from the explanation: :It would be interesting to see this research, because the most popular Christmas album of all time was not released until 1994, ..."

Redacted the following from the explanation:

:It would be interesting to see this research, because the most popular Christmas album of all time was not released until 1994, "{{w|Merry Christmas (Mariah Carey album)|Merry Christmas}}" by {{w|Mariah Carey}}. This album featured what is considered to be the most ubiquitous song around this time of the year which is "All I Want For Christmas Is You" which is also featured prominently in the very popular (and frequently replayed) movie {{w|Love Actually}} from 2003. The song is the only holiday song and ringtone to reach multi-platinum status in the U.S. So, usually the information that Randall presents to us doesn't immediately present itself as egregiously incorrect, but this one just seems to not factor in the popular success of a mid-90s release.

because the list on which Randall based his graph is linked later in the explanation, and Randall doesn't have control over its data (unless he's using Data Over Billboard Charts). [[User:Noëlle|Noëlle]] ([[User talk:Noëlle|talk]]) 12:35, 13 December 2012 (UTC)

Talk:1144: Tags

2012-12-11T03:20:20Z

Noëlle:

I literally grimaced when I saw the comic, and then I read the title text and my stomach churned, and then I saw the non-breaking space and I wanted to crawl up in a ball and die. [[User:Lcarsos|lcarsos]]<span title="I'm an admin. I can help.">_a</span> ([[User talk:Lcarsos|talk]]) 06:01, 7 December 2012 (UTC)

I'm a web developer and I didn't find this annoying, although I did roll my eyes. Then I came here to see if there was anything I missed that SHOULD annoy me. No, to annoy a web developer you have to use table tags, blink tags(not supported on most browsers for good reason, annoys anybody when it works), and have a stray !-- inside a tag where it doesn't belong. Also, use any html inside your css file. And have it where it only works in IE. [[User:Ferretwilliams|Ferretwilliams]] ([[User talk:Ferretwilliams|talk]]) 06:11, 7 December 2012 (UTC)

:That's okay, it's easy to implement blink with javascript and changing the display value from hidden to inline every half second. And lots of news sites these days re-implement the marquee tag with a bit of javascript too. What Randall really missed here was an opportunity for the center and font tags. [[User:Lcarsos|lcarsos]]<span title="I'm an admin. I can help.">_a</span> ([[User talk:Lcarsos|talk]]) 06:18, 7 December 2012 (UTC)

:I'm sure Randall didn't want us to die, that's why he didn't go further. :-p [[User:Ctxppc|Ctxppc]] ([[User talk:Ctxppc|talk]]) 18:16, 7 December 2012 (UTC)

Argh. Almost as bad as unclosed left parentheses.(Y'know, like this. [[User:DreamingDaemon|DreamingDaemon]] ([[User talk:DreamingDaemon|talk]]) 10:21, 7 December 2012 (UTC)

:You mean like comic [[859]]?
::That's exactly what I meant... People do that to me in emails because they know it presses my buttons! [[User:DreamingDaemon|DreamingDaemon]] ([[User talk:DreamingDaemon|talk]]) 16:56, 7 December 2012 (UTC)

It's been a long while since I coded html (I quit about the time style sheets appeared) but I think the annoying part of <code>&nbsp;</code> is the fact that it appears as the 6 characters instead of a space, not just that it's at the end and could push the text to another line. Doesn't this typically mean that someone copied some code but didn't look carefully at the results when they pasted it into an editor? --[[User:DanB|DanB]] ([[User talk:DanB|talk]]) 14:27, 7 December 2012 (UTC)

:Either the title text has been parsed - in which case it's actually <code><nowiki>&lt;A&gt;: Like&lt;/a&gt; this&amp;nbsp;</nowiki></code> (and, yes, probably copy/pasted) - or it hasn't (which seems more likely to me), in which case the <code>&nbsp;</code> will show up as a non-breaking space when it is parsed. [[User:Noëlle|Noëlle]] ([[User talk:Noëlle|talk]]) 00:40, 8 December 2012 (UTC)

::The title text is copy/pasted from xkcd, where he escapes the ampersand so that the non-breaking space escape will show up in the title text. He might just be toying with those of us who know about the non-breaking space, as most people (the kind of people that would mis-match div and span and change the case of their tags) don't even know what a non-breaking space would be used for. [[User:Lcarsos|lcarsos]]<span title="I'm an admin. I can help.">_a</span> ([[User talk:Lcarsos|talk]]) 03:37, 8 December 2012 (UTC)

::: I know. :) I was answering Dan's question. Assuming the title text is going into a webpage, either the whole thing is already parsed, in which case the tags will also appear as they currently do, or it's not parsed yet and the <code>&nbsp;</code> will appear properly in the rendered page. :) [[User:Noëlle|Noëlle]] ([[User talk:Noëlle|talk]]) 01:53, 10 December 2012 (UTC)

I wonder if the "answer" in the title text is yet another joke? It goes <A>: Like</A> this  — but A used in this way means Anchor, not Answer. Such a line would appear in the browser as "Like this" (with the word Like blue and underlined), making it a clickable "Like" link. {{unsigned|69.158.169.14}}

: I think there is another joke hidden there: It goes »<A>: Like </A>this« instead of »: <A>Like</A> this« which turns not only »Like« but also the surrounding whitespace and punctuation into a link/anchor. That points to WYSIWYG HTML editors, as it's easy there to select a little bit more than the intended word when creating a link/marking text as bold, etc. [[Special:Contributions/178.201.95.76|178.201.95.76]] 01:03, 8 December 2012 (UTC)

::Actually, the Like wouldn't be blue and underlined BECAUSE it lacks the href. At least in firefox. The <a name> and <a href> are so different that browser apparently don't do either when neither are present. -- [[User:Hkmaly|Hkmaly]] ([[User talk:Hkmaly|talk]]) 11:48, 8 December 2012 (UTC)

Similarly, it would be nice to address whether you can close a <code><nowiki><div></nowiki></code> with a <code><nowiki></span></nowiki></code>. Obviously you're not supposed to, but would it work? – ''[[User:Philosopher|Philosopher]]'' <sup>[[User talk:Philosopher|Let us reason together.]]</sup> 20:57, 7 December 2012 (UTC)

:Opening but not closing a div tag, depends on how a browser's quirks mode interprets that; I'd expect the browser to have everything fall into that div until it encounters a close tag of an element outside (that the div is nested inside). I'd also expect that encountering a close span without having first pushed an open span tag onto the DOM would simply not be recognized as markup and treated as improperly escaped page content. But, I don't write code for any of the major browsers so this is ''wild'' speculation. [[User:Lcarsos|lcarsos]]<span title="I'm an admin. I can help.">_a</span> ([[User talk:Lcarsos|talk]]) 21:24, 7 December 2012 (UTC)

::You can't close a DIV with a SPAN; they're syntactically different and browsers treat them as such. If you try the code above, the major browsers do exactly as Lcarsos suggests with the open DIV (continue until they find a matching /DIV or until /BODY) and completely ignore the /SPAN (Chrome goes so far as to expunge it from the DOM entirely). The DIV behavior exposes a subtler aspect to the comic, actually - because DIV isn't a semantic element, if a /DIV is missing, it can get very, very difficult to track down where the appropriate /DIV is supposed to go, especially when multiple coders are working on a single long (and, in the worst-case scenario, improperly-nested, multi-file) page. [[User:Noëlle|Noëlle]] ([[User talk:Noëlle|talk]]) 00:39, 8 December 2012 (UTC)

:::Note that "multi-file" is common when it's application output and not static page. Even if the files are supposed to be correctly nested, it may be hard to find which of them isn't, especially taking into account "if"s of template engine. The template engine may not really help you, similarly to some interprets or compilers of programming language which tells you they are missing some closing symbol near the end of file even when the place they are actually missing from is somewhere in the middle, because they paired them incorrectly. -- [[User:Hkmaly|Hkmaly]] ([[User talk:Hkmaly|talk]]) 11:48, 8 December 2012 (UTC)

There needs to be a little more explanation of what <div> and <span> tags are. I come here to have the jokes I don't get explained, and after a sentence like "Usage of <span> and <div> tags should be kept low, for they have no intrinsic semantic value," I need a site called "explainexplainxkcd.com." [[Special:Contributions/24.224.110.93|24.224.110.93]] 01:17, 9 December 2012 (UTC)

: I clarified in the explanation. Does that look better? [[User:Noëlle|Noëlle]] ([[User talk:Noëlle|talk]]) 01:53, 10 December 2012 (UTC)

::Yes, thanks. I'm afraid I still don't have much idea what <div> and <span> are, but it looks like that's because it would to hard to absolutely fully explain. Thanks! [[Special:Contributions/98.122.166.235|98.122.166.235]] 04:07, 10 December 2012 (UTC)

:::It would, but I'll give it a shot! First, let's establish that DIV and SPAN are HTML elements that surround text or other elements on the page. You generally don't see <code><div></code> by itself; you see <code><div>Some stuff</div></code>. The forward slash in the second tag tells the browser to close the DIV element. (That's the difference between a tag and an element; <code><div></code> and <code></div></code> are both tags, but we refer to <code><div>contents</div></code> as a page element.)

:::Now, to extend the metaphor into the real world, you can think of <code><div></code> as meaning "container" and <code><span></code> as meaning "effect". "Container" doesn't mean very much by itself; it's just "a thing into which you can put other things". Likewise, "effect" just means "a way in which you can change how other things look". ("Effect" isn't necessarily the best term here, but I can't think of a better one.) "Container" provides no clues as to what kind of container it is or what you might find inside; "effect" doesn't really tell you what kind of visual change you're getting.

:::Imagine, then, a Christmas tree. You can put the Christmas tree in a tree stand (<code><div class="tree-stand">Christmas tree</div></code>) or inside a big box (<code><div class="big-box">Christmas tree</div></code>), or both at once if you're feeling saucy (<code><div class="big-box"><div class="tree-stand">Christmas tree</div></div></code>). Note that the closing tag will backtrack through the code and close the first DIV it finds, so that you could put other things inside the big box too: <code><div class="big-box"><div class="tree-stand">Christmas tree</div>Christmas cookies</div></code>. Likewise, you can attach ornaments and tinsel to the tree. Since they're effects that you're adding to the tree, rather than containers into which you're putting the tree, you'd use SPAN: <code><span class="ornaments">Christmas tree</span></code> and/or <code><span class="tinsel">Christmas tree</span></code>.

:::You can even have a Christmas tree with ornaments on the left and tinsel on the right, in a tree stand, inside a big box, with some cookies in the box with it:
:::<code><div class="big-box"></code>
::::<code><div class="tree-stand"></code>
:::::<code><span class="ornaments">Christmas</span> <span class="tinsel">tree</span></code>
::::<code></div></code>
::::<code>Christmas <span class="frosting">cookies</span></code>
:::<code></div></code>
:::(I decided to frost half of the cookies while I was putting them in the box.)

:::There's an important distinction to make here, by the way: the ornaments and tinsel can't help you ''move'' or ''position'' the Christmas tree, and they don't tell you anything about where the tree is, which is why we're using SPAN for them. The big box and tree stand, on the other hand, can be used to move or position the tree, which is why we're using DIV.

:::Meanwhile, HTML5 wants us to use <code><bigtreebox></code> and <code><treestand></code> for the containers, and <code><ornaments></code>, <code><tinsel></code>, and <code><frosting></code> for the effects.

:::Does that make sense? [[User:Noëlle|Noëlle]] ([[User talk:Noëlle|talk]]) 12:14, 10 December 2012 (UTC)

While I'm thinking about it - DIV and SPAN remain very important tags in web development, because even though they're structural and not semantic, the fact remains that there isn't going to be a pre-defined semantic tag for everything you want to do, and not every browser supports making up your own tags (even though they're supposed to). Until HTML5 is finalized (which is currently projected to happen in 2016, if I'm remembering correctly) and everybody starts supporting arbitrary tag definitions (which may be "never"), DIV and SPAN will remain useful as generic "container"/"effect" tags. [[User:Noëlle|Noëlle]] ([[User talk:Noëlle|talk]]) 12:14, 10 December 2012 (UTC)

As an intelligent human, it irks me when other humans are lazy, sloppy, or otherwise stupid. As a developer, I sometimes deal with all three. My annoyance factor is amplified by the fact that developers are (supposedly) educated and should be held to a higher standard. So the question is not "what can you get away with in most browsers", but "what is the established standard." As Mike Holmes would say, "Do it right the first time." - Ixalmida --[[Special:Contributions/208.95.30.82|208.95.30.82]] 18:10, 10 December 2012 (UTC)

:[http://xkcd.com/129/ My personal feelings] aside, this isn't an appropriate forum to debate the worthiness of contemporary use of HTML5. [[User:Noëlle|Noëlle]] ([[User talk:Noëlle|talk]]) 22:12, 10 December 2012 (UTC)

[http://i.imgur.com/T9UM3.png How to '''really''' annoy a web developer.] (Including the &nbsp; joke, along with another mangling of <A>!) [[User:Noëlle|Noëlle]] ([[User talk:Noëlle|talk]]) 03:19, 11 December 2012 (UTC)

Talk:1144: Tags

2012-12-11T03:19:15Z

Noëlle:

I literally grimaced when I saw the comic, and then I read the title text and my stomach churned, and then I saw the non-breaking space and I wanted to crawl up in a ball and die. [[User:Lcarsos|lcarsos]]<span title="I'm an admin. I can help.">_a</span> ([[User talk:Lcarsos|talk]]) 06:01, 7 December 2012 (UTC)

I'm a web developer and I didn't find this annoying, although I did roll my eyes. Then I came here to see if there was anything I missed that SHOULD annoy me. No, to annoy a web developer you have to use table tags, blink tags(not supported on most browsers for good reason, annoys anybody when it works), and have a stray !-- inside a tag where it doesn't belong. Also, use any html inside your css file. And have it where it only works in IE. [[User:Ferretwilliams|Ferretwilliams]] ([[User talk:Ferretwilliams|talk]]) 06:11, 7 December 2012 (UTC)

:That's okay, it's easy to implement blink with javascript and changing the display value from hidden to inline every half second. And lots of news sites these days re-implement the marquee tag with a bit of javascript too. What Randall really missed here was an opportunity for the center and font tags. [[User:Lcarsos|lcarsos]]<span title="I'm an admin. I can help.">_a</span> ([[User talk:Lcarsos|talk]]) 06:18, 7 December 2012 (UTC)

:I'm sure Randall didn't want us to die, that's why he didn't go further. :-p [[User:Ctxppc|Ctxppc]] ([[User talk:Ctxppc|talk]]) 18:16, 7 December 2012 (UTC)

Argh. Almost as bad as unclosed left parentheses.(Y'know, like this. [[User:DreamingDaemon|DreamingDaemon]] ([[User talk:DreamingDaemon|talk]]) 10:21, 7 December 2012 (UTC)

:You mean like comic [[859]]?
::That's exactly what I meant... People do that to me in emails because they know it presses my buttons! [[User:DreamingDaemon|DreamingDaemon]] ([[User talk:DreamingDaemon|talk]]) 16:56, 7 December 2012 (UTC)

It's been a long while since I coded html (I quit about the time style sheets appeared) but I think the annoying part of <code>&nbsp;</code> is the fact that it appears as the 6 characters instead of a space, not just that it's at the end and could push the text to another line. Doesn't this typically mean that someone copied some code but didn't look carefully at the results when they pasted it into an editor? --[[User:DanB|DanB]] ([[User talk:DanB|talk]]) 14:27, 7 December 2012 (UTC)

:Either the title text has been parsed - in which case it's actually <code><nowiki>&lt;A&gt;: Like&lt;/a&gt; this&amp;nbsp;</nowiki></code> (and, yes, probably copy/pasted) - or it hasn't (which seems more likely to me), in which case the <code>&nbsp;</code> will show up as a non-breaking space when it is parsed. [[User:Noëlle|Noëlle]] ([[User talk:Noëlle|talk]]) 00:40, 8 December 2012 (UTC)

::The title text is copy/pasted from xkcd, where he escapes the ampersand so that the non-breaking space escape will show up in the title text. He might just be toying with those of us who know about the non-breaking space, as most people (the kind of people that would mis-match div and span and change the case of their tags) don't even know what a non-breaking space would be used for. [[User:Lcarsos|lcarsos]]<span title="I'm an admin. I can help.">_a</span> ([[User talk:Lcarsos|talk]]) 03:37, 8 December 2012 (UTC)

::: I know. :) I was answering Dan's question. Assuming the title text is going into a webpage, either the whole thing is already parsed, in which case the tags will also appear as they currently do, or it's not parsed yet and the <code>&nbsp;</code> will appear properly in the rendered page. :) [[User:Noëlle|Noëlle]] ([[User talk:Noëlle|talk]]) 01:53, 10 December 2012 (UTC)

I wonder if the "answer" in the title text is yet another joke? It goes <A>: Like</A> this  — but A used in this way means Anchor, not Answer. Such a line would appear in the browser as "Like this" (with the word Like blue and underlined), making it a clickable "Like" link. {{unsigned|69.158.169.14}}

: I think there is another joke hidden there: It goes »<A>: Like </A>this« instead of »: <A>Like</A> this« which turns not only »Like« but also the surrounding whitespace and punctuation into a link/anchor. That points to WYSIWYG HTML editors, as it's easy there to select a little bit more than the intended word when creating a link/marking text as bold, etc. [[Special:Contributions/178.201.95.76|178.201.95.76]] 01:03, 8 December 2012 (UTC)

::Actually, the Like wouldn't be blue and underlined BECAUSE it lacks the href. At least in firefox. The <a name> and <a href> are so different that browser apparently don't do either when neither are present. -- [[User:Hkmaly|Hkmaly]] ([[User talk:Hkmaly|talk]]) 11:48, 8 December 2012 (UTC)

Similarly, it would be nice to address whether you can close a <code><nowiki><div></nowiki></code> with a <code><nowiki></span></nowiki></code>. Obviously you're not supposed to, but would it work? – ''[[User:Philosopher|Philosopher]]'' <sup>[[User talk:Philosopher|Let us reason together.]]</sup> 20:57, 7 December 2012 (UTC)

:Opening but not closing a div tag, depends on how a browser's quirks mode interprets that; I'd expect the browser to have everything fall into that div until it encounters a close tag of an element outside (that the div is nested inside). I'd also expect that encountering a close span without having first pushed an open span tag onto the DOM would simply not be recognized as markup and treated as improperly escaped page content. But, I don't write code for any of the major browsers so this is ''wild'' speculation. [[User:Lcarsos|lcarsos]]<span title="I'm an admin. I can help.">_a</span> ([[User talk:Lcarsos|talk]]) 21:24, 7 December 2012 (UTC)

::You can't close a DIV with a SPAN; they're syntactically different and browsers treat them as such. If you try the code above, the major browsers do exactly as Lcarsos suggests with the open DIV (continue until they find a matching /DIV or until /BODY) and completely ignore the /SPAN (Chrome goes so far as to expunge it from the DOM entirely). The DIV behavior exposes a subtler aspect to the comic, actually - because DIV isn't a semantic element, if a /DIV is missing, it can get very, very difficult to track down where the appropriate /DIV is supposed to go, especially when multiple coders are working on a single long (and, in the worst-case scenario, improperly-nested, multi-file) page. [[User:Noëlle|Noëlle]] ([[User talk:Noëlle|talk]]) 00:39, 8 December 2012 (UTC)

:::Note that "multi-file" is common when it's application output and not static page. Even if the files are supposed to be correctly nested, it may be hard to find which of them isn't, especially taking into account "if"s of template engine. The template engine may not really help you, similarly to some interprets or compilers of programming language which tells you they are missing some closing symbol near the end of file even when the place they are actually missing from is somewhere in the middle, because they paired them incorrectly. -- [[User:Hkmaly|Hkmaly]] ([[User talk:Hkmaly|talk]]) 11:48, 8 December 2012 (UTC)

There needs to be a little more explanation of what <div> and <span> tags are. I come here to have the jokes I don't get explained, and after a sentence like "Usage of <span> and <div> tags should be kept low, for they have no intrinsic semantic value," I need a site called "explainexplainxkcd.com." [[Special:Contributions/24.224.110.93|24.224.110.93]] 01:17, 9 December 2012 (UTC)

: I clarified in the explanation. Does that look better? [[User:Noëlle|Noëlle]] ([[User talk:Noëlle|talk]]) 01:53, 10 December 2012 (UTC)

::Yes, thanks. I'm afraid I still don't have much idea what <div> and <span> are, but it looks like that's because it would to hard to absolutely fully explain. Thanks! [[Special:Contributions/98.122.166.235|98.122.166.235]] 04:07, 10 December 2012 (UTC)

:::It would, but I'll give it a shot! First, let's establish that DIV and SPAN are HTML elements that surround text or other elements on the page. You generally don't see <code><div></code> by itself; you see <code><div>Some stuff</div></code>. The forward slash in the second tag tells the browser to close the DIV element. (That's the difference between a tag and an element; <code><div></code> and <code></div></code> are both tags, but we refer to <code><div>contents</div></code> as a page element.)

:::Now, to extend the metaphor into the real world, you can think of <code><div></code> as meaning "container" and <code><span></code> as meaning "effect". "Container" doesn't mean very much by itself; it's just "a thing into which you can put other things". Likewise, "effect" just means "a way in which you can change how other things look". ("Effect" isn't necessarily the best term here, but I can't think of a better one.) "Container" provides no clues as to what kind of container it is or what you might find inside; "effect" doesn't really tell you what kind of visual change you're getting.

:::Imagine, then, a Christmas tree. You can put the Christmas tree in a tree stand (<code><div class="tree-stand">Christmas tree</div></code>) or inside a big box (<code><div class="big-box">Christmas tree</div></code>), or both at once if you're feeling saucy (<code><div class="big-box"><div class="tree-stand">Christmas tree</div></div></code>). Note that the closing tag will backtrack through the code and close the first DIV it finds, so that you could put other things inside the big box too: <code><div class="big-box"><div class="tree-stand">Christmas tree</div>Christmas cookies</div></code>. Likewise, you can attach ornaments and tinsel to the tree. Since they're effects that you're adding to the tree, rather than containers into which you're putting the tree, you'd use SPAN: <code><span class="ornaments">Christmas tree</span></code> and/or <code><span class="tinsel">Christmas tree</span></code>.

:::You can even have a Christmas tree with ornaments on the left and tinsel on the right, in a tree stand, inside a big box, with some cookies in the box with it:
:::<code><div class="big-box"></code>
::::<code><div class="tree-stand"></code>
:::::<code><span class="ornaments">Christmas</span> <span class="tinsel">tree</span></code>
::::<code></div></code>
::::<code>Christmas <span class="frosting">cookies</span></code>
:::<code></div></code>
:::(I decided to frost half of the cookies while I was putting them in the box.)

:::There's an important distinction to make here, by the way: the ornaments and tinsel can't help you ''move'' or ''position'' the Christmas tree, and they don't tell you anything about where the tree is, which is why we're using SPAN for them. The big box and tree stand, on the other hand, can be used to move or position the tree, which is why we're using DIV.

:::Meanwhile, HTML5 wants us to use <code><bigtreebox></code> and <code><treestand></code> for the containers, and <code><ornaments></code>, <code><tinsel></code>, and <code><frosting></code> for the effects.

:::Does that make sense? [[User:Noëlle|Noëlle]] ([[User talk:Noëlle|talk]]) 12:14, 10 December 2012 (UTC)

While I'm thinking about it - DIV and SPAN remain very important tags in web development, because even though they're structural and not semantic, the fact remains that there isn't going to be a pre-defined semantic tag for everything you want to do, and not every browser supports making up your own tags (even though they're supposed to). Until HTML5 is finalized (which is currently projected to happen in 2016, if I'm remembering correctly) and everybody starts supporting arbitrary tag definitions (which may be "never"), DIV and SPAN will remain useful as generic "container"/"effect" tags. [[User:Noëlle|Noëlle]] ([[User talk:Noëlle|talk]]) 12:14, 10 December 2012 (UTC)

As an intelligent human, it irks me when other humans are lazy, sloppy, or otherwise stupid. As a developer, I sometimes deal with all three. My annoyance factor is amplified by the fact that developers are (supposedly) educated and should be held to a higher standard. So the question is not "what can you get away with in most browsers", but "what is the established standard." As Mike Holmes would say, "Do it right the first time." - Ixalmida --[[Special:Contributions/208.95.30.82|208.95.30.82]] 18:10, 10 December 2012 (UTC)

:[http://xkcd.com/129/ My personal feelings] aside, this isn't an appropriate forum to debate the worthiness of contemporary use of HTML5. [[User:Noëlle|Noëlle]] ([[User talk:Noëlle|talk]]) 22:12, 10 December 2012 (UTC)

[http://i.imgur.com/T9UM3.png How to '''really''' annoy a web developer.] [[User:Noëlle|Noëlle]] ([[User talk:Noëlle|talk]]) 03:19, 11 December 2012 (UTC)

Talk:1144: Tags

2012-12-11T01:23:13Z

Noëlle:

Talk:1144: Tags

2012-12-10T22:12:05Z

Noëlle:

I literally grimaced when I saw the comic, and then I read the title text and my stomach churned, and then I saw the non-breaking space and I wanted to crawl up in a ball and die. [[User:Lcarsos|lcarsos]]<span title="I'm an admin. I can help.">_a</span> ([[User talk:Lcarsos|talk]]) 06:01, 7 December 2012 (UTC)

I'm a web developer and I didn't find this annoying, although I did roll my eyes. Then I came here to see if there was anything I missed that SHOULD annoy me. No, to annoy a web developer you have to use table tags, blink tags(not supported on most browsers for good reason, annoys anybody when it works), and have a stray !-- inside a tag where it doesn't belong. Also, use any html inside your css file. And have it where it only works in IE. [[User:Ferretwilliams|Ferretwilliams]] ([[User talk:Ferretwilliams|talk]]) 06:11, 7 December 2012 (UTC)

:That's okay, it's easy to implement blink with javascript and changing the display value from hidden to inline every half second. And lots of news sites these days re-implement the marquee tag with a bit of javascript too. What Randall really missed here was an opportunity for the center and font tags. [[User:Lcarsos|lcarsos]]<span title="I'm an admin. I can help.">_a</span> ([[User talk:Lcarsos|talk]]) 06:18, 7 December 2012 (UTC)

:I'm sure Randall didn't want us to die, that's why he didn't go further. :-p [[User:Ctxppc|Ctxppc]] ([[User talk:Ctxppc|talk]]) 18:16, 7 December 2012 (UTC)

Argh. Almost as bad as unclosed left parentheses.(Y'know, like this. [[User:DreamingDaemon|DreamingDaemon]] ([[User talk:DreamingDaemon|talk]]) 10:21, 7 December 2012 (UTC)

:You mean like comic [[859]]?
::That's exactly what I meant... People do that to me in emails because they know it presses my buttons! [[User:DreamingDaemon|DreamingDaemon]] ([[User talk:DreamingDaemon|talk]]) 16:56, 7 December 2012 (UTC)

It's been a long while since I coded html (I quit about the time style sheets appeared) but I think the annoying part of <code>&nbsp;</code> is the fact that it appears as the 6 characters instead of a space, not just that it's at the end and could push the text to another line. Doesn't this typically mean that someone copied some code but didn't look carefully at the results when they pasted it into an editor? --[[User:DanB|DanB]] ([[User talk:DanB|talk]]) 14:27, 7 December 2012 (UTC)

:Either the title text has been parsed - in which case it's actually <code><nowiki>&lt;A&gt;: Like&lt;/a&gt; this&amp;nbsp;</nowiki></code> (and, yes, probably copy/pasted) - or it hasn't (which seems more likely to me), in which case the <code>&nbsp;</code> will show up as a non-breaking space when it is parsed. [[User:Noëlle|Noëlle]] ([[User talk:Noëlle|talk]]) 00:40, 8 December 2012 (UTC)

::The title text is copy/pasted from xkcd, where he escapes the ampersand so that the non-breaking space escape will show up in the title text. He might just be toying with those of us who know about the non-breaking space, as most people (the kind of people that would mis-match div and span and change the case of their tags) don't even know what a non-breaking space would be used for. [[User:Lcarsos|lcarsos]]<span title="I'm an admin. I can help.">_a</span> ([[User talk:Lcarsos|talk]]) 03:37, 8 December 2012 (UTC)

::: I know. :) I was answering Dan's question. Assuming the title text is going into a webpage, either the whole thing is already parsed, in which case the tags will also appear as they currently do, or it's not parsed yet and the <code>&nbsp;</code> will appear properly in the rendered page. :) [[User:Noëlle|Noëlle]] ([[User talk:Noëlle|talk]]) 01:53, 10 December 2012 (UTC)

I wonder if the "answer" in the title text is yet another joke? It goes <A>: Like</A> this  — but A used in this way means Anchor, not Answer. Such a line would appear in the browser as "Like this" (with the word Like blue and underlined), making it a clickable "Like" link. {{unsigned|69.158.169.14}}

: I think there is another joke hidden there: It goes »<A>: Like </A>this« instead of »: <A>Like</A> this« which turns not only »Like« but also the surrounding whitespace and punctuation into a link/anchor. That points to WYSIWYG HTML editors, as it's easy there to select a little bit more than the intended word when creating a link/marking text as bold, etc. [[Special:Contributions/178.201.95.76|178.201.95.76]] 01:03, 8 December 2012 (UTC)

::Actually, the Like wouldn't be blue and underlined BECAUSE it lacks the href. At least in firefox. The <a name> and <a href> are so different that browser apparently don't do either when neither are present. -- [[User:Hkmaly|Hkmaly]] ([[User talk:Hkmaly|talk]]) 11:48, 8 December 2012 (UTC)

Similarly, it would be nice to address whether you can close a <code><nowiki><div></nowiki></code> with a <code><nowiki></span></nowiki></code>. Obviously you're not supposed to, but would it work? – ''[[User:Philosopher|Philosopher]]'' <sup>[[User talk:Philosopher|Let us reason together.]]</sup> 20:57, 7 December 2012 (UTC)

:Opening but not closing a div tag, depends on how a browser's quirks mode interprets that; I'd expect the browser to have everything fall into that div until it encounters a close tag of an element outside (that the div is nested inside). I'd also expect that encountering a close span without having first pushed an open span tag onto the DOM would simply not be recognized as markup and treated as improperly escaped page content. But, I don't write code for any of the major browsers so this is ''wild'' speculation. [[User:Lcarsos|lcarsos]]<span title="I'm an admin. I can help.">_a</span> ([[User talk:Lcarsos|talk]]) 21:24, 7 December 2012 (UTC)

::You can't close a DIV with a SPAN; they're syntactically different and browsers treat them as such. If you try the code above, the major browsers do exactly as Lcarsos suggests with the open DIV (continue until they find a matching /DIV or until /BODY) and completely ignore the /SPAN (Chrome goes so far as to expunge it from the DOM entirely). The DIV behavior exposes a subtler aspect to the comic, actually - because DIV isn't a semantic element, if a /DIV is missing, it can get very, very difficult to track down where the appropriate /DIV is supposed to go, especially when multiple coders are working on a single long (and, in the worst-case scenario, improperly-nested, multi-file) page. [[User:Noëlle|Noëlle]] ([[User talk:Noëlle|talk]]) 00:39, 8 December 2012 (UTC)

:::Note that "multi-file" is common when it's application output and not static page. Even if the files are supposed to be correctly nested, it may be hard to find which of them isn't, especially taking into account "if"s of template engine. The template engine may not really help you, similarly to some interprets or compilers of programming language which tells you they are missing some closing symbol near the end of file even when the place they are actually missing from is somewhere in the middle, because they paired them incorrectly. -- [[User:Hkmaly|Hkmaly]] ([[User talk:Hkmaly|talk]]) 11:48, 8 December 2012 (UTC)

There needs to be a little more explanation of what <div> and <span> tags are. I come here to have the jokes I don't get explained, and after a sentence like "Usage of <span> and <div> tags should be kept low, for they have no intrinsic semantic value," I need a site called "explainexplainxkcd.com." [[Special:Contributions/24.224.110.93|24.224.110.93]] 01:17, 9 December 2012 (UTC)

: I clarified in the explanation. Does that look better? [[User:Noëlle|Noëlle]] ([[User talk:Noëlle|talk]]) 01:53, 10 December 2012 (UTC)

::Yes, thanks. I'm afraid I still don't have much idea what <div> and <span> are, but it looks like that's because it would to hard to absolutely fully explain. Thanks! [[Special:Contributions/98.122.166.235|98.122.166.235]] 04:07, 10 December 2012 (UTC)

:::It would, but I'll give it a shot! First, let's establish that DIV and SPAN are HTML elements that surround text or other elements on the page. You generally don't see <code><div></code> by itself; you see <code><div>Some stuff</div></code>. The forward slash in the second tag tells the browser to close the DIV element. (That's the difference between a tag and an element; <code><div></code> and <code></div></code> are both tags, but we refer to <code><div>contents</div></code> as a page element.)

:::Now, to extend the metaphor into the real world, you can think of <code><div></code> as meaning "container" and <code><span></code> as meaning "effect". "Container" doesn't mean very much by itself; it's just "a thing into which you can put other things". Likewise, "effect" just means "a way in which you can change how other things look". ("Effect" isn't necessarily the best term here, but I can't think of a better one.) "Container" provides no clues as to what kind of container it is or what you might find inside; "effect" doesn't really tell you what kind of visual change you're getting.

:::Imagine, then, a Christmas tree. You can put the Christmas tree in a tree stand (<code><div class="tree-stand">Christmas tree</div></code>) or inside a big box (<code><div class="big-box">Christmas tree</div></code>), or both at once if you're feeling saucy (<code><div class="big-box"><div class="tree-stand">Christmas tree</div></div></code>). Note that the closing tag will backtrack through the code and close the first DIV it finds, so that you could put other things inside the big box too: <code><div class="big-box"><div class="tree-stand">Christmas tree</div>Christmas cookies</div></code>. Likewise, you can attach ornaments and tinsel to the tree. Since they're effects that you're adding to the tree, rather than containers into which you're putting the tree, you'd use SPAN: <code><span class="ornaments">Christmas tree</span></code> and/or <code><span class="tinsel">Christmas tree</span></code>.

:::You can even have a Christmas tree with ornaments on the left and tinsel on the right, in a tree stand, inside a big box, with some cookies in the box with it:
:::<code><div class="big-box"></code>
::::<code><div class="tree-stand"></code>
:::::<code><span class="ornaments">Christmas</span> <span class="tinsel">tree</span></code>
::::<code></div></code>
::::<code>Christmas <span class="frosting">cookies</span></code>
:::<code></div></code>
:::(I decided to frost half of the cookies while I was putting them in the box.)

:::There's an important distinction to make here, by the way: the ornaments and tinsel can't help you ''move'' or ''position'' the Christmas tree, and they don't tell you anything about where the tree is, which is why we're using SPAN for them. The big box and tree stand, on the other hand, can be used to move or position the tree, which is why we're using DIV.

:::Meanwhile, HTML5 wants us to use <code><bigtreebox></code> and <code><treestand></code> for the containers, and <code><ornaments></code>, <code><tinsel></code>, and <code><frosting></code> for the effects.

:::Does that make sense? [[User:Noëlle|Noëlle]] ([[User talk:Noëlle|talk]]) 12:14, 10 December 2012 (UTC)

While I'm thinking about it - DIV and SPAN remain very important tags in web development, because even though they're structural and not semantic, the fact remains that there isn't going to be a pre-defined semantic tag for everything you want to do, and not every browser supports making up your own tags (even though they're supposed to). Until HTML5 is finalized (which is currently projected to happen in 2016, if I'm remembering correctly) and everybody starts supporting arbitrary tag definitions (which may be "never"), DIV and SPAN will remain useful as generic "container"/"effect" tags. [[User:Noëlle|Noëlle]] ([[User talk:Noëlle|talk]]) 12:14, 10 December 2012 (UTC)

As an intelligent human, it irks me when other humans are lazy, sloppy, or otherwise stupid. As a developer, I sometimes deal with all three. My annoyance factor is amplified by the fact that developers are (supposedly) educated and should be held to a higher standard. So the question is not "what can you get away with in most browsers", but "what is the established standard." As Mike Holmes would say, "Do it right the first time." - Ixalmida --[[Special:Contributions/208.95.30.82|208.95.30.82]] 18:10, 10 December 2012 (UTC)

:My personal feelings aside, this isn't an appropriate forum to debate the worthiness of contemporary use of HTML5. [[User:Noëlle|Noëlle]] ([[User talk:Noëlle|talk]]) 22:12, 10 December 2012 (UTC)

Talk:1144: Tags

2012-12-10T12:33:41Z

Noëlle:

Talk:1144: Tags

2012-12-10T12:32:50Z

Noëlle:

I literally grimaced when I saw the comic, and then I read the title text and my stomach churned, and then I saw the non-breaking space and I wanted to crawl up in a ball and die. [[User:Lcarsos|lcarsos]]<span title="I'm an admin. I can help.">_a</span> ([[User talk:Lcarsos|talk]]) 06:01, 7 December 2012 (UTC)

I'm a web developer and I didn't find this annoying, although I did roll my eyes. Then I came here to see if there was anything I missed that SHOULD annoy me. No, to annoy a web developer you have to use table tags, blink tags(not supported on most browsers for good reason, annoys anybody when it works), and have a stray !-- inside a tag where it doesn't belong. Also, use any html inside your css file. And have it where it only works in IE. [[User:Ferretwilliams|Ferretwilliams]] ([[User talk:Ferretwilliams|talk]]) 06:11, 7 December 2012 (UTC)

:That's okay, it's easy to implement blink with javascript and changing the display value from hidden to inline every half second. And lots of news sites these days re-implement the marquee tag with a bit of javascript too. What Randall really missed here was an opportunity for the center and font tags. [[User:Lcarsos|lcarsos]]<span title="I'm an admin. I can help.">_a</span> ([[User talk:Lcarsos|talk]]) 06:18, 7 December 2012 (UTC)

:I'm sure Randall didn't want us to die, that's why he didn't go further. :-p [[User:Ctxppc|Ctxppc]] ([[User talk:Ctxppc|talk]]) 18:16, 7 December 2012 (UTC)

Argh. Almost as bad as unclosed left parentheses.(Y'know, like this. [[User:DreamingDaemon|DreamingDaemon]] ([[User talk:DreamingDaemon|talk]]) 10:21, 7 December 2012 (UTC)

:You mean like comic [[859]]?
::That's exactly what I meant... People do that to me in emails because they know it presses my buttons! [[User:DreamingDaemon|DreamingDaemon]] ([[User talk:DreamingDaemon|talk]]) 16:56, 7 December 2012 (UTC)

It's been a long while since I coded html (I quit about the time style sheets appeared) but I think the annoying part of <code>&nbsp;</code> is the fact that it appears as the 6 characters instead of a space, not just that it's at the end and could push the text to another line. Doesn't this typically mean that someone copied some code but didn't look carefully at the results when they pasted it into an editor? --[[User:DanB|DanB]] ([[User talk:DanB|talk]]) 14:27, 7 December 2012 (UTC)

:Either the title text has been parsed - in which case it's actually <code><nowiki>&lt;A&gt;: Like&lt;/a&gt; this&amp;nbsp;</nowiki></code> (and, yes, probably copy/pasted) - or it hasn't (which seems more likely to me), in which case the <code>&nbsp;</code> will show up as a non-breaking space when it is parsed. [[User:Noëlle|Noëlle]] ([[User talk:Noëlle|talk]]) 00:40, 8 December 2012 (UTC)

::The title text is copy/pasted from xkcd, where he escapes the ampersand so that the non-breaking space escape will show up in the title text. He might just be toying with those of us who know about the non-breaking space, as most people (the kind of people that would mis-match div and span and change the case of their tags) don't even know what a non-breaking space would be used for. [[User:Lcarsos|lcarsos]]<span title="I'm an admin. I can help.">_a</span> ([[User talk:Lcarsos|talk]]) 03:37, 8 December 2012 (UTC)

::: I know. :) I was answering Dan's question. Assuming the title text is going into a webpage, either the whole thing is already parsed, in which case the tags will also appear as they currently do, or it's not parsed yet and the <code>&nbsp;</code> will appear properly in the rendered page. :) [[User:Noëlle|Noëlle]] ([[User talk:Noëlle|talk]]) 01:53, 10 December 2012 (UTC)

I wonder if the "answer" in the title text is yet another joke? It goes <A>: Like</A> this  — but A used in this way means Anchor, not Answer. Such a line would appear in the browser as "Like this" (with the word Like blue and underlined), making it a clickable "Like" link. {{unsigned|69.158.169.14}}

: I think there is another joke hidden there: It goes »<A>: Like </A>this« instead of »: <A>Like</A> this« which turns not only »Like« but also the surrounding whitespace and punctuation into a link/anchor. That points to WYSIWYG HTML editors, as it's easy there to select a little bit more than the intended word when creating a link/marking text as bold, etc. [[Special:Contributions/178.201.95.76|178.201.95.76]] 01:03, 8 December 2012 (UTC)

::Actually, the Like wouldn't be blue and underlined BECAUSE it lacks the href. At least in firefox. The <a name> and <a href> are so different that browser apparently don't do either when neither are present. -- [[User:Hkmaly|Hkmaly]] ([[User talk:Hkmaly|talk]]) 11:48, 8 December 2012 (UTC)

Similarly, it would be nice to address whether you can close a <code><nowiki><div></nowiki></code> with a <code><nowiki></span></nowiki></code>. Obviously you're not supposed to, but would it work? – ''[[User:Philosopher|Philosopher]]'' <sup>[[User talk:Philosopher|Let us reason together.]]</sup> 20:57, 7 December 2012 (UTC)

:Opening but not closing a div tag, depends on how a browser's quirks mode interprets that; I'd expect the browser to have everything fall into that div until it encounters a close tag of an element outside (that the div is nested inside). I'd also expect that encountering a close span without having first pushed an open span tag onto the DOM would simply not be recognized as markup and treated as improperly escaped page content. But, I don't write code for any of the major browsers so this is ''wild'' speculation. [[User:Lcarsos|lcarsos]]<span title="I'm an admin. I can help.">_a</span> ([[User talk:Lcarsos|talk]]) 21:24, 7 December 2012 (UTC)

::You can't close a DIV with a SPAN; they're syntactically different and browsers treat them as such. If you try the code above, the major browsers do exactly as Lcarsos suggests with the open DIV (continue until they find a matching /DIV or until /BODY) and completely ignore the /SPAN (Chrome goes so far as to expunge it from the DOM entirely). The DIV behavior exposes a subtler aspect to the comic, actually - because DIV isn't a semantic element, if a /DIV is missing, it can get very, very difficult to track down where the appropriate /DIV is supposed to go, especially when multiple coders are working on a single long (and, in the worst-case scenario, improperly-nested, multi-file) page. [[User:Noëlle|Noëlle]] ([[User talk:Noëlle|talk]]) 00:39, 8 December 2012 (UTC)

:::Note that "multi-file" is common when it's application output and not static page. Even if the files are supposed to be correctly nested, it may be hard to find which of them isn't, especially taking into account "if"s of template engine. The template engine may not really help you, similarly to some interprets or compilers of programming language which tells you they are missing some closing symbol near the end of file even when the place they are actually missing from is somewhere in the middle, because they paired them incorrectly. -- [[User:Hkmaly|Hkmaly]] ([[User talk:Hkmaly|talk]]) 11:48, 8 December 2012 (UTC)

There needs to be a little more explanation of what <div> and <span> tags are. I come here to have the jokes I don't get explained, and after a sentence like "Usage of <span> and <div> tags should be kept low, for they have no intrinsic semantic value," I need a site called "explainexplainxkcd.com." [[Special:Contributions/24.224.110.93|24.224.110.93]] 01:17, 9 December 2012 (UTC)

: I clarified in the explanation. Does that look better? [[User:Noëlle|Noëlle]] ([[User talk:Noëlle|talk]]) 01:53, 10 December 2012 (UTC)

::Yes, thanks. I'm afraid I still don't have much idea what <div> and <span> are, but it looks like that's because it would to hard to absolutely fully explain. Thanks! [[Special:Contributions/98.122.166.235|98.122.166.235]] 04:07, 10 December 2012 (UTC)

:::It would, but I'll give it a shot! First, let's establish that DIV and SPAN are HTML elements that surround text or other elements on the page. You generally don't see <code><div></code> by itself; you see <code><div>Some stuff</div></code>. The forward slash in the second tag tells the browser to close the DIV element. (That's the difference between a tag and an element; <code><div></code> and <code></div></code> are both tags, but we refer to <code><div>contents</div></code> as a page element.)

:::Now, to extend the metaphor into the real world, you can think of <code><div></code> as meaning "container" and <code><span></code> as meaning "effect". "Container" doesn't mean very much by itself; it's just "a thing into which you can put other things". Likewise, "effect" just means "a way in which you can change how other things look". ("Effect" isn't necessarily the best term here, but I can't think of a better one.) "Container" provides no clues as to what kind of container it is or what you might find inside; "effect" doesn't really tell you what kind of visual change you're getting.

:::Imagine, then, a Christmas tree. You can put the Christmas tree in a tree stand (<code><div class="tree-stand">Christmas tree</div></code>) or inside a big box (<code><div class="big-box">Christmas tree</div></code>), or both at once if you're feeling saucy (<code><div class="big-box"><div class="tree-stand">Christmas tree</div></div></code>). Note that the closing tag will backtrack through the code and close the first DIV it finds, so that you could put other things inside the big box too: <code><div class="big-box"><div class="tree-stand">Christmas tree</div>Christmas cookies</div></code>. Likewise, you can attach ornaments and tinsel to the tree. Since they're effects that you're adding to the tree, rather than containers into which you're putting the tree, you'd use SPAN: <code><span class="ornaments">Christmas tree</span></code> and/or <code><span class="tinsel">Christmas tree</span></code>.

:::You can even have a Christmas tree with ornaments on the left, tinsel on the right, in a tree stand, inside a big box, with some cookies in the box with it:
:::<code><div class="big-box"></code>
::::<code><div class="tree-stand"></code>
:::::<code><span class="ornaments">Christmas</span> <span class="tinsel">tree</span></code>
::::<code></div></code>
::::<code>Christmas <span class="frosting">cookies</span></code>
:::<code></div></code>
:::(I decided to frost half of the cookies while I was putting them in the box.)

:::There's an important distinction to make here, by the way: the ornaments and tinsel can't help you ''move'' or ''position'' the Christmas tree, and they don't tell you anything about where the tree is, which is why we're using SPAN for them. The big box and tree stand, on the other hand, can be used to move or position the tree, which is why we're using DIV.

:::Meanwhile, HTML5 wants us to use <code><bigtreebox></code> and <code><treestand></code> for the containers, and <code><ornaments></code>, <code><tinsel></code>, and <code><frosting></code> for the effects.

:::Does that make sense? [[User:Noëlle|Noëlle]] ([[User talk:Noëlle|talk]]) 12:14, 10 December 2012 (UTC)

While I'm thinking about it - DIV and SPAN remain very important tags in web development, because even though they're structural and not semantic, the fact remains that there isn't going to be a pre-defined semantic tag for everything you want to do, and not every browser supports making up your own tags (even though they're supposed to). Until HTML5 is finalized (which is currently projected to happen in 2016, if I'm remembering correctly) and everybody starts supporting arbitrary tag definitions (which may be "never"), DIV and SPAN will remain useful as generic "container"/"effect" tags. [[User:Noëlle|Noëlle]] ([[User talk:Noëlle|talk]]) 12:14, 10 December 2012 (UTC)

Talk:1144: Tags

2012-12-10T12:17:18Z

Noëlle:

I literally grimaced when I saw the comic, and then I read the title text and my stomach churned, and then I saw the non-breaking space and I wanted to crawl up in a ball and die. [[User:Lcarsos|lcarsos]]<span title="I'm an admin. I can help.">_a</span> ([[User talk:Lcarsos|talk]]) 06:01, 7 December 2012 (UTC)

I'm a web developer and I didn't find this annoying, although I did roll my eyes. Then I came here to see if there was anything I missed that SHOULD annoy me. No, to annoy a web developer you have to use table tags, blink tags(not supported on most browsers for good reason, annoys anybody when it works), and have a stray !-- inside a tag where it doesn't belong. Also, use any html inside your css file. And have it where it only works in IE. [[User:Ferretwilliams|Ferretwilliams]] ([[User talk:Ferretwilliams|talk]]) 06:11, 7 December 2012 (UTC)

:That's okay, it's easy to implement blink with javascript and changing the display value from hidden to inline every half second. And lots of news sites these days re-implement the marquee tag with a bit of javascript too. What Randall really missed here was an opportunity for the center and font tags. [[User:Lcarsos|lcarsos]]<span title="I'm an admin. I can help.">_a</span> ([[User talk:Lcarsos|talk]]) 06:18, 7 December 2012 (UTC)

:I'm sure Randall didn't want us to die, that's why he didn't go further. :-p [[User:Ctxppc|Ctxppc]] ([[User talk:Ctxppc|talk]]) 18:16, 7 December 2012 (UTC)

Argh. Almost as bad as unclosed left parentheses.(Y'know, like this. [[User:DreamingDaemon|DreamingDaemon]] ([[User talk:DreamingDaemon|talk]]) 10:21, 7 December 2012 (UTC)

:You mean like comic [[859]]?
::That's exactly what I meant... People do that to me in emails because they know it presses my buttons! [[User:DreamingDaemon|DreamingDaemon]] ([[User talk:DreamingDaemon|talk]]) 16:56, 7 December 2012 (UTC)

It's been a long while since I coded html (I quit about the time style sheets appeared) but I think the annoying part of <code>&nbsp;</code> is the fact that it appears as the 6 characters instead of a space, not just that it's at the end and could push the text to another line. Doesn't this typically mean that someone copied some code but didn't look carefully at the results when they pasted it into an editor? --[[User:DanB|DanB]] ([[User talk:DanB|talk]]) 14:27, 7 December 2012 (UTC)

:Either the title text has been parsed - in which case it's actually <code><nowiki>&lt;A&gt;: Like&lt;/a&gt; this&amp;nbsp;</nowiki></code> (and, yes, probably copy/pasted) - or it hasn't (which seems more likely to me), in which case the <code>&nbsp;</code> will show up as a non-breaking space when it is parsed. [[User:Noëlle|Noëlle]] ([[User talk:Noëlle|talk]]) 00:40, 8 December 2012 (UTC)

::The title text is copy/pasted from xkcd, where he escapes the ampersand so that the non-breaking space escape will show up in the title text. He might just be toying with those of us who know about the non-breaking space, as most people (the kind of people that would mis-match div and span and change the case of their tags) don't even know what a non-breaking space would be used for. [[User:Lcarsos|lcarsos]]<span title="I'm an admin. I can help.">_a</span> ([[User talk:Lcarsos|talk]]) 03:37, 8 December 2012 (UTC)

::: I know. :) I was answering Dan's question. Assuming the title text is going into a webpage, either the whole thing is already parsed, in which case the tags will also appear as they currently do, or it's not parsed yet and the <code>&nbsp;</code> will appear properly in the rendered page. :) [[User:Noëlle|Noëlle]] ([[User talk:Noëlle|talk]]) 01:53, 10 December 2012 (UTC)

I wonder if the "answer" in the title text is yet another joke? It goes <A>: Like</A> this  — but A used in this way means Anchor, not Answer. Such a line would appear in the browser as "Like this" (with the word Like blue and underlined), making it a clickable "Like" link. {{unsigned|69.158.169.14}}

: I think there is another joke hidden there: It goes »<A>: Like </A>this« instead of »: <A>Like</A> this« which turns not only »Like« but also the surrounding whitespace and punctuation into a link/anchor. That points to WYSIWYG HTML editors, as it's easy there to select a little bit more than the intended word when creating a link/marking text as bold, etc. [[Special:Contributions/178.201.95.76|178.201.95.76]] 01:03, 8 December 2012 (UTC)

::Actually, the Like wouldn't be blue and underlined BECAUSE it lacks the href. At least in firefox. The <a name> and <a href> are so different that browser apparently don't do either when neither are present. -- [[User:Hkmaly|Hkmaly]] ([[User talk:Hkmaly|talk]]) 11:48, 8 December 2012 (UTC)

Similarly, it would be nice to address whether you can close a <code><nowiki><div></nowiki></code> with a <code><nowiki></span></nowiki></code>. Obviously you're not supposed to, but would it work? – ''[[User:Philosopher|Philosopher]]'' <sup>[[User talk:Philosopher|Let us reason together.]]</sup> 20:57, 7 December 2012 (UTC)

:Opening but not closing a div tag, depends on how a browser's quirks mode interprets that; I'd expect the browser to have everything fall into that div until it encounters a close tag of an element outside (that the div is nested inside). I'd also expect that encountering a close span without having first pushed an open span tag onto the DOM would simply not be recognized as markup and treated as improperly escaped page content. But, I don't write code for any of the major browsers so this is ''wild'' speculation. [[User:Lcarsos|lcarsos]]<span title="I'm an admin. I can help.">_a</span> ([[User talk:Lcarsos|talk]]) 21:24, 7 December 2012 (UTC)

::You can't close a DIV with a SPAN; they're syntactically different and browsers treat them as such. If you try the code above, the major browsers do exactly as Lcarsos suggests with the open DIV (continue until they find a matching /DIV or until /BODY) and completely ignore the /SPAN (Chrome goes so far as to expunge it from the DOM entirely). The DIV behavior exposes a subtler aspect to the comic, actually - because DIV isn't a semantic element, if a /DIV is missing, it can get very, very difficult to track down where the appropriate /DIV is supposed to go, especially when multiple coders are working on a single long (and, in the worst-case scenario, improperly-nested, multi-file) page. [[User:Noëlle|Noëlle]] ([[User talk:Noëlle|talk]]) 00:39, 8 December 2012 (UTC)

:::Note that "multi-file" is common when it's application output and not static page. Even if the files are supposed to be correctly nested, it may be hard to find which of them isn't, especially taking into account "if"s of template engine. The template engine may not really help you, similarly to some interprets or compilers of programming language which tells you they are missing some closing symbol near the end of file even when the place they are actually missing from is somewhere in the middle, because they paired them incorrectly. -- [[User:Hkmaly|Hkmaly]] ([[User talk:Hkmaly|talk]]) 11:48, 8 December 2012 (UTC)

There needs to be a little more explanation of what <div> and <span> tags are. I come here to have the jokes I don't get explained, and after a sentence like "Usage of <span> and <div> tags should be kept low, for they have no intrinsic semantic value," I need a site called "explainexplainxkcd.com." [[Special:Contributions/24.224.110.93|24.224.110.93]] 01:17, 9 December 2012 (UTC)

: I clarified in the explanation. Does that look better? [[User:Noëlle|Noëlle]] ([[User talk:Noëlle|talk]]) 01:53, 10 December 2012 (UTC)

::Yes, thanks. I'm afraid I still don't have much idea what <div> and <span> are, but it looks like that's because it would to hard to absolutely fully explain. Thanks! [[Special:Contributions/98.122.166.235|98.122.166.235]] 04:07, 10 December 2012 (UTC)

:::It would, but I'll give it a shot! First, let's establish that DIV and SPAN are HTML elements that surround text or other elements on the page. You generally don't see <code><div></code> by itself; you see <code><div>Some stuff</div></code>. The forward slash in the second tag tells the browser to close the DIV element. (That's the difference between a tag and an element; <code><div></code> and <code></div></code> are both tags, but we refer to <code><div>contents</div></code> as a page element.)

:::Now, to extend the metaphor into the real world, you can think of <code><div></code> as meaning "container" and <code><span></code> as meaning "effect". "Container" doesn't mean very much by itself; it's just "a thing into which you can put other things". Likewise, "effect" just means "a way in which you can change how other things look". ("Effect" isn't necessarily the best term here, but I can't think of a better one.) "Container" provides no clues as to what kind of container it is or what you might find inside; "effect" doesn't really tell you what kind of visual change you're getting.

:::Imagine, then, a Christmas tree. You can put the Christmas tree in a tree stand (<code><div class="tree-stand">Christmas tree</div></code>) or inside a big box (<code><div class="big-box">Christmas tree</div></code>), or both at once if you're feeling saucy (<code><div class="big-box"><div class="tree-stand">Christmas tree</div></div></code>). Note that the closing tag will backtrack through the code and close the first DIV it finds, so that you could put other things inside the big box too: <code><div class="big-box"><div class="tree-stand">Christmas tree</div>Christmas cookies</div></code>. Likewise, you can attach ornaments and tinsel to the tree. Since they're effects that you're adding to the tree, rather than containers into which you're putting the tree, you'd use SPAN: <code><span class="ornaments">Christmas tree></code> and/or <code><span class="tinsel"></code>.

:::You can even have a Christmas tree with ornaments on the left, tinsel on the right, in a tree stand, inside a big box, with some cookies in the box with it:
:::<code><div class="big-box"></code>
::::<code><div class="tree-stand"></code>
:::::<code><span class="ornaments">Christmas</span> <span class="tinsel">tree</span></code>
::::<code></div></code>
::::<code>Christmas <span class="frosting">cookies</span></code>
:::<code></div></code>
:::(I decided to frost half of the cookies while I was putting them in the box.)

:::There's an important distinction to make here, by the way: the ornaments and tinsel can't help you ''move'' or ''position'' the Christmas tree, and they don't tell you anything about where the tree is, which is why we're using SPAN for them. The big box and tree stand, on the other hand, can be used to move or position the tree, which is why we're using DIV.

:::Meanwhile, HTML5 wants us to use <code><bigtreebox></code> and <code><treestand></code> for the containers, and <code><ornaments></code>, <code><tinsel></code>, and <code><frosting></code> for the effects.

:::Does that make sense? [[User:Noëlle|Noëlle]] ([[User talk:Noëlle|talk]]) 12:14, 10 December 2012 (UTC)

While I'm thinking about it - DIV and SPAN remain very important tags in web development, because even though they're structural and not semantic, the fact remains that there isn't going to be a pre-defined semantic tag for everything you want to do, and not every browser supports making up your own tags (even though they're supposed to). Until HTML5 is finalized (which is currently projected to happen in 2016, if I'm remembering correctly) and everybody starts supporting arbitrary tag definitions (which may be "never"), DIV and SPAN will remain useful as generic "container"/"effect" tags. [[User:Noëlle|Noëlle]] ([[User talk:Noëlle|talk]]) 12:14, 10 December 2012 (UTC)

Talk:1144: Tags

2012-12-10T12:14:26Z

Noëlle:

I literally grimaced when I saw the comic, and then I read the title text and my stomach churned, and then I saw the non-breaking space and I wanted to crawl up in a ball and die. [[User:Lcarsos|lcarsos]]<span title="I'm an admin. I can help.">_a</span> ([[User talk:Lcarsos|talk]]) 06:01, 7 December 2012 (UTC)

I'm a web developer and I didn't find this annoying, although I did roll my eyes. Then I came here to see if there was anything I missed that SHOULD annoy me. No, to annoy a web developer you have to use table tags, blink tags(not supported on most browsers for good reason, annoys anybody when it works), and have a stray !-- inside a tag where it doesn't belong. Also, use any html inside your css file. And have it where it only works in IE. [[User:Ferretwilliams|Ferretwilliams]] ([[User talk:Ferretwilliams|talk]]) 06:11, 7 December 2012 (UTC)

:That's okay, it's easy to implement blink with javascript and changing the display value from hidden to inline every half second. And lots of news sites these days re-implement the marquee tag with a bit of javascript too. What Randall really missed here was an opportunity for the center and font tags. [[User:Lcarsos|lcarsos]]<span title="I'm an admin. I can help.">_a</span> ([[User talk:Lcarsos|talk]]) 06:18, 7 December 2012 (UTC)

:I'm sure Randall didn't want us to die, that's why he didn't go further. :-p [[User:Ctxppc|Ctxppc]] ([[User talk:Ctxppc|talk]]) 18:16, 7 December 2012 (UTC)

Argh. Almost as bad as unclosed left parentheses.(Y'know, like this. [[User:DreamingDaemon|DreamingDaemon]] ([[User talk:DreamingDaemon|talk]]) 10:21, 7 December 2012 (UTC)

:You mean like comic [[859]]?
::That's exactly what I meant... People do that to me in emails because they know it presses my buttons! [[User:DreamingDaemon|DreamingDaemon]] ([[User talk:DreamingDaemon|talk]]) 16:56, 7 December 2012 (UTC)

It's been a long while since I coded html (I quit about the time style sheets appeared) but I think the annoying part of <code>&nbsp;</code> is the fact that it appears as the 6 characters instead of a space, not just that it's at the end and could push the text to another line. Doesn't this typically mean that someone copied some code but didn't look carefully at the results when they pasted it into an editor? --[[User:DanB|DanB]] ([[User talk:DanB|talk]]) 14:27, 7 December 2012 (UTC)

:Either the title text has been parsed - in which case it's actually <code><nowiki>&lt;A&gt;: Like&lt;/a&gt; this&amp;nbsp;</nowiki></code> (and, yes, probably copy/pasted) - or it hasn't (which seems more likely to me), in which case the <code>&nbsp;</code> will show up as a non-breaking space when it is parsed. [[User:Noëlle|Noëlle]] ([[User talk:Noëlle|talk]]) 00:40, 8 December 2012 (UTC)

::The title text is copy/pasted from xkcd, where he escapes the ampersand so that the non-breaking space escape will show up in the title text. He might just be toying with those of us who know about the non-breaking space, as most people (the kind of people that would mis-match div and span and change the case of their tags) don't even know what a non-breaking space would be used for. [[User:Lcarsos|lcarsos]]<span title="I'm an admin. I can help.">_a</span> ([[User talk:Lcarsos|talk]]) 03:37, 8 December 2012 (UTC)

::: I know. :) I was answering Dan's question. Assuming the title text is going into a webpage, either the whole thing is already parsed, in which case the tags will also appear as they currently do, or it's not parsed yet and the <code>&nbsp;</code> will appear properly in the rendered page. :) [[User:Noëlle|Noëlle]] ([[User talk:Noëlle|talk]]) 01:53, 10 December 2012 (UTC)

I wonder if the "answer" in the title text is yet another joke? It goes <A>: Like</A> this  — but A used in this way means Anchor, not Answer. Such a line would appear in the browser as "Like this" (with the word Like blue and underlined), making it a clickable "Like" link. {{unsigned|69.158.169.14}}

: I think there is another joke hidden there: It goes »<A>: Like </A>this« instead of »: <A>Like</A> this« which turns not only »Like« but also the surrounding whitespace and punctuation into a link/anchor. That points to WYSIWYG HTML editors, as it's easy there to select a little bit more than the intended word when creating a link/marking text as bold, etc. [[Special:Contributions/178.201.95.76|178.201.95.76]] 01:03, 8 December 2012 (UTC)

::Actually, the Like wouldn't be blue and underlined BECAUSE it lacks the href. At least in firefox. The <a name> and <a href> are so different that browser apparently don't do either when neither are present. -- [[User:Hkmaly|Hkmaly]] ([[User talk:Hkmaly|talk]]) 11:48, 8 December 2012 (UTC)

Similarly, it would be nice to address whether you can close a <code><nowiki><div></nowiki></code> with a <code><nowiki></span></nowiki></code>. Obviously you're not supposed to, but would it work? – ''[[User:Philosopher|Philosopher]]'' <sup>[[User talk:Philosopher|Let us reason together.]]</sup> 20:57, 7 December 2012 (UTC)

:Opening but not closing a div tag, depends on how a browser's quirks mode interprets that; I'd expect the browser to have everything fall into that div until it encounters a close tag of an element outside (that the div is nested inside). I'd also expect that encountering a close span without having first pushed an open span tag onto the DOM would simply not be recognized as markup and treated as improperly escaped page content. But, I don't write code for any of the major browsers so this is ''wild'' speculation. [[User:Lcarsos|lcarsos]]<span title="I'm an admin. I can help.">_a</span> ([[User talk:Lcarsos|talk]]) 21:24, 7 December 2012 (UTC)

::You can't close a DIV with a SPAN; they're syntactically different and browsers treat them as such. If you try the code above, the major browsers do exactly as Lcarsos suggests with the open DIV (continue until they find a matching /DIV or until /BODY) and completely ignore the /SPAN (Chrome goes so far as to expunge it from the DOM entirely). The DIV behavior exposes a subtler aspect to the comic, actually - because DIV isn't a semantic element, if a /DIV is missing, it can get very, very difficult to track down where the appropriate /DIV is supposed to go, especially when multiple coders are working on a single long (and, in the worst-case scenario, improperly-nested, multi-file) page. [[User:Noëlle|Noëlle]] ([[User talk:Noëlle|talk]]) 00:39, 8 December 2012 (UTC)

:::Note that "multi-file" is common when it's application output and not static page. Even if the files are supposed to be correctly nested, it may be hard to find which of them isn't, especially taking into account "if"s of template engine. The template engine may not really help you, similarly to some interprets or compilers of programming language which tells you they are missing some closing symbol near the end of file even when the place they are actually missing from is somewhere in the middle, because they paired them incorrectly. -- [[User:Hkmaly|Hkmaly]] ([[User talk:Hkmaly|talk]]) 11:48, 8 December 2012 (UTC)

There needs to be a little more explanation of what <div> and <span> tags are. I come here to have the jokes I don't get explained, and after a sentence like "Usage of <span> and <div> tags should be kept low, for they have no intrinsic semantic value," I need a site called "explainexplainxkcd.com." [[Special:Contributions/24.224.110.93|24.224.110.93]] 01:17, 9 December 2012 (UTC)

: I clarified in the explanation. Does that look better? [[User:Noëlle|Noëlle]] ([[User talk:Noëlle|talk]]) 01:53, 10 December 2012 (UTC)

::Yes, thanks. I'm afraid I still don't have much idea what <div> and <span> are, but it looks like that's because it would to hard to absolutely fully explain. Thanks! [[Special:Contributions/98.122.166.235|98.122.166.235]] 04:07, 10 December 2012 (UTC)

:::It would, but I'll give it a shot! First, let's establish that DIV and SPAN are HTML elements that surround text or other elements on the page. You generally don't see <code><div></code> by itself; you see <code><div>Some stuff</div></code>. The forward slash in the second tag tells the browser to close the DIV element. (That's the difference between a tag and an element; <code><div></code> and <code></div></code> are both tags, but we refer to <code><div>contents</div></code> as a page element.)

:::Now, to extend the metaphor into the real world, you can think of <code><div></code> as meaning "container" and <code><span></code> as meaning "effect". "Container" doesn't mean very much by itself; it's just "a thing into which you can put other things". Likewise, "effect" just means "a way in which you can change how other things look". ("Effect" isn't necessarily the best term here, but I can't think of a better one.) "Container" provides no clues as to what kind of container it is or what you might find inside; "effect" doesn't really tell you what kind of visual change you're getting.

:::Imagine, then, a Christmas tree. You can put the Christmas tree in a tree stand (<code><div class="tree-stand">Christmas tree</div></code>) or inside a big box (<code><div class="big-box">Christmas tree</div></code>), or both at once if you're feeling saucy (<code><div class="big-box"><div class="tree-stand">Christmas tree</div></div></code>). Note that the closing tag will backtrack through the code and close the first DIV it finds, so that you could put other things inside the big box too: <code><div class="big-box"><div class="tree-stand">Christmas tree</div>Christmas cookies</div></code>. Likewise, you can attach ornaments and tinsel to the tree. Since they're effects that you're adding to the tree, rather than containers into which you're putting the tree, you'd use SPAN: <code><span class="ornaments">Christmas tree></code> and/or <code><span class="tinsel"></code>.

:::You can even have a Christmas tree with ornaments on the left, tinsel on the right, in a tree stand, inside a big box, with some cookies in the box with it:
:::<code><div class="big-box">
::::<div class="tree-stand">
:::::<span class="ornaments">Christmas</span> <span class="tinsel">tree</span>
::::</div>
::::Christmas <span class="frosting">cookies</span>
:::</div></code>
:::(I decided to frost half of the cookies while I was putting them in the box.)

:::There's an important distinction to make here, by the way: the ornaments and tinsel can't help you ''move'' or ''position'' the Christmas tree, and they don't tell you anything about where the tree is, which is why we're using SPAN for them. The big box and tree stand, on the other hand, can be used to move or position the tree, which is why we're using DIV.

:::Meanwhile, HTML5 wants us to use <code><bigtreebox></code> <code><treestand></code> for the containers, and <code><ornaments></code>, <code><tinsel></code>, and <code><frosting></code> for the effects.

:::Does that make sense? [[User:Noëlle|Noëlle]] ([[User talk:Noëlle|talk]]) 12:14, 10 December 2012 (UTC)

While I'm thinking about it - DIV and SPAN remain very important tags in web development, because even though they're structural and not semantic, the fact remains that there isn't going to be a pre-defined semantic tag for everything you want to do, and not every browser supports making up your own tags (even though they're supposed to). Until HTML5 is finalized (which is currently projected to happen in 2016, if I'm remembering correctly) and everybody starts supporting arbitrary tag definitions (which may be "never"), DIV and SPAN will remain useful as generic "container"/"effect" tags. [[User:Noëlle|Noëlle]] ([[User talk:Noëlle|talk]]) 12:14, 10 December 2012 (UTC)

Talk:1144: Tags

2012-12-10T01:53:16Z

Noëlle:

1144: Tags

2012-12-10T01:47:18Z

Noëlle: /* Explanation */

{{comic
| number = 1144
| date = December 7, 2012
| title = Tags
| image = tags.png
| titletext = <A>: Like </a>this.&nbsp;
}}

==Explanation==
{{w|HTML}} is a markup language used in web development, and is the subject of this comic. The comic employs multiple poor HTML practices while asking the rhetorical question of how best to annoy web developers, effectively answering the question that it poses.

First, in HTML, all tags should be matched with both an open and close tag of the same type <code><div>Like this</div></code>. Previous to HTML 4.01 all tags were uppercase (technically elements were uppercase and attributes were lowercase "to improve readability" [http://www.w3.org/TR/1998/REC-html40-19980424/about.html#h-1.2.1]) to make it easier on the browser to parse what was markup and what was content on the page. As is the case with nearly every change to the HTML specification, many developers slowly got lazy and stopped making every tag uppercase forcing browser developers to check for both upper and lowercase as they parsed the markup. When the specification was bumped to XHTML 1.0 it stated that no one should use uppercase tags any more, everything should be lowercase.

Another basic idea of HTML is that all tags, or elements, must be properly nested. (Although they have slightly different meanings, the words "elements" and "tags" are generally used interchangeably.) That is, anything inside a div must be closed before the div is closed.

{| class="wikitable" |
! Correct
! Incorrect
|-
|
<div>
<ol>
<li>Correctly nested</li>
</ol>
</div>
|
<div>
<ol>
<li>Incorrectly nested</li>
</div>
</ol>
|-
|}

Further, web developers make a distinction between ''semantic'' and ''structural'' elements. Semantic elements contain a clue in their name as to what kind of an element they are - for example, an <code><article></code> tag contains an article, such as a blog post or news article, while an <code><ol></code> tag contains an '''o'''rdered '''l'''ist. (It's wise to note that this is not an absolute rule; it's ''possible'' to put non-article content in an <code><article></code>, it's just not recommended.) Semantic tags do not, however, indicate how their contents are to be displayed; your browser might display an <code><article></code> in the default font, layout, and placement, while mine, a [http://en.wikipedia.org/wiki/Screen_reader screen reader], might ignore everything on the page <code><article></code>s, and read <code><article></code>s in a soothing voice.

Structural tags, on the other hand, give no clues as to what they contain; they just indicate how a web page is to be laid out. <code><span></code> and <code><div></code> are structural tags; they can contain anything. Their definitions in HTML simply indicate that <code><div></code> is a block tag - it can affect both what the text looks like and where it is on the page; by default, it is displayed in a separate block from the rest of the text in the page, and has at least one line break before and after its display - and <code><span></code> is an inline tag - it affects what its text looks like, but not where it is on the page. Without additional attributes, it's impossible for a browser to tell what's supposed to be inside a <code><div></code> or a <code><span></code>, which means that my screen reader can't just pluck out the blog posts and read those.

Currently, the standard of usage is shifting toward using semantic tags over structural tags, since they provide more information to browsers and people reading the source code of web pages. HTML5, the most recent version of the standard web development markup language, is introducing many semantically meaningful tags that can be styled using [http://en.wikipedia.org/wiki/Cascading_Style_Sheets CSS] to follow the same behavior as a div or span, but that are easier to understand when reading the markup or parsing it with a non-standard browser.

The title text makes reference to <code>&nbsp;</code>, which is the {{w|HTML#Character and entity references|HTML escape code}} for {{w|non-breaking space}} which is a type of space that will keep two words together, and will not allow word wrapping to separate them. If the words come at the end of a displayed line, how this is handled depends on the browser and on the element's styling; some browsers and styles will force the connected words onto a new line, while others will "overflow" the edge of the container to accommodate the linked words. This is useful, for example, for keeping units with a number so it is easy to spot 100 km instead of needing to hunt for 100<br />km. Using a non-breaking space at the end of a line, without another word on its trailing end, is only useful in extremely rare and limited circumstances, and does not generally have a purpose.

The title text also uses an <code><A></code> tag, seemingly to indicate an answer. In fact, <code><A></code> is an anchor tag, which creates {{w|hyperlink}}s. It is not an answer tag. This tag is generally used with either the <code>href=</code> (which creates a link to another URL) or <code>name=</code> (which creates a named anchor on the page that can be linked to with <code>href=#</code>) attribute (but not generally both at once). In addition, the placement of <code><A></code> and <code><a></code> (the capitalization here is also irritating to a web developer who values consistency) indicates that ": Like " should be a link or named anchor, but "this." should not. Whether or not to include punctuation in an anchor is a matter of some debate among developers, but including excessive whitespace is generally frowned upon, and the anchor ''should'' include all of the relevant text.

==Transcript==
:<code><div>Q: How do you annoy a web developer?</span></code>

{{comic discussion}}

Talk:1144: Tags

2012-12-08T00:40:50Z

Noëlle:

Talk:1144: Tags

2012-12-08T00:39:39Z

Noëlle:

Talk:1144: Tags

2012-12-08T00:36:23Z

Noëlle: