Som forberedelse af en fremtidig re-implementering af min hjemmeside med bedre struktureret (x)html-kode og nye designs, har jeg lavet en lille design workshop, som er en lille sandkasse jeg kan lege og teste i. Og jeg synes faktisk at det er blevet et så interessant et lille "legetøj", at jeg vil skrive et par ord om den...

"Værktøjet" er sådan set bare én webside, som man kan vælge at se "stylet" med en række forskellige layouts. Man kan skifte layout enten med dropdown-boksen eller med links på siden, og det der sker "bagved" er reelt bare at det "aktive" stylesheet udskiftes. En anden speciel feature på siden er at man i Internet Explorer kan slå Dean Edwards "IE7 technology" til og fra. En teknologi jeg så vælger at kalde for "IE+", da jeg synes at navne-sammenfaldet med Microsofts seneste browser-version er ret forvirrende. Jeg har i øvrigt tidligere skrevet om Dean Edwards projekt, og nu synes jeg altså det var på tide at få teknologien afprøvet i praksis. Jeg satser ikke på at bruge IE+ teknologien til Internet Explorer 7, da der er nogle performance ulemper ved IE+. Og IE7 (altså browseren) klarer faktisk også moderne css meget godt. Men det vil være fint for mig hvis IE5x og IE6 kan understøttes ved hjælp af IE+, så man ikke behøver at tage specielle hensyn til disse gamle browseres begrænsninger i sin kode. Jeg kan i øvrigt teste både i IE6 og IE7 på samme pc, takket være Microsofts nye og gratis "virtual machine IE6 image" til Virtual PC. Ja jeg ved godt der findes forskellige hacks til at have flere versioner af IE installeret på samme pc uden at køre dem i en virtuelle maskiner, men disse er ikke 100% pålidelige i deres opførsel.

Jeg tror nok den bagved-liggende struktur i (x)html-koden er nogenlunde på plads i min workshop. Og det vil bl.a. sige at sidernes reelle indhold fremover kommer til ligge som noget af det første i kilde-koden. Det vil være gavnligt for rangering på søgemaskiner, men vil f.eks. også være en stor lettelse for folk der forsøger at læse mine sider med det lille display i en mobil-browser. Eller svagtseende der bruger oplæser-software. I nuværende implementation her på hjemmesiden ligger det vigtigste indhold faktisk til allersidst i kilde-koden, hvilket er meget "politisk ukorrekt".

Alt design/layout kode ligger selvfølgelig i stylesheets. Der er ikke nogen tabeller eller lignende i xhtml-koden til at styre layout med. De "designs" der indtil videre er at vælge imellem i min workshop, er sådan set kun layout-skitser. Så du bliver slemt skuffet hvis du er på jagt efter nogle rigtig flotte designs:-) Men med tiden skulle de forskellige "designs" selvfølgelig gerne udvikle sig til noget der også ser lidt pænt ud... Og der må også godt komme nogle lidt "vildere" eller mere utraditionelle end de nuværende "standard-layouts".

Men prøv det af. Jeg synes selv det er lidt tjekket. Og ingen javascript brugt til fold-ud menuerne. Det er ren ccs.

 

There are no comments to this post

Only Name and Comment are required fields when commenting here. If you specify your email address, everyone will be able to find it at your comment. However your email will only be directly visible when hovering over your name, and in the code behind it will not look like an email address. So the risk of bots harvesting email addresses here, should be minimal. But again, you are free to leave the email blank when commenting.

If you tick Remember me, your name, email and homepage address will be remembered and prefilled at your next visit (Uses a cookie when ticked).

Full URLs (starting with "http://" or "https://") in comment text will be converted into active links when comment has been verified by a human as not being spam. Comments that looks too much like spam, will immidiately/proactively be rejected by the system and never reach a human eye.