Eget typsnitt med CSS (cross-browser)

Många väljer av estetiska skäl att använda bilder istället för rubriker på sin webbplats. Bilder som rubriker har i huvudsak två nackdelar:

  • Det är tidskrävande och oflexibelt
  • Sökmotorer går miste om viktig information

Med CSS3 begränsas du inte till de typsnitt som besökaren installerat på sin dator. Genom att lägga typsnittet på servern och referera till det via CSS öppnas helt nya möjligheter.

Det huvudsakliga problemet är att IE inte stödjer TrueType-typsnitt. För att fixa detta krävs att typsnittet finns som både TrueType (TTF) och OpenType (EOT). Ett TTF-typsnitt kan enkelt konverteras online till EOT med hjälp av TTF to EOT Font Converter. Ladda sedan upp bägge typsnitten till servern…

Exemplet nedan ser ut som en skärmdump från Commodore 64 BASIC, men skenet bedrar. Jag har endast använt mig av CSS3 och typsnittet ”Commodore 64″ (prova gärna att markera gärna texten).

**** COMMODORE 64 BASIC V2 ****

64K RAM SYSTEM  38911 BASIC BYTES FREE

READY.

 

Så ser koden ut:

<style type=”text/css”>
@font-face {
font-family: ”Commodore 64″;
src: url(‘/c64.eot’); /* IE */
src: local(‘Commodore 64′), url(‘/c64.ttf’) format(‘truetype’); /* non-IE */
}

.c64-screen  {
width: 320px;
height: 200px;
font-family: ”Commodore 64″;
font-size: 10px;
color: #7777ff;
background: #110099;
border: #7777ff 32px solid;
padding-top: 1px;
line-height: normal;
}

.c64-header  {
text-align: center;
}
</style>

<div class=”c64-screen”>
<div class=”c64-header”>
**** COMMODORE 64 BASIC V2 ****<br /><br />
64K RAM SYSTEM &nbsp;38911 BASIC BYTES FREE<br /><br />
</div>
READY.
</div>

Livsnjutaren Aila


Vår livsnjutare till katt parkerad i soffan.

Rundade hörn med CSS – Utan bilder

Mitt Photoshop Action för rundade hörn i Photoshop har kommit till stor användning för mig och många andra. Idag var jag på jakt efter en metod att skapa rundade hörn utan i bilder i CSS. Detta har varit möjligt i FireFox sedan lång tid tillbaks, men på alla forum och bloggar stor det samma sak; ”There is no way to do it in Internet Explorer”.

Efter en stunds letande hittade jag dock sidan curved-corner med ett CSS-skript är helt cross-browser. Det går nu alltså få runda hörn helt utan bilder i FF, Chrome, Safari, IE6, IE7 och IE8!

Tanka hem border-radius-demo.zip och lek med runda hörn! :)

Elak CHKDSK-bugg i Windows 7

Jag har precis genomlidit en helvetesafton i hårddiskens tecken. När jag skulle starta upp min bärbara dator för att kolla mail möttes jag av följande otrevliga meddelande:

Checking file system on C:
The type of the file system is NTFS.

One of your disks needs to be checked for consistency. You may cancel the disk check, but it is strongly recommended that you continue. To skip disk checking, press any key within 10 seconds(s).

Ok, cool pistol, det är bara CHKDSK som ska fixa nåt lite snabbt… tänkte jag…

När sekunderna räknat ner till 1 och hårddisken skulle kollas hände ingenting. Dessutom gick det inte komma vidare, oavsett vilken knapp jag tryckte på! Det var bara att göra en hård reset med en bittert nedtryckt power-knapp.

Nästa gång testade jag att trycka på diverse knappar innan de 10 sekunderna passerat – ingen CHKDSK startar och jag kommer inte in i Windows. Testar att boota om igen, möts av samma meddelande, men inga knappar funkar denna gång heller…

