Debat: HTML5 og CSS3 – Er vi der ikke snart eller?
Internettet bugner af blogindlæg, artikler og andet spændende omkring HTML5 og CSS3, men kan det overhovedet betale sig at hoppe om foran i køen?
Indtil videre har jeg været lidt tilbageholden med både HTML5 og CSS3, fordi understøttelsen heraf kun er at finde i de moderne browsere – Firefox, Safari, Chrome og Opera mf. Og selv i disse er understøttelsen nogle gange ret sparsom.
Måske læserne ligger inde med en masse guldkorn, som de kunne tænke sig at dele?
Indholdsfortegnelse
- Hvad er HTML5, og hvad skal vi med det?
- Hvad er CSS3, og hvad skal vi med det?
- Mine synspunkter omkring HTML5 og CSS3
- Konklusion
- Deltag i debatten
1. Hvad er HTML5, og hvad skal vi med det?
Inden vi overhovedet starter på selve debatten, vil jeg lige kort ridse HTML5 op – danne et lille billede af, hvad det i det hele taget går ud på, men det er heller ikke sådan, at vi skal ned i de mindste detaljer – dem kender i formodentligvis allerede. Hvis ikke, så får i selvfølgelig også nogle muligheder via dette blogindlæg.
HTML5 er den længe ventede afsløser for HTML4 (4.01). Wow, sikke en afsløring! HTML4 har efterhånden været her i mange år, og som så meget andet blevet forældet – eller måske rettere er kravene blevet større. Internettet, webudviklerne og ikke mindst brugerne skriger på indhold at interagere med. Alligevel tror jeg nu nok, at det er webudviklerne, der skriger mest – i smerte og sorg over at have flået de sidste spæde hår ud af en – engang – ellers flot hårpagt. Ak ja, selv den flotteste manke forgår jo med tiden 
HTML5 byder på mange utroligt spændende ting, som jeg er ganske sikker på, mange webudvikler har store abstinenser over at komme igang med. Hvad er det så for nogle ting, jo kig blot nedenfor, så vil jeg fremhæve et par af de mange nævneværdige ting – groft understøttet af andres hårdt arbejde ved tastaturet. Meen, ideen her er jo også en debat, og ikke en genfortælling
1.1. Nye og semantiske tags til skyen af html
I en meget forkortet udgave går semantik ud på korrekt opsætning og udnyttelse af elemterne til deres formål – altså at skabe en mening. Idag er man eksempelvis nødt til at lave en struktur vha. af ID’er og DIV’er, men i fremtiden får vi en række logiske tags, der i den grad underbygge semantikken. Kig lidt på illustrationen nedenfor:
Skulle du være interesseret i at læse mere om de nye tags og semantik generelt, så slå et klik forbi 1st Webdesigner, der skriver omkring HTML and Semantics – Conjoined twins of the Future Web!
Eller endnu bedre læs en artikel fra A List Apart omkring Semantics in HTML5. De gutter forstår om nogle at skrive en velargumenterende og velbegrundet artikel, der dog kan være tørre – til tider.
1.2. Intergreret musik og videoafspilning
En af de andre prominente features er muligheden for at overlade musik- og videoafspilningen til browseren i stedet for eksempelvis at være afhængig af Flash. Det synes jeg absolut er tiltalende, fordi du pludselig ikke skal installere noget ekstra, men i stedet kan benytte en inkomporeret feature i din browser. Jeg kunne også forestille mig, at det kunne hjælpe på hastigheden, da Flash vidst nok har nogle issues på det område – Ret mig, hvis jeg er på dybt vand.
Eksempelvis har du muligheden for at afprøve videoafspilning hos Youtube, hvis altså din browser er så langt fremme i skoene.
1.3. Afslutningsvis om HTML5
Ja, jeg har selvfølgelig kun rørt overfladen af de mange muligheder, men ideen var som nævnt heller ikke at skære ind til benet omkring HTML5.
Se Apple spille lidt med musklerne og klargøre de mange muligheder med HTML5 (Husk en browser baseret på Webkit).
Du må endelig deltage i debatten med dine fordele og ulemper ved HTML5. Hvad synes du er super hot ved HTML5?
1.4. Øvrige nævneværdige artikler omkring HTML5
- Smashing Magazine: HTML5 and The Future of the Web <- Anbefalingsværdig!
- A List Apart: A Preview of HTML5 <- Anbefalingsværdig!
- Nettuts: HTML5 Globals and You
- Nettuts: Rethinking Forms in HTML5 <- Anbefalingsværdig!
- Nettuts: How to Make All Browsers Render HTML5 Mark-up Correctly – Even IE6 <- Hvis du ikke kan vente
- Sick Designer: HTML5 Starter Pack – a sick freebie <- Kom godt igang
- Drawar: When is the right time to begin using HTML5/CSS3 <- Anden god debat
- Focus.com: WTF is HTML5 and why should we all care <- God infografik
- Webdesigner Depot: HTML5 and CSS3 Books to Watch for in 2010
- 1st Webdesigner: 25 Ultra Modern Websites Using HTML5
- A List Apart: Taking Advantage of HTML5 and CSS3 with Modernizr
- WDL: 10 HTML5 Demos to Make You Forget About Flash
2. Hvad er CSS3, og hvad skal vi med det?
Sådan, så kom jeg da vidst også rigeligt omkring HTML5 med alle de gode artikler, der virkelig går i dybden med tingen. Meeen, skal vi ikke få fokus på CSS3 nu? Jo!
CSS3 giver os en lang række nye og fantastiske muligheder, som idag må opnås med grafikelementer og andre sære tilbøjeligheder som javascript – måske i form af jQuery og Mootools. Intet skidt i det, som sådan, vi er jo bare ude på at berige oplevelsen på internettet – eller sågar øge brugervenligheden, men det er en anden snak.
2.1. Skal jeg overhovedet noget med CSS3?
Tja, er du bare brugeren på en hjemmeside, så kan du som sådan være lidt ligeglad og alligevel ikke. Med de nye og mange muligheder kan os webdesignere og webudviklere berige din oplevelse på internettet. Vi kan lave langt bedre hjemmesider uden at skulle igennem en masse smuthuller, der i sidste ende kan betyde en super elendig oplevelse for dig – nemlig brugeren!
Så nej, du skal slet ikke ignorerer CSS3, fordi det ganske enkelt gør internettet et bedre sted at være som bruger (det er i hvertfald min overbevisning), men vi andre kommer også til at spare et par hovedpiner væk – ja tak
2.2. Hvorfor er CSS3 nu også übercool?
Nu vil jeg ikke til at gå i dybden med de mange finesser, men jeg vil nævne nogle af de ting, som jeg personligt ofte står og mangler i mit arbejde med webdesign og opsætning heraf. Nogle af disse ting kræver ofte en del ekstra arbejde, hvilket kan være irriterende, når mange af mulighederne er lige ved hånden, men endnu ikke er understøttet bredt nok.
Samtidig er det også lidt ærgeligt at føle sig begrænset som både webdesign og frontendudvikler. Vi vil jo bare gerne i gang med de mange fantastiske egenskaber, hvoraf en række af mine favoritter er nævnt nedenfor. CSS3 kan langt mere end blot disse. Bare sådan du ikke sidder der og tænker, at det lyder da lidt fesent.
- Mulighed for at vedhæfte skrifttyper og generelt mere magt over skrifttyperne
- Mulighed for runde hjørner
- Mulighed for gradienter og skygger
- Mulighed for gennemsigtighed
- Mulighed for flere baggrunde pr. element
- Mulighed for flere rammer pr. element og mulighed for baggrundsbillede på rammerne
- Mulighed for animation eller bevægelse
- Mulighed for at rotere et element
Jo ganske vidst, så kan jeg opnå mange af disse ting idag, men det kræver en masse krumspring, som rent praktisk er skide irriterende at rode med. Det føles ofte som en dum lappeløsning. Hvor tit har du ikke befundet dig på en asfalteret vej, der er lappet til ukendelighed? Den er ingen fornøjelsen hverken at cykle eller køre på.
2.3. Nævneværdige artikler omkring CSS3
Jeg har samlet et par underbyggende artikler, der går mere i dybden med de mange muligheder. Som nævnt, så vil jeg ikke skære det hele ud i pap, da så mange andre allerede har gjort dette.
- Smashing Magazine: CSS Three – Connecting the dots <- Anbefalingsværdig!
- Smashing Magazine: CSS3 solutions for Internet Explorer <- Eksempler på krumspring og lappeløsninger
- Six Revisions: Examples of CSS3 in the Wild
- Webitect: 350+ Amazing CSS3 Resources – All You’ll Ever Need to Become a CSS3 Master! <- Behøver du mere?
- Amber Weinberg: Some Nifty CSS3 Properties That Degrade Nicely
- Keith Clark: CSS3 pseudo-class selector emulation for Internet Explorer 5.5 – 8 <- Meget interessant
- A List Apart: Taking Advantage of HTML5 and CSS3 with Modernizr
- Smashing Magazine: Start Using CSS3 Today: Techniques and Tutorials <- Her har vi svaret
- Smashing Magazine: Why We Should Start Using CSS3 and HTML5 Today
- aext.net: What CSS3 Can Do For You: Animation and 3D effects
- iPhone CSS3 | A CSS3 experiment by Jeff Batterton <- Cool!
- Nettuts: HTML5 and CSS3 Without Guilt <- Ny og interessant
3. Mine synspunkter omkring HTML5 og CSS3
Selvom begge emner er noget af det mest hotte indenfor min branche, så har jeg det yderst svært med begge ting. Hvornår kan det betale sig at gå igang?
Jeg er dog mest tilbageholden med HTML5, da understøttelsen her på mange måder afhænger endnu mere af browseren end CSS3. Ganske vidst afhænger begge ting yderst meget af browseren, men sådan noget som runde hjørner i CSS3 kan eksempelvis godt undværes hos dem, der ikke har muligheden for at opleve dette. De mister så om sige ikke noget af oplevelsen, fordi de stadigvæk kan benytte hjemmesiden problemfrit.
Jeg mener såmænd blot, at man godt kan tillade sig at snige nogle af de forskellige muligheder med CSS3 ind i sin webudvikling uden, at nogle oplever et problem herved. Dette – i følge min opfattelse – er væsentlig sværer med HTML5, fordi meget er lagt op browserens evne til at afvikle det. Eksempelvis med afspilning af video og musik. Her kan man måske lave forskellige udbedringer vha. javacript og andet, men så kan man jo begynde at diskutere, om det overhovedet kan betale sig? Måske jeg er lidt ude på dybt vand med det postulat, så ret mig endelig.
Når alt det er sagt, så synes jeg skam, det ser utroligt spændende og fantatisk ud med de muligheder, som både HTML5 og CSS3 giver os. Det er pludseligt muligt at tilbyde spændende, fængende og sjove hjemmesider, som brugerne kan interagere med, uden at skulle installere forskellige ekstra ting – heriblandt Flash. Lige snakken om Flash undlader vi dog i denne omgang
Tag eksempelvis bare et kig på Apple’s prængende showcase af HTML5 (Kræver en browser bygget på Webkit) – Det er lidt vildt, ikk?
Men i al sin herlighed, så er jeg dog selv alligevel meget tilbageholden. Og som skrevet længere oppe, så har jeg det enormt svært med, hvornår jeg skal igang. Egentlig vil jeg jo gerne igang nu – og ikke om flere dage, måneder eller år. Specifikationerne for både HTML5 og CSS3 er jo stadigvæk ikke 100% færdige. Mener HTML5 skulle få sin rigtige lancering i 2022 – ja, det er jo ikke just nu og her.
Jeg vil være ked af at vente så mange år, men jeg lader dog ikke til at være den eneste. Som du kunne se på linket, så er Apple en kæmpe stor fortaler for HTML5, men Google gør også sit – se blot med Youtube. Selv den store og sløve dinosaur – Microsoft – lader til at være vågnet fra sine mange millioner år i dvale. Derfor tror jeg heller ikke, at vi kommer til at vente helt så mange år. Eller?
4. Konklusion
Vi kan nemt snakke om alle herlighederne, men når vi sætter os ned og må kigge på realiteterne, så må vi desværre holde lidt igen. Der er desværre stadigvæk helt andre magter på spil end Google, Apple og Microsoft. Brugerne er stadigvæk dem, som vi arbejder for. Det er jo dem, der i sidste ende, skal bruge det vi laver – og derfor må vi heller ikke bare skide højt og fløjtende på dem.
Meeen, når det er sagt så synes jeg sagtens man idag kan overveje, at visse egenskaber fra bl.a. CSS3 kan sniges ind i sit arbejde med webudvikling. Det giver i det mindste en lidt forståelse for de mange og nye muligheder, som det medfører sig.
Dermed ikke sagt, at alle webdesignere – inklusiv mig selv – bare skal gå helt amok i Photoshop. Hav nu stadigvæk i mente, at langt fra de fleste kan nyde godt af disse herligheder. Eksempelvis bruger mine forældre stadigvæk IE6. Ja, jeg skal nok få dem opgraderet – engang – jeg sværger
