rel="external" werkt niet met embedded google maps

dinsdag 6 december 2011 13:40

Acties:

0 Henk 'm!

Running on Ubuntu

Topicstarter

Hallo,

Ik zit hier met een raar probleem.
Op mijn site gebruik ik voor externe links altijd de rel="external" in combinatie met een stukje javascript:

JavaScript:

function externalLinks() {
if (!document.getElementsByTagName) return;
var anchors = document.getElementsByTagName("a");
for (var i=0; i<anchors.length; i++) {
var anchor = anchors[i];
if (anchor.getAttribute("href") &&
anchor.getAttribute("rel") == "external")
anchor.target = "_blank";
}
}
window.onload = externalLinks;

Dit werkt prima met zowat alle pagina's, alleen op 1 pagina waar ik ook een embedded google maps iframe inlaad werkt dit niet. Als ik met firebug ga kijken dan zie ik dat er zowel rel="external" als target="_blank" geladen wordt. De target="_blank" wordt zowel bij mijn eigen links toegevoegd?? als bij "Klik voor een grotere kaart". Ik neem aan dat dit via de google code geladen wordt. Als ik de google code uit-commentariseer dan werkt de rel="external" weer zoals ik het verwacht.

Nu heb ik intussen ook al geprobeerd om op die pagina de rel="external" tags weg te halen zodat externe links alleen nog target="_blank" ingeladen wordt, maar nog steeds hetzelfde probleem. De externe link wordt dus in dezelfde tab geladen.

Ik heb al op diverse fora en de documentatie van google maps doorgenomen, maar tot nu toe geen oplossing voor dit probleem kunnen vinden. Iemand die dit probleem al eens heeft meegemaakt? Oplossingen voor gevonden?

De meest vieze oplossing zou zijn om gewoon een plaatje te laden ipv het iframe, maar dan mis je wel meteen de functionaliteit die GMaps bied binnen het iframe.

Verder dacht ik of het misschien mogelijk is om de target="_blank" op een of ander manier te blokkeren.

Het rare is overigens dat dit tot voor kort prima werkte. Is aan de kant van GMaps wat gewijzigd?

Statistieken zijn als bikini's: wat ze tonen is erg suggestief, wat ze niet tonen is essentieel

dinsdag 6 december 2011 13:53

Acties:

0 Henk 'm!

OkkE

CSS influencer :+

Sorry, maar het is voor mij een beetje onduidelijk verhaal.

Je hebt een GoogleMaps kaartje in een <iframe> en je hebt een Javascript in je website dat alle rel=external links voorziet van een extra target=_blank, klopt? En het probleem is, je GoogleMaps links openen niet in een nieuw scherm/tab?

Dat kan kloppen, aangezien een <iframe> op zichzelf staat en niet van het bestaan van je Javascript weet, zolang je die niet óók in die frame/pagina include.

Is er een ander probleem: Misschien kan je een simpele, uitgeklede test-case online zetten?

“The best way to get the right answer on the Internet is not to ask a question, it's to post the wrong answer.”
QA Engineer walks into a bar. Orders a beer. Orders 0 beers. Orders 999999999 beers. Orders a lizard. Orders -1 beers.

dinsdag 6 december 2011 14:29

Acties:

0 Henk 'm!

arie_papa

Running on Ubuntu

Topicstarter

Hoi Okke,

Nee, dat is het probleem niet.
Ik zal het proberen duidelijker uit te leggen.
Op mijn site heb ik alle externe links voorzien van een rel="external" die ervoor zorgt dat de betreffende link netjes in een nieuw tab geladen worden doordat het stukje javascript dan aangeroepen wordt.
Dit werkt prima.
Echter nu werkt op 1 pagina dit mechanisme niet. Op deze pagina heb ik een GMaps ge-embed. Als ik de ge-embedde GMaps uitschakel werkt het rel="external" prima.

Testcase

Werkt niet

HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

    <title>Test</title>
    <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" /> 
    <meta http-equiv="content-type" content="text/html;charset=utf-8"/>
    
<script type="text/javascript" src="external.js"></script>

</head>

<body>

<h1>Contactgegevens</h1>
        <p>Vormgeving</p>
        <p>Populierstraat</p>
        <p>TEGELEN</p>
        <p>06-12345678</p>
        <p><a rel="external" href="http://www.google.nl">Google</a></p> 
        