Jag testar att starta om datorn i felsäkert läge. Samma irriterande CHKDSK-meddelande dyker upp igen – datorn är totalt låst.

Vid nästa uppstart håller jag inne F8 (måste göras innan Windows-loggan dyker upp) och får upp några alternativ, varav ”Reparera datorn” låter vettigt. Här fanns möjligheten att göra en diskreparation och enligt testrapporten blev det lyckat.

”Det finns hopp”, tänkte jag i all misär, och bootade om datorn.

Vad tror ni händer när jag startar om datorn? Jo, den har schemalagt CHKDSK som en slutlgiltig bekräftelse på att ”allt har gått bra”… och samma sak igen – datorn låser sig! Denna gången står det dock inget om att ”your disks needs to be checked for consistency”, så jag antar att disken är fixad.

Jag testar nu att starta i felsäkert läge, men halvvägs i uppstarten stannar allt upp och hårddisken slutar ladda. Inga meddelanden om CHKDSK, ingenting.

En tvångsomstart av datorn görs, återigen med F8 intryckt. Denna gången väljer jag ”Reparera datorn” och sedan att endast starta med DOS-prompt. I prompten (som måste köras i Administrator-läge) skriver jag:

chkntfs /x c:

Detta ska tydligen förhindra att datorn startar den Schemalagda diskchecken. Tricket funkade och jag kunde äntligen starta upp Windows.

Allt verkar nu i sin ordning och jag provade att skriva följande i DOS-prompten för att försäkra mig om att disken inte är ”dirty”:

fsutil dirty query c:

Prompten svarade: ”Volymen c: är inte smutsig”. Finemang!

Det jag råkade ut för är en bugg i Windows 7. Buggen drabbar i synnerhet datorer med infraröda enheter, vilket min bärbara dator mycket riktigt har.

Efteråt, efter en stunds Googlande, hittade jag en ”Hotfix” som kan laddas hem på Microsofts supportsida. Har dock inte testat den själv. Att tanka hem en ”Hotfix” är kanske inte det första man tänker på när man sitter djupt ner i skiten, tror att hårddisken gjort sitt och Windows inte ens startar i felsäkert läge.

Hårddiskproblemet tärde verkligen hårt på en utarbetad och sömnlös småbarnsfar. Imorgon ska jag sova ut ordentligt och komma för sent till jobbet… (som vanligt).

Google Street View till Sverige

Idag lanserades Google Street View i Sverige. Google påbörjade fotograferingen av svenska städer i april 2009. Google-bilarna har kört land och rike kring med kameror som riktats åt flera håll.

Både Eniro och Hitta har liknande tjänster, men jag tycker inte de är i närheten så imponerade som Googles variant. Jag kunde t.o.m. ”gå runt” på Storgatan i Boda Glasbruk och hitta bilder på mitt barndomshem i riktigt bra kvalitét. Stora delar av mellansverige finns tyvärr inte med ännu, så det finns fortfarande mer jobb för ”Googlebilen” att utföra.

Hur funkar Google Street View?
Jo, du går in på Google Maps och zoomar in ett område, alternativt skriver in en adress. Sedan drar du den orange gubben till det ställe på kartan som du vill kolla på.


Ett exempel på Google Maps Street View – Centralstationen i Kalmar

En film om Bodabadet

Simon Moser har skapat en fin film om Bodabadet. För mig, som också växte upp i Boda Glasbruk, väcker filmen starka känslor av både vemod och nostalgi.

Samhället Boda Glasbruk var för 20 år sedan en blomstrande landsbygd med affär, post, skola och ett glasbruk som varje år lockade tusentals turister. Utomhusbadet var för många samlingspunkten på somrarna.

Idag finns inget av detta kvar. Boda Glasbruk har sakta men säkert ruttnat bort…

Edit: Simon har av okänd anledning tagit bort klippet från Vimeo.com, men det kan fortfarande ses här: http://www.filmbasen.se/node/2457

Sida 2 av 1912345...Sista »