Category Archives: Web pages

Flickr’s new HTML code embedding – how to remove the header and footer

Flickr has altered its default embed HTML to include a header and footer, which includes Flickr branding and the title of the picture.

PT in the Sense8 titles 01

Sometimes I suppose this is okay, but sometimes I just want the picture.

Fortunately it seems to be relatively easy to get rid of. In the example above:

<a data-flickr-embed="true" data-header="true" data-footer="true" href="https://www.flickr.com/photos/danielbowen/19038778583/in/dateposted/" title="PT in the Sense8 titles 01"><img src="https://farm1.staticflickr.com/313/19038778583_3149e7e01a.jpg" width="500" height="282" alt="PT in the Sense8 titles 01"></a><script async src="//embedr.flickr.com/assets/client-code.js" charset="utf-8"></script>

…remove the data-flickr-embed, data-header, and data-footer attributes of the a href, and remove the script tags, like this:

<a href="https://www.flickr.com/photos/danielbowen/19038778583/in/dateposted/" title="PT in the Sense8 titles 01"><img src="https://farm1.staticflickr.com/313/19038778583_3149e7e01a.jpg" width="500" height="282" alt="PT in the Sense8 titles 01"></a>

The result should be just the photo, with the usual linking back to Flickr.

PT in the Sense8 titles 01

It’d be nice if they made this a built-in option when generating the HTML code.

Of course, it also makes me ponder if I should be finding another photo host.

Update 2015-07-20: They seem to have modified their default embedding code a bit so the branding and picture details now only appear over the photo when you mouse over it. Not so objectionable.

PT in the Sense8 titles 01

Flickr’s modified code now excludes data-header="true" data-footer="true" which presumably added the header and footer.

Unhelpful web help

Just… just… wrong. So wrong.

FlickrHelp
Firstly, note the error message “Enter a valid email addresss”. Where, pray tell, ought I do this?  Why do I need to upload any attachment again?  Why do I have to prove I’m a human time-after-time, when all I’m doing is wrestling with your completely broken attempt at a web form?

Have they noticed that no-one is submitting help requests via this form, what with its refusal to accept said requests?

Dear Flickr: stop sucking balls.

Getting Excel data into a plain HTML table

I’d been looking for something like this for ages, but must have been Googling the wrong terms.

How to get the contents of an Excel spreadsheet into a simple, no-format, plain HTML table:

No-Cruft Excel to HTML Table Converter

Genius.

Allow more JavaScript, maintain privacy

I’ve long regarded JavaScript in the browser to be one of the biggest security holes in web-browsing, and at the same time the Internet works less and less well without it. In 2008 Joel Spolsky made the observation that for some people the Internet is just broken:

Spolsky:   Does anybody really turn off JavaScript nowadays, and like successfully surf the Internets?

Atwood:   Yeah, I was going through my blog…

Spolsky:   It seems like half of all sites would be broken.

Which is not wrong.  Things have changed in the last five years, and now the Internet is even more broken if you’re not willing to do whatever random things the site you’re looking at tells you to, and whatever other random sites that site links off to tell you to, plus whatever their JavaScript in turn tells you to. This bugs me because it marginalizes the vulnerable (the visually impaired, specifically), and is also a gaping security hole.  And the performance drain!

Normally I rock with JavaScript disabling tools and part of my tin-foil-hat approach to the Internet, but I’m now seeing that the Internet is increasingly dependent on fat clients. I’ve seen blogging sites that come up empty, because they can’t lay out their content without client-side scripting and refuse to fall back gracefully.

So, I need finer granularity of control.  Part one is RequestPolicy for FireFox, similar to which (but not as fine-grained) is Cross-Domain Request Filter for Chrome.

The extensive tracking performed by Google, Facebook, Twitter et al gives me the willys. These particular organisations can be blocked by ShareMeNot, but the galling thing is that the ShareMeNot download page demands JavaScript to display a screenshot and a clickable graphical button – which could easily been implemented as an image with a href. What the hell is wrong with kids these days?

Anyway, here’s the base configuration for my browsers these days:

FireFox Chrome Reason
HTTPSEverywhere HTTPSEverywhere Avoid inadvertent privacy leakage
Self Destructing Cookies “Third party cookies and site data” is blocked via the browser’s Settings, manual approval of individual third party cookies. Avoid tracking; StackOverflow (for example) completely breaks without cookies
RequestPolicy Cross-Domain Request Filter for Chrome Browser security and performance, avoid tracking
NoScript NotScripts Browser security and performance, avoid tracking
AdBlock Edge Adblock Plus Ad blocking
DoNotTrackMe DoNotTrackMe Avoid tracking – use social media when you want, not all the time
Firegloves (no longer available), could replace with Blender or Blend In I’ve have had layout issues when using Firegloves and couldn’t turn it off site-by-site

Convert an Access table to a Wiki table

Copy/paste entire table or query into Notepad++

Replace newlines: \n
with: \n|-\n|.

Then replace tabs: \t
with: \n|.

(In the above two replaces, period = space)

You should end up with a structure like this:

|-
| data line 1, value 1
| data line 1, value 2
|-
| data line 2, value 1
| data line 2, value 2

Then you need to add the table header to the top – in this case I’ve gone for sortable columns:

{| class=”wikitable sortable”
|-
! scope=”col” | Value 1
! scope=”col” | Value 2

…and the footer for the bottom:

|}

That should be about it.

More info on Wiki tables

Remote server frustration

I can understand the principle of locking down web browsers on server machines, but there should at least be a straightforward way of overriding it.

The other week we were connected to a remote server trying to debug some ASPX code. That’s remote as in: on another continent, and not using the fastest connection. (It was designed to be fast for a remote population of users, not us.)

A good way to debug the code without switching on debug errors for everybody is to RDP onto the box and browse it from there.

This didn’t work because, despite Windows 2008 IE ESC (Internet Explorer Enhanced Security Configuration) not being enabled, it was blocking cookies, and every option I could find to try and turn it back on was either disabled, or did nothing.

‘Cos you know, browsing localhost (which has your own code on it ferchrissake) is a terrible security risk. Sigh.

In a rush to resolve it, we eventually resorted to downloading and installing Firefox on the machine. (I love Chrome, but its automatic updates and things scare me slightly; probably not good for a server. Some day I’ll dig around and figure out if it can be turned off. Come to think of it I should make sure FF doesn’t do the same thing.)

Firefox brought its own problems. Straight after installation, it decided to load up some hideously slow (on this less than ideal link) page with video. No, actually, two pages — using two tabs — and despite it proclaiming how fast and responsive it is, wouldn’t respond. Blargh. Thanks a bundle, Mozilla.

It must have taken a minute or more to come back — a long frustrating time when you’re in a hurry.

This solution did, however, work — we could finally see the debug messages, thank goodness.

Is there an official way of getting IE to behave itself?

Census night is coming

The census delivery chick turned up and offered us the option of paper or electronic form.

Two programmers looked at each other, thought about how they value their time and the response was a no-brainer:

“We’re programmers,” I explained, “we’ll take the paper form.”

“There’s a phone number you can call if you have any trouble filling out the electronic form” reassures the collector.

Cathy thinks: “Sure, that line won’t have any trouble when twenty million Australians simultaneously log into the web site to fill in the forms via a broken SSL link, using IE specific controls (that only work under some versions Windows assuming they’re correctly patched and have the right libraries loaded), demanding full round-trips to the underspec’d Windows servers to populate unnecessarily complex custom controls, some of which will no doubt demand Flash or COM. Come to think of it, it probably won’t even be web based, and we’ve only got two Windows boxes, one of which is tucked under a table (Yay! Census night on the floor swearing at the ABS’s programmers!) and the other has a screen resolution that went out with buggy whips (I’ve had programs barf and refuse to run because the resolution was unacceptable).”

We chose paper. For another view of the world, I’m looking forward hearing to how census night worked for Daniel…

Is Django MVC doing it wrong?

I’ve just starting fooling around with Django (a Python web framework), and was looking to produce a form. Bear in mind that Django doesn’t really do MVC, but follows the philosophy – separation of logic, representation and appearance:

class BookForm(forms.Form):
    title = forms.CharField()

def BookView(request):
    form = BookForm()
    return render_to_response('book.html', {'form': form})

With boot.html containing (amongst other things):

<form action="" method="get">
{{ form.as_table }}
<input type="submit" value="Search" />
</form>

Which is great! MVC, separation of data, presentation and business logic. Now, how do you get a CSS class onto that title field? CSS, being the way of separating out the presentation part of a HTML page from the data that’s embedded in it? As above, but chuck it in as such:

class BookForm(forms.Form):
    title = forms.CharField(
        widget=forms.TextInput(attrs={'class':'title-field'}))

Seeing this crunched the gearbox in my mind. All that messy designer stuff, where they make things look nice, that’s worming it’s way into my business logic? Perhaps it’s not so wrong, as the business logic does indeed know that this is a title-field. But it doesn’t quite sit right with me. I’m not convinced it’s wrong, but if you were, you could instead do this in your CSS and HTML:

<style>
.title-field input {background:#ccC68f;}
</style>
<form action="" method="get">
<table>
<tr><td class="title-field"> {{ form.title }} </td></tr>
</table>
<input type="submit" value="Search" />
</form>

Which pretty much forces you to individually place fields — you get to specify the order of fields plus their individual CSS classes.

I’m not sure what the answer is here. Anyone care to enlighten this noob? Bear in mind that there’s a thing to magically tie a model to a form meaning you don’t even need to specify the fields in both the form and model, which you can’t use if you start tossing styles into each field.

Pressing a button does not demand JavaScript

The state of software produced by web developers is highly variable.  The things the good programmers can do is little short of astonishing, as it always has been with limited environments.  But the bad programmers…

Fifteen years ago I did a Microsoft certification thingy, and now they want me to do a satisfaction survey on it – for no compensation.  I think not.  But I notice an unsubscribe link at the bottom of the email, so I follow it: http://www.mailingsvcs.com/optout.aspx?type=email&optout=1&service=1&networkid=9001&id=josh@example.com&pid=p53457652, see the Submit button, click on it… and nothing happens.  And then I realise – it needs JavaScript to press.  A button, one of those things right at the heart of HTML 2.0.  What is this, amateur hour?  Turns out, yes it is because if you follow the hacked URL above — which if filled with bogus data — and click on the Submit data, the back end proceeds happily without validating any of the data, and asks you another question before confirming that it’s done:

We’re sorry you no longer want to receive e-mails from us. Please allow one week for us to process this request, during which time you may still receive e-mails from us. We apologize for any inconvenience.
To help us improve our service, please tell us the primary reason why you no longer wish to receive our messages:

There appears to be some kind of problem with their computers.  Last time I checked, the time it takes a computer to remove a record from a database is in the vicinity of “I’m already finished”, not one week.

I’m of the opinion that people who construct software ought to be required to put their name on it in a visible way, so they can go on my list of people to smack in the face when I meet them.  It’s for the best.

Chrome doesn’t sandbox the CPU; Goggle docs waits really hard

Chrome doesn’t attempt to sandbox CPU consumption. I just closed an inactive Google docs spreadsheet, and saw CPU fall from pegged-at-100% to bubbling along at 10%.

Does it really need each available CPU cycle to wait for the other end to do something? Apparently so, in the way it’s coded.

Google: not as clever as the press release makes out.

HTML5test.com

Less crazy than the Acid Tests is www.html5test.com

Here’s what I get from a few random browsers I have lying around the place:

Firefox 3.5.9 scores 100 out of 160.

Chrome 4.1 scores 118 out of 160.

IE6? 11 out of 160.

IE8? Surprisingly, only 19 out of 160.

The browser on my Nokia N95 phone doesn’t load the page properly; it just says “Working…” and 0 out of 4 (eg it stalls on the first round of tests).

Interestingly, I also tried IE6 with the Google Chrome Frame in it; it scored 137 out of 160, better than Chrome itself. Weird.

Obviously all the browser authors have a way to go to support this if it’s going to be the bold new standard on the web.

(Found via Andrew)