Slashdot Mirror

← Back to Stories (view on slashdot.org)

Deconstructing Blogger Beta's HTML

Posted by ryuzaki0 on from the hello-world-in-html dept.

Scott Wilkinson writes, "Google's Blogger is going through a major revamp, called Blogger Beta, with lots of nifty new graphical layout features and pesky bugs to annoy the users. Yesterday they finally opened up the HTML code behind the Beta, and it's a significant departure from the traditional Blogger. This post at Banana Stew deconstructs the Blogger Beta code and points out some nice new features like if-then, loops, and object-oriented structures."

59 comments

  1. Concentrate on their own site... by LiquidCoooled · · Score: 1

    ...before they rip apart others.

    The table and layout they are using makes the right hand side menu completely overlap the actual table and content (on my system at least - std firefox 1.5 on xp).

    Stupid stupid stupid.

    --
    liqbase :: faster than paper
    1. Re:Concentrate on their own site... by phulegart · · Score: 1

      then fix it and send it back to google.

      --
      "I love deadlines. I love the whooshing sound they make as they fly by." -D. Adams
    2. Re:Concentrate on their own site... by turbodog42 · · Score: 1

      You're absolutely right. I couldn't read the tiny font size they chose and increasing text size in FF just mushes those narrow columns into incomprehensibility.

    3. Re:Concentrate on their own site... by BananaStewGuy · · Score: 1

      Guys, it's just a sandbox for playing around. Get your panties out of their wadness.

      However, I will agree that this particular post wasn't very well suited to the current incaranation of the blog format. It's a Blogger Blog - and a small side project - so there's not a lot of room to play with.

      If you are actually interested in the content (as opposed to just interested in being snarky), there's a plain-jane version now up at http://www.wilkinsons.com/Bananna/BetaCodeLargeTyp e.htm.

      I plan to move the post to another forum soon so that others can bask in the abuse. Meanwhile, I'm enjoying watching the counter spin.

      P.S. Ripping apart others? You sure you're reading the same blog I am?

    4. Re:Concentrate on their own site... by keitosama · · Score: 1

      He was talking about TFA, not Blogger.

    5. Re:Concentrate on their own site... by LiquidCoooled · · Score: 1

      Thanks for posting the cleaned up version, now I can read it and now it makes for a very interesting breakdown.
      The original version as just a mishmash and I couldnt see anything, so to answer your final remark no I wasn't.
      As for ripping apart thats technically what you were doing, ripping the entire template apart.

      --
      liqbase :: faster than paper
  2. If-Then-Else by colonslashslash · · Score: 5, Funny

    Whoa.... if-then-else loops!? Truely, a marvellous new feature from Google that will revolutionise the intertubes. What an awesome age of technological advancement we live in!

    --
    She's built like a steak house, but she handles like a bistro....
    1. Re:If-Then-Else by Anonymous Coward · · Score: 0
      if-then COMMA loops

      But I get your point.. if-then and loops in HTML is pretty impressive.. lucky they "opened" it because the HTML was like totaly hidden to my browser.. the wonders of the intarweb!.. :P

    2. Re:If-Then-Else by bananaguyc · · Score: 1

      If-then-else loops in HTML code, no less!!! L33t!!!!

    3. Re:If-Then-Else by smittyoneeach · · Score: 1

      With a GOTO, would it not be Turing Complete?

      From there, it's a tiny stretch to Emacs.

      Soon, the Emacs psychologist will blog-tastically analyze itself!

      Will it come out metro-sexual swinging, or come out neo-con swinging?

      Stay tuned.

      --
      Get thee glass eyes, and, like a scurvy politician, seem to see things thou dost not.--King Lear
    4. Re:If-Then-Else by CastrTroy · · Score: 2, Interesting

      Does this remind anybody else of ColdFusion? (the language)

      --

      Anthropic principle: We see the universe the way it is because if it were different we would not be here to see it.
    5. Re:If-Then-Else by SuperBanana · · Score: 4, Funny

      Whoa.... if-then-else loops!? Truely, a marvellous new feature from Google that will revolutionise the intertubes

      I beg to differ; it's perfect for the blogging crowd.

      IF $mood == "angsty" THEN display(AngryKittenGIF), SetBackground(Black)

      --
      Please help metamoderate.
    6. Re:If-Then-Else by xENoLocO · · Score: 5, Funny

      Why bother to run a conditional against a public static final?

      --
      "The need to build the internet comes from something inside us, something programmed... something we can't resist."
    7. Re:If-Then-Else by AngusL · · Score: 1

      Of course, any decent compiler would optimise that away to a NOP. ;)

    8. Re:If-Then-Else by Americano · · Score: 3, Funny
      The problem is, the blogging crowd doesn't NEED "if-then-else" loops:
      $site_name = "Black Icicles In My Heart";
      $mood = "angsty";

      SetBackground(BlackWithSilverRosesAndLightning);
      display(AngryKittenJPG);
      display(SunnyDayRealEstateJPG);
      display(JimmyEatWorldJPG);
      display(DeathCabForCutieJPG);
      printBlog("Sigh. My parents just don't understand me, and how hard it is to be young today! Sometimes I think only MTV gets me.");
      See, there's not a SINGLE conditional everywhere... they're unconditionally angsty. :)
    9. Re:If-Then-Else by SuperRob · · Score: 1

      I'm a ColdFusion dev from way back, and it only reminds me of ColdFusion in that they are doing a couple of things similarly. Similar in that it would be the most logical, intuitive way to accomplish the task. Other than that, it's nothing like ColdFusion.

    10. Re:If-Then-Else by araemo · · Score: 1

      You had me going until you mentioned MTV.

      I don't think MTV "Gets" anyone, let alone people who watch TV. ;)

    11. Re:If-Then-Else by Andrew+Kismet · · Score: 1

      :s/MTV/MTV2/g

    12. Re:If-Then-Else by Americano · · Score: 1

      Sorry, my emo-coding skills are rusty... I should have included a YouTube link to my favorite emo video, and just left it at "My parents just don't understand me."

  3. My Eyes!!! by Anonymous Coward · · Score: 3, Interesting

    The page layout made that article was completely unreadable. I was about to turn off CSS when I realized that the article is basically a huge table of non-tabular information. What a waste of time.

    1. Re:My Eyes!!! by Aladrin · · Score: 1

      Well, except that it isn't an article, it's a blog entry, and that they weren't intending for it to be generalized info for the masses, yeah. It's unreadable.

      But given that it's just an attempt to describe the new layout of a blog entry, and that the 'non-tabular' info you hate so much IS the entire article, I'd say it's fine.

      The reason it's in a table is to keep information together. He could have attempted to CSS it, and make it nearly impossible to line up correctly in every browser, but instead used tables as they were meant to be used. For data that needs to be kept aligned. Imagine that.

      --
      "If you make people think they're thinking, they'll love you; But if you really make them think, they'll hate you." - DM
    2. Re:My Eyes!!! by Anonymous Coward · · Score: 0

      What's non-tabular about it? He has one column for the code snippet, and another for the description of said snippet.

    3. Re:My Eyes!!! by Tremor+(APi) · · Score: 1

      That's not "how tables are meant to be used". They're meant to be used for tabular data. Hence the name. Personally, I put text documents in a word processor, not in a spreadsheet, because the word processor has all the functionality I need to properly format and style my documents. Same exact concept.

      I've never had problems getting pure-CSS documents to align properly in IE and FireFox, which make up the vast majority of internet users. I use tables for displaying rows and columns of tabular data. I use divs for marking up blocks of content, and spans for marking up spans of content, and CSS for layout and styling. Go figure - using markup for markup, and stylesheets for styling. What a concept.

      See http://www.csszengarden.com/ for a little re-education on CSS.

      --
      [Z?]
    4. Re:My Eyes!!! by Khuffie · · Score: 2, Insightful

      CSS is all good and well, and I do my best to make my designs fully CSS, but at times, it's just far, far easier to use a table than to spend hours putting in hackneyed CSS code that won't be 'valid' in the end just to get a simple thing done.

    5. Re:My Eyes!!! by BananaStewGuy · · Score: 1

      The table was a nice, fast way to keep things aligned as I was going through the template. Pick a snippet, paste it in a cell, write pithy little comments on the other side so that I can remember what that snippet was doing. Repeat until eyes blur.

      Remember, this was done for my benefit and posted only in the thought that others might find it useful.

      Here's a larger version, pre-enlarged for geriatric eyes. Enjoy at your leisure.

      PS Much love to the gracious anonymous defenders.

  4. Deconstructing? by uncl_bob · · Score: 1

    Be sure to call Jacques Derrida about this first!!

  5. Hrm. by TubeSteak · · Score: 0, Redundant

    I'm not impressed with this Banana Stew character.

    "I'm not personally familiar with <dl>, <dt>, and <dd>, but I'm guessing that those are standard html tags."

    Even though it's been part of /.'s allowed html, I never bothered to look it up till now. About 5 seconds of searching showed me what the tags are about.

    DL = Definition lists
    DT = Definition term
    DD = Definition description

    It's just a quick way of creating lists without the bullet points.

    --
    [Fuck Beta]
    o0t!
    1. Re:Hrm. by Anonymous Coward · · Score: 1, Insightful

      Thats incorrect, the visual rendering of a definition lists depends on the UA. While generally the definition is indented and the term is bold this is not a requirement as per the specification. http://www.w3.org/TR/html4/struct/lists.html

      Yes, definition lists don't have bullets, but there's a greater difference you're missing. A UL has no order, it doesn't matter what order the items are read in, they mean the same thing. An OL is the oposite, the order matters. A DL is very different from both of them, it is a list of terms and their corresponding definitons.

    2. Re:Hrm. by Anonymous Coward · · Score: 0

      "It's just a quick way of creating lists without the bullet points."

      No, it isn't. Read the description of the tags - "Definition ...". That's right, they're used generally to define things, or similar, e.g.;

      <dl>
      <dt>Slashdot</dt>
      <dd>A Web site where the news stories are posted so that the site's users can post (usually) ill-informed comments about the content (obviously without reading the article).</dd>
      </dl>

      Or perhaps;

      <dl>
      <dt>The Simpsons</dt>
      <dd>A cartoon by some guy about some family that do things.</dd>
      <dt>Futurama</dt>
      <dd>Another cartoon, by the same guy as above, about different things.</dd>
      </dl>

      etc.

    3. Re:Hrm. by BananaStewGuy · · Score: 1

      Alas, I have not impressed you. My life and wellbeing are for naught. Goodbye cruel world.

      Or maybe not.

      In any case, thanks for doing the lookups for me. I'll be sure to plagiarize your conclusions in a later update to the post.

  6. Not really too interesting if you RTA by x3nos · · Score: 5, Interesting
    1. Beta has been out for awhile . . . missed the scoop - too little too late IMO
    2. How pointless is it to comment on commented code?
    3. Author of TA didnt really get into a lot of the features like Labels, modifiable templates from an AJAX control, blah blah
    4. For once I actually did RTA and I think Ill go back to just making flippant comments about comments
    Now about Beta - my big gripe is the continued lack of xhtml compliance on the part of the blogger developers. I go through the extra 5% effort it takes to ensure my code validates. It makes things easier on the end user, and its just good best practices. Despite several years of complaints by bloggers, they [Google] have yet to enforce compliance with their blogger product.
    --
    /* somewhat functional - fix later */
    1. Re:Not really too interesting if you RTA by mizhi · · Score: 1

      You see this with a lot of content management systems. I usually spend the first 30-45 minutes on a new layout by making it xhtml strict. One of the advantages of good CMS is the ability to edit the templates so that you can make this happen; the difference tends to be in the degree of ease. With Movabletype, it's a snap to get the page to validate. With something like PHPBB, it's pure agony. That's my opinion, so YMMV.

      I wish developers would take the extra effort to make sure their code is correct and properly uses elements for their intended purposes.

      --
      Humorless sig goes here.
    2. Re:Not really too interesting if you RTA by nursegirl · · Score: 4, Interesting

      What particularly drivs me batty is that they just hired Douglas Bowman as Visual Design Lead in May. He's been at the head of the XHTML/CSS progression/revolution for years, including the Wired News redesign in 2002.

      I understand that it takes some time to get settled into a new workforce, so Bowman might not have had the time to get around to working on Blogger that much yet. According to his blog, he appears to have spent the first half of this year working as a contractor on Google Calendar. I just wonder, why wouldn't the Blogger team have waited until their Design guy/standards-compliance guru was free before rolling out this beta?

    3. Re:Not really too interesting if you RTA by Anonymous Coward · · Score: 0

      actually, author is a shithead :

      It's nice that the folks at Blogger are worried about text browsers, but how many text browsers are still out there and do I really care if they read my blog?

  7. Feeds need more work by Henry+V+.009 · · Score: 3, Interesting

    They still haven't gotten the site-wide comment feed working yet. You can turn it on in the Blogger controls, but no link for it is provided anywhere. You have to guess the url from the post feed and the individual post comment feed.

    Even after that, I found that it only lists the first 25 comments ever made to my blog. This makes a recent comments sidebar hard.

    Whether this will ever get fixed, I don't know. Google uses "beta" to mean "released" for all their software and the practice sucks. I have the feeling that a lot of their free "beta" software will one day become non-free, and they will only at that point "release" it.

  8. Gotta keep up with the Jones' by dilweed · · Score: 1

    In this case, that would be MySpace Jones.

  9. But.. by wwiiol_toofless · · Score: 1

    Does it run myspace?

    --
    the mods may say you posted flamebait, but to me it's a flame that warms my heart. rock on, brother! --chebucto
  10. Blogger Tags by klenwell · · Score: 1

    Is this the end then of Blogger's proprietary <$TAG$> markup? And just when I started getting the hang of it.

    First they deprecate <font>. Now this. What's next? Myspace formatting its profile pages with no more than three layers of nested tables?

    --
    Innovation makes enemies of all those who prospered under the old regime... -- Machiavelli
  11. One problem... by Andrew+Nagy · · Score: 4, Informative

    The new blogger beta doesn't allow you to host the blog on your own site anymore....

    --
    Yes, you can dance to Radiohead.
    1. Re:One problem... by SuperRob · · Score: 2, Informative

      That's untrue. Blogger will still allow FTP posting to off-site servers, but many of the new features will not work as a result. Google stated that they were committed to continuing FTP posting

    2. Re:One problem... by Andrew+Nagy · · Score: 1

      No, what I said was not untrue. What I said was that the beta blogger will not allow FTP posting... as in, you can keep regular blogger, but if you want to upgrade to beta, you can't host off-site. It's all right there in the link I provided... which is why I provided it.

      --
      Yes, you can dance to Radiohead.
  12. View Source by Nom+du+Keyboard · · Score: 2, Insightful

    Opened up the HTML code behind it? Just how hard is it to View Source?

    --
    "It's the height of ridiculousness to say for those 9 lines you get hundreds of millions."
    1. Re:View Source by Anonymous Coward · · Score: 0

      it can be pretty hard to view the source of the template page generator (xml, btw) from the html output, you know.

  13. No by WebHostingGuy · · Score: 1

    Google doesn't own it . . . yet.

    --
    Quality Hosting e3 Servers
  14. HTML is NOT code by Anonymous Coward · · Score: 0

    HTML is a markup language. All this loop, if/else stuff is NOT HTML.

    What's next? Someone that selects a different color scheme on their computer is a programmer?

  15. When Google comes out of Beta by ribuck · · Score: 1

    I have the feeling that a lot of their free "beta" software will one day become non-free, and they will only at that point "release" it.

    You may have something there. The Google Answers service came out of Beta on the same day that it started running ads. Coincidence?

    --
    Paid Q&A/Research
  16. Amazing! by Peganthyrus · · Score: 2, Funny

    Blogger has a templating language now! How terribly newsworthy.

    It's not like any blog system before this ever had conditionals!

    Bonus points to the article for putting a table in monospaced Flyspeck 3 and having it in the middle of a design that completely breaks when you bump up the text size.

    --
    egypt urnash minimal art.
  17. Deconstructing Blogger Beta's _Template Language_ by adnonsense · · Score: 2, Insightful

    Reading the Slashdot summary it sounds like Blogger has introduced a new sort of HTML. One with if-then, loops, and object-oriented structures. Ferchrissake, when people tell me they can "program in HTML" I ask them to write a for-loop for me... it's Blogger's new template language TFA's talking about here.

  18. ... and hopfully ... by John+Bokma · · Score: 1

    They stopped eval and document.location JavaScript abuse. Or is that just limited to Blogspot? See: http://johnbokma.com/mexit/2006/07/13/

    --

    Perl Programmer for hire
  19. Is this news? by Anonymous Coward · · Score: 0

    Is this news?

    OMFG, some guy at Google farted. And another guy took his picture, come see it in my blog!!1!ONE!1! .+.Whatever.+.

  20. Re:Deconstructing Blogger Beta's _Template Languag by Anonymous Coward · · Score: 0

    Thank you! I was reading the comments and wondering when someone was going to point that out.

    I was trying to figure out how Blogger made HTML do more than markup!

  21. Re:Check out Google's wrongdoing by Anonymous Coward · · Score: 0

    I notice you're not adverse to using Google Ads on your page however. How hypocritical to lambast an organisation yet still use them.

  22. me too by Anonymous Coward · · Score: 0

    I also hate it. The site is a stinky pile of poo and deserves to DIE DIE DIE!!!

  23. it is by rice_burners_suck · · Score: 1

    The aforementioned HTML is somewhat well written, I have to admit.

  24. In other words, ColdFusion by Tablizer · · Score: 1

    and points out some nice new features like if-then, loops, and object-oriented structures.

    Coldfusion has those in their XML/HTML extensions. (Well, except for full OOP, which some of us feel is not well-suited for web stuff and biz apps anyhow.) One can develop their own tags in ColdFusion, although I find that old-fashioned functions are usually easier to set up and manage.

    --
    Table-ized A.I.