Flytende div konteiner over en YouTube iframe


I "gamle dager" var løsningen for flytende div konteinere over flash innhold (som videoer), å legge til koden:

Code (HTML):

<object […] <param name="wmode" value="opaque"> […] <embed wmode="opaque" […] 

Dette virket fint inntil YouTube begynte med iframe for å bygge inn videoene. Noen nettlesere støtter ikke div konteinere som flyter over innbygde medier. Flash filmer bygget inn med iframe er satt til (default) wmode, noe som gjør at den flyter over alt annet – og ikke motsatt. Jeg har valgt å bruke min Tower Bridge Live video som et eksempel på hvorledes sosiale dele knapper har tendensen til å forsvinne bak innebygde videoer. Original YouTube koden:

Code (HTML):

<iframe width="640" height="480" src="http://www.youtube.com/embed/R1e5u3gysuw" frameborder="0" allowfullscreen></iframe> 

Løsningen er å legge til &wmode=transparent på slutten av src attributtet i iframe’en:

Code (HTML):

<iframe width="640" height="480" src="http://www.youtube.com/embed/R1e5u3gysuw&amp;wmode=transparent" frameborder="0" allowfullscreen></iframe> 

Noen ganger fungerer det ikke med en ligatur for konjunksjonen og (&). Forsøk da med spørsmålstegn istedenfor konjunksjonen på slutten av src-attributtet i iframe'en:

Code (HTML):

<iframe width="640" height="480" src="http://www.youtube.com/embed/R1e5u3gysuw?wmode=transparent" frameborder="0" allowfullscreen></iframe> 

---

Under er det irriterende fenomenet der div forsvinner bak en iframe. Løsningen på dette kan sees her: Tower Bridge Live.

Vedrørende Googles nye vilkår

De nye retningslinjene til Google skal dekke alle tjenestene fra Analytiske verktøy til lettere tjenester som Android, Gmail, Google Plus, Google søk, YouTube o.s.v. De tidligere 70 ulike dokumentene blir etter 1.mars redusert til 2 dokumenter, som dekker aller Googles produkter. Imidlertid kan egne regler for enkelte produkter og tjenester forekomme! Uansett, kort fortalt vil Google få anledning til å huske alle tidligere søk du har foretatt deg, såfremt du er pålogget en av dine Google kontoer. Det er derfor viktig å aktivere/ deaktivere denne funksjonen etter som hva du selv ønsker.

Hvis du logger deg på google.com/history og kan du velge mellom å aktivere Nettlogg eller ikke. Har du allerede aktivert den, men ønsker å bli mer anonym, kan du velge remove all Web History (norsk: fjern webhistorikk) og deretter OK. Dette stopper ikke Google å logge deg når du er innlogget på tjenestene deres, men informasjonen vil bli delvis anonymisert etter 18 måneder. Velger du å aktivere Nettloggen, vil informasjonen lagres uendelig!

Administrator wrote on 02/15/12 at 01:55:11:


Hvordan optimalisere nettsteder for mobilenheter?

Det første jeg innså da jeg fikk min nye smarttelefon, den fabelaktige Samsung Galaxy S3, var at mobilvennlige nettsider på Liavaag.org viste seg å ikke være så vennlige lenger. På grunn av HD-oppløsning på 720p måtte jeg zoome innholdet. Så hva gjør jeg?

Det var ingenting galt med nettsidenes syntaks, men snarere derimot at WebKit og mobilnettlesere generelt trodde at de var nettlesere på desktopper. I tidligere tider (dvs. et halvt år siden) zoomet mobilenheter som iPhone og Android ut websider automatisk, slik at de passet inn i 3-tommers skjermer. På nåværende tidspunkt har den fantastiske Galaxy S3 en mektig 4,7 tommers skjerm og av denne grunn er det ikke lenger det samme behovet for å zoome nettsidene lenger. Derimot hvis nettstedet er optimalisert for mobilenheter blir alt fort veldig smått. Det beste er å lage en mobilvennlig nettside som kan være lesbare fra 320px til HD-oppløsning over 720p.

Det første vi gjør er å deaktivere zoom-out oppførsel med en META tag:

Code (HTML):

<meta name="viewport" content="width=device-width" /> 

For å forhindre at brukeren av en mobilenhet kan zoome inn, låser du zoomingen ved å sette verdiene på både initial-scale og maximum-scale til 1:

Code (HTML):

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" /> 

Forhåpentligvis vil dette medføre bedre brukeropplevelse. 

WordPress fra smarttelefonen

Noen ganger kan det være greit å administrere en eller flere WordPress kontoer fra smarttelefonen din. Dette er fullt mulig, selv om du har den på egen server. Alt du trenger er URL adressen til nettstedet, brukernavnet, passordet og laste ned WordPress appen selvfølgelig.

Imidlertid må du på forhånd huske å krysse av XML-RPC på fjernpublisering. Da aktiverer du WordPress, Movable Type, MetaWeblog og Blogger XML-RPC publiseringsprotokolle. Denne opsjonen ligger på http://www. [ditt domene] /wp-admin/options-writing.php.

Twitter Card


Twitter Cards API gjør at dine tweets blir mer informative. Det er tre typer Twitter Cards (Twitter-kort): Sammendrag (summary), foto (photo) og video. Nedenfor er de generiske META-kodene, de grunnleggende kodene som brukes i Twitter Card:

twitter:card – Typen kort som lages: Summary, photo, eller video.
twitter:url – URL'en som skal brukes til kortet. Dette vil trolig være den samme nettadressen som sidens kanoniske lenke.
twitter:title – Tittelen som skal vises i Twitter-kortet.
twitter:description – 200 tegns oppsummering av innholdet i den gitte URL’en.
twitter:image – Et representativt bilde for innholdet. I mange tilfeller vil rett og slett logoen være tilstrekkelig.
twitter:site – Twitter-brukernavn som brukes av en gitt side inkludert '@'.
twitter:creator – Twitter-brukernavnet til den enkelte forfatter av innholdet.

Code (HTML):

<meta name="twitter:card" content="summary" />
<meta name="twitter:url" content="http://www.liavaag.org/hallo-verden.html" />
<meta name="twitter:title" content="Hallo Verden!" />
<meta name="twitter:description" content=" Her er et testområde for det nye Twitter Cards API." />
<meta name="twitter:image" content=" http://www.liavaag.org/logo.png" />

<!-- Forfatterne har her mulighet til å få kreditt i Twitter-kortene sine -->
<meta name="twitter:site" content="@mortenrene" />
<meta name="twitter:creator" content="@mortenrene" />
 

Kilder

• Getting Started Twitter Developers
• How to Create a Twitter Card David Walsh Blog