Supermumin

CSS TIPS

Skaffa dig en bra utvecklingsmiljö.

Din utvecklingsmiljö är programmet du använder för att skriva CSS. Vissa använder sig av Anteckningar (notepad), andra använder sig av DreamWeaver. Andra populära är HomeSite, BBEdit, Frontpage, Bluefish, PHP Expert Editor, Topstyle, UltraEdit och Textpad. Mina favoriter är HTMLPad och WeBuilder.

Min åsikt är att en bra miljö ska ha ett visst stöd för språket du ska skriva, i det här fallet CSS. Jag klarar mig inte utan syntax-färger, dvs, koden du skriver färgas utefter syntaxen på språket. Vissa kod-element kan färgas blå, medan deras attribut färgas röda. På detta sätt blir det lättare att överskåda koden, hitta fel eller just det där elementet som du just i detta ögonblick behöver ändra på.

Leta reda på en bra nybörjarguide.

Det är inte lätt att lära sig CSS bara sådär, fast det finns såklart saker som är svårare. Det underlättar mycket om man har en bra nybörjarguide, eller en saklig liten guide som går igenom element efter element, och den generella syntaxen på språket man ska lära sig. Alla språk har regler, och alla regler har undantag. Dessa måste oftast “pluggas” in, alltså att man nöter in dem.

Det man dock ska tänka på, är att inte bara hålla sig till sin guide. Man kan inte bara läsa en eller ett par guider och sedan vänta sig att man ska kunna hela språket. Det man främst måste göra, det är att koda mycket. Kodar du inte själv, utforskar språket och dess möjligheter, så lär du dig inte. Dvs, så fort du lärt dig något nytt från guiden du håller dig till, släng in det på en sida! Har du lärt dig vad emelentet “float” gör, prova det, på en gång, använd det överallt på sidan, prova det i olika kombinationer.

Skaffa dig en bra referens.

En referens är ett papper, en sida eller en hel bok, som innehåller lite småsaker som kan vara lätta att glömma bort. När jag började koda CSS så slavade jag under W3Schools CSS-referens, eftersom jag hela tiden glömde bort vilka attribut som funkade under vilka element, eller hur vissa saker stavades, eller i vilken ordning attributen hamnade när man kortade av “background”.

Bra referenssidor:

W3 Schools CSS-referens
ilovejackdaniels “CSS-cheat sheet”/

Skriv CSS så ofta du kan!

Jag kan inte poängtera det här tillräckligt många gånger! Man *MÅSTE* försöka själv! Så mycket som möjligt! Annars går det inte!

Var inte rädd att göra fel

Du lär dig när du ska rätta till det! M.a.o, du lär dig av dina misstag. Hamnar den där förbannade diven fel? Rätta till det och lär dig något! Du kanske hade glömt sätta någon liten regel någonstans, eller satt lite för mycket padding. Det gör inget, världen går inte under, visst blir man frustrerad, men tålamod är kodarens största dygd.

Var lite galen!

Gör inte alla dina sidor vita med en kant på höger sida, med all text svart i samma typsnitt. Sätt lite galna färger! Gör så att alla olika element får olika bakgrundsfärger! Detta kan leda till att du lär dig något fruktansvärt, när du ser hur olika element reagerar gentemot varandra, vilka som har högst prioritet osv.

Max Design är bättre på att förklara hur man använder färger

Härma!

Såg du en snygg sida som du önskar att du också kunde göra? Gör den! Gör dig en likadan sida. Eller just den där lilla snygga detaljen, släng in den på en sida! Ändra på den, försök få den att passa. Funkar det inte, titta hur originalet är gjort. Använder han några element som är främmande för dig? Eller en annan kombination? Pröva dem! Titta lite i din referens och försök lista ut hur du kanske skulle kunna ha användning av det.

Det är alltid lamt och dumt att kopiera andras sidor på pricken, men de flesta som skriver CSS har gjort likadant. Många har inget emot att du kopierar strukturen på deras sida för att lära dig, så länge du inte lägger upp den på nätet eller använder den som din egen sida. Men inga ripoffs! Då kommer ditt rykte för evigt vara förstört. I stort sett.

Håll dig uppdaterad!

Det sker alltid förändringar i språk, just i CSS händer det inte ofta, men folk hittar ofta olika lösningar på de problem som kan uppstå. Eftersom dagens webläsare läser CSS på så olika sätt, uppstår ofta problem med hur en sida ser ut i olika webläsare. Därför använder sig många av olika “hack” för att komma förbi olikheterna. Det mest kända är “box model hacket” av Tantek, som ordnar upp ett stort problem i IE5, där IE reagerar annorlunda på padding. Hacks uppdateras ofta, eller kommer i bättre, mer användarvänliga eller designervänliga versioner, som funkar bättre eller som är snyggare. Därför gäller det sig att vara uppdaterad, oftast genom att läsa artiklar, surfa på forum, eller syndikera olika siter. Bloggar är ett bra sätt att hålla sig uppdaterad, de skriver ofta en länk i ett inlägg, eller beskriver en ny lösning på de äldsta problem, rakt i ett inlägg.

Bättre förklaring

Webbutveckling med standarder hos 456 berea street

Länksamling hos Dezwozhere
En skön artikel hos The Noodle Incident