<iframe width="425" height="350" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="http://maps.google.nl/maps/ms?hl=nl&amp;ie=UTF8&amp;msa=0&amp;msid=210503629985026016272.0004a0e17ea76c26c9d2f&amp;ll=51.343854,6.15258&amp;spn=0.006809,0.017295&amp;t=h&amp;output=embed"></iframe><br /><small>
<a rel="external" href="http://maps.google.nl/maps/ms?hl=nl&amp;ie=UTF8&amp;msa=0&amp;msid=210503629985026016272.0004a0e17ea76c26c9d2f&amp;ll=51.343854,6.15258&amp;spn=0.006809,0.017295&amp;t=h&amp;source=embed">Grotere kaart weergeven</a></small> 
</body>
</html>

Werkt wel

HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

    <title>Test</title>
    <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" /> 
    <meta http-equiv="content-type" content="text/html;charset=utf-8"/>
    
<script type="text/javascript" src="external.js"></script>

</head>

<body>

<h1>Contactgegevens</h1>
        <p>Vormgeving</p>
        <p>Populierstraat</p>
        <p>TEGELEN</p>
        <p>06-12345678</p>
        <p><a rel="external" href="http://www.google.nl">Google</a></p> 


<!--<iframe width="425" height="350" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="http://maps.google.nl/maps/ms?hl=nl&amp;ie=UTF8&amp;msa=0&amp;msid=210503629985026016272.0004a0e17ea76c26c9d2f&amp;ll=51.343854,6.15258&amp;spn=0.006809,0.017295&amp;t=h&amp;output=embed"></iframe><br />--><small>
<a rel="external" href="http://maps.google.nl/maps/ms?hl=nl&amp;ie=UTF8&amp;msa=0&amp;msid=210503629985026016272.0004a0e17ea76c26c9d2f&amp;ll=51.343854,6.15258&amp;spn=0.006809,0.017295&amp;t=h&amp;source=embed">Grotere kaart weergeven</a></small>

</body>
</html>

JavaScript:

function externalLinks() {
if (!document.getElementsByTagName) return;
var anchors = document.getElementsByTagName("a");
for (var i=0; i<anchors.length; i++) {
var anchor = anchors[i];
if (anchor.getAttribute("href") &&
anchor.getAttribute("rel") == "external")
anchor.target = "_blank";
}
}
window.onload = externalLinks;

[ Voor 68% gewijzigd door arie_papa op 06-12-2011 18:26 . Reden: Link weggehaald en voorbeeldcode hier gezet ]

Statistieken zijn als bikini's: wat ze tonen is erg suggestief, wat ze niet tonen is essentieel

dinsdag 6 december 2011 14:34

Acties:

0 Henk 'm!

OkkE

CSS influencer :+

Dat zal komen door dat je GoogleMaps een Javascript error veroorzaakt, daar door wordt het script voor je target waarschijnlijk niet meer uitgevoerd.

Unsafe JavaScript attempt to access frame with URL http://www.sjiekedingen.nl/test/index.html from frame with URL http://maps.google.nl/map...0.017295&t=h&output=embed. Domains, protocols and ports must match.

“The best way to get the right answer on the Internet is not to ask a question, it's to post the wrong answer.”
QA Engineer walks into a bar. Orders a beer. Orders 0 beers. Orders 999999999 beers. Orders a lizard. Orders -1 beers.

dinsdag 6 december 2011 15:02

Acties:

0 Henk 'm!

arie_papa

Running on Ubuntu

Topicstarter

Ah, duidelijk.
Blijkbaar een bug die al medio mei 2010 gemeld is!!
Ik zal eens zoeken of er workarounds voor zijn, anders wordt het denk ik helaas zelf een plaatje inladen

Mocht ik wat vinden zal ik het zeker posten hier.

Statistieken zijn als bikini's: wat ze tonen is erg suggestief, wat ze niet tonen is essentieel

dinsdag 6 december 2011 16:39

Acties:

0 Henk 'm!

Bosmonster

*zucht*

target="_blank" vervangen door rel="external" + javascript is dikke onzin, laat dan gewoon die target="_blank" staan

De reden dat target/_blank deprecated is, is omdat het niet toegestaan is voor de pagina om controle uit te oefenen op de browser. Hier omheen gaan werken met javascript lost dus helemaal NIKS op.

De enige reden om dit te doen is om je pagina xhtml-valid te krijgen, maar als dat je doel is, snap je het idee achter bovenstaande niet. Dan valideer je fijn, maar voldoe je nog niet aan de regels en boeit die validatie ook niet meer. Pak dan gewoon een html5 doctype en zet je oogkleppen weer op.

dinsdag 6 december 2011 18:19

Acties:

0 Henk 'm!

arie_papa

Running on Ubuntu

Topicstarter

@Bosmonster

Ik kan je eigenlijk niet meer dan gelijk geven. Echte makkelijke oplossingen, buiten wat jij voorstelt, zijn er niet. Mijn external script wordt gewoon niet uitgevoerd doordat die van GMaps fouten bevat. target="_blank" werkt wel zonder problemen. Inmiddels overal die refs vervangen voor de target. Scheelt weer een scriptje inladen, hoe klein ook. Nu binnenkort maar overzetten op html5.

Ik ben gewoon maar hobbyist met sites bouwen en in het begin leek het me wel leerzaam om juist strict aan te houden, maar bij bepaalde dingen is het eerder een beperking dan een toevoeging. In ieder geval hartelijk dank voor het afnemen van mijn oogkleppen

Statistieken zijn als bikini's: wat ze tonen is erg suggestief, wat ze niet tonen is essentieel

dinsdag 6 december 2011 19:39

Acties:

0 Henk 'm!

T-MOB

De grote vraag is - en dat is waar het oogkleppenverhaal over gaat - waarom wil je zo graag een nieuw venster openen? Je bezoeker kan beter zelf bepalen wanneer hij zaken in een nieuw venster wil hebben en wanneer niet.

Regeren is vooruitschuiven

dinsdag 6 december 2011 21:19

Acties:

0 Henk 'm!

arie_papa

Running on Ubuntu

Topicstarter

@ T-MOB

Om dezelfde reden als dat bijvoorbeeld jou website-link onder je nick opent in een nieuwe tab hier op tweakers.
Vanuit mijn eigen user-experience vind ik het ongelooflijk irritant als ik op externe links klik en dezelfde tab herladen wordt. Ja dat kun je niet volgens de standaarden noemen, maar zeker links binnen een lopende tekst en externe links vind ik goed te verdedigen om daarmee met target="_blank" te werken.

Statistieken zijn als bikini's: wat ze tonen is erg suggestief, wat ze niet tonen is essentieel

dinsdag 6 december 2011 21:57

Acties:

0 Henk 'm!

T-MOB

Het punt is dat je er als bezoeker heel makkelijk voor kunt kiezen om links wél in een nieuw venster te openen (ctr-click, middelste muis, etc), maar het omgekeerde niet kan. Je dringt nu dus jouw voorkeur op aan al je bezoekers. En daar zitten wat nadelen aan. Op een PC met een browser zijn verschillende vensters/tabs nog wel enigszins te behappen, op mobiele devices al weer een stuk minder. Maar zelfs op de PC zijn er mensen zat die het helemaal niet door hebben als er een nieuw venster of tab geopend wordt. Die merken alleen maar dat de "back"-knop ze niet meer terugbrengt naar de vorige pagina.

Regeren is vooruitschuiven

dinsdag 6 december 2011 22:42

Acties:

0 Henk 'm!

arie_papa

Running on Ubuntu

Topicstarter

Wat dat betreft heb je ook wel weer gelijk. Maar iedere gebruiker verschilt. De een is gewend aan tabs / externe links worden in een nieuw venster geopend. De ander aan de terug knop.
Degene die niet bewust is van tabs, zal de opties als ctrl-click enz ook al helemaal niet kennen. Maar goed iedere site dient zijn doel en bezoekers en wat dat betreft maakt iedere admin zijn eigen beslissingen.

Ik zie inderdaad dat jij je eigen site + referenties strak houdt aan wat je zegt, maar bevoorbeeld de vorige reactie @bosmonster - site maakt wel weer gebruik van _blank oid, wat ik persoonlijk prettiger vind werken.

Maar verder dwaalt het spoor of topic.

target="_blank" heeft in ieder geval de technische kant van het verhaal opgelost

Statistieken zijn als bikini's: wat ze tonen is erg suggestief, wat ze niet tonen is essentieel

woensdag 7 december 2011 07:41

Acties:

0 Henk 'm!

Bosmonster

*zucht*

skinlee78 schreef op dinsdag 06 december 2011 @ 21:19:

Om dezelfde reden als dat bijvoorbeeld jou website-link onder je nick opent in een nieuwe tab hier op tweakers.
Vanuit mijn eigen user-experience vind ik het ongelooflijk irritant als ik op externe links klik en dezelfde tab herladen wordt. Ja dat kun je niet volgens de standaarden noemen, maar zeker links binnen een lopende tekst en externe links vind ik goed te verdedigen om daarmee met target="_blank" te werken.

Dit ben ik trouwens wel met je eens.

Het is een stomme regel

Ik stoor me ook mateloos aan links naar bijvoorbeeld afbeeldingen e.d. die niet in een nieuwe tab openen.. Hoe vaak sluit ik die niet af en ben de site kwijt...

In de praktijk stoort eigenlijk niemand zich aan nieuwe tabs. Mijn aversie is meer tegen de javascript oplossing, om eerder genoemde reden.

Dus tenzij je met xhtml strict moet werken en/of aan de toegankelijkheidseisen moet voldoen, zou ik me er gewoon niet druk over maken, maar kijken naar wat je de prettigste user experience vindt. Accessible is niet altijd compatible met usable

[ Voor 17% gewijzigd door Bosmonster op 07-12-2011 07:46 ]

woensdag 7 december 2011 10:12

Acties:

0 Henk 'm!

arie_papa

Running on Ubuntu

Topicstarter

Ik moet gelukkig niks, het is gewoon een beetje hobby site van me (voor het vrouwtje dan..)

En als ik erover na ga denken was het natuurlijk wel te krom voor woorden. target="_blank" vervangen voor de rel="external" + javascript om... target="_blank" aan te roepen.
Inmiddels alle rel's vervangen en doctype is ook al gewijzigd. Nu nog even testen of alles nog werkt, maar het lijkt erop dat het geen problemen geeft.

Statistieken zijn als bikini's: wat ze tonen is erg suggestief, wat ze niet tonen is essentieel

woensdag 7 december 2011 10:16

Acties:

0 Henk 'm!

posttoast

Sorry, maar ik vind het dus wel een heel slecht idee om automagisch linkjes in een nieuwe tab/window te openen. Ik klik altijd met ctrl (of cmd) op een linkje als ik deze in een nieuw tabje wil openen en met shift als ik het in een nieuw window wil. Soms wil ik dat pertinent niet, en dan besluit de website dat dus even voor me. Bloedirritant vind ik dat.

Zie ook dit artikeltje.

omniscale.nl

woensdag 7 december 2011 10:42

Acties:

0 Henk 'm!

Bosmonster

*zucht*

posttoast schreef op woensdag 07 december 2011 @ 10:16:
Sorry, maar ik vind het dus wel een heel slecht idee om automagisch linkjes in een nieuwe tab/window te openen. Ik klik altijd met ctrl (of cmd) op een linkje als ik deze in een nieuw tabje wil openen en met shift als ik het in een nieuw window wil. Soms wil ik dat pertinent niet, en dan besluit de website dat dus even voor me. Bloedirritant vind ik dat.

Zie ook dit artikeltje.

Dat vereist 2 handen. Daarnaast ben jij een van de weinigen die dat doen. De gemiddelde gebruiker gaat er gewoon vanuit dat dit voor hem gebeurt en snapt het niet meer als dat dus niet het geval is!

De argumenten uit het artikel gelden dus ook als je het juist niet doet in de praktijk (de verwarring en usability issues)

Ik ben met je eens dat in een ideale wereld dit niet meer gewenst is. Echter is het geen ideale wereld en zijn gebruikers er inmiddels aan gewend dat het voor hun gebeurt.

[ Voor 10% gewijzigd door Bosmonster op 07-12-2011 10:45 ]

woensdag 7 december 2011 11:20

Acties:

0 Henk 'm!

posttoast

Bosmonster schreef op woensdag 07 december 2011 @ 10:42:
[...]

Dat vereist 2 handen. Daarnaast ben jij een van de weinigen die dat doen. De gemiddelde gebruiker gaat er gewoon vanuit dat dit voor hem gebeurt en snapt het niet meer als dat dus niet het geval is!

rechtermuisknop, open in nieuwe tab?

De argumenten uit het artikel gelden dus ook als je het juist niet doet in de praktijk (de verwarring en usability issues)

Ik ben met je eens dat in een ideale wereld dit niet meer gewenst is. Echter is het geen ideale wereld en zijn gebruikers er inmiddels aan gewend dat het voor hun gebeurt.

Ik kan me een onderzoek herinneren (en jammer genoeg kan ik hem nu zo snel niet vinden) waaruit kwam dat mensen die niet veel ervaring hebben met het werken in een browser volledig de weg kwijtraakten door het openen in een nieuwe tab. Het viel ze namelijk niet op dat er een nieuwe tab geopend werd, maar wel dat de back-button ineens niet meer werkte.

Maar goed, hier kun je eindeloos over discussiëren natuurlijk

omniscale.nl

Onderwerpen