Hvis du vil have dit website til at se flot og lækkert ud, bliver du nødt til at hyre en udvikler med fokus på front-end delen. Der er en række ting en dygtig programmør til front-end udvikling skal have fokus på:
- Få websitet til at blive vist på den måde, det er ment ud fra design sketchet og muligvis forbedre det, i dialog med designeren.
- Opnå fuld funktionalitet mellem browsere (test af browsere).
- Få alt til at stå pixel-Perfect
- Minimere indlæsnings tiden på websitet.
Front-end udvikling kræver sans for detaljen
Front-end udvikling kræver både evner for programmering og design. Vi har set for mange tilfælde med udviklere, som ikke kan se forskel på ”Times New Roman” og ”Georgia”. Tilsyneladende ser de ens ud, men der er forskel.
Heldigvis, bliver ”ser ud til” og ”godt nok” aldrig nogensinde vores motto her hos CodeMakers. Vi bliver ofte rost af designere og design bureauer, for at være præcis ned til hver eneste pixel i vores skabeloner. Dette er for at sikre, at dit website vil se lige så godt ud i browseren, som det var i design sketchet, eller endda bedre.
Der er flere forskellige programmerings sprog, som bliver brugt i front-end udvikling som css, javascript og html5. Lad og se nærmere på disse.
CSS
Css er midtpunkt for front-end udvikling. Det er ansvarlig for alle grafiske detaljer på websitet, inklusiv layout, farver, marginer, former, skrifttyper og meget mere. Det er ligeledes et af de nemmere kodningssprog, selvom det er udfordrende at få det hele til at fungere ens, på tværs af browsere.
For mere information omkring funktionalitet i browsere læs her.
Javascript
Javascript er et meget stærkt programmerings sprog, som er værdsat højt hos CodeMakers. Populært sat er CSS delen det som får websitet til at se godt ud, og javascript er den del, som laver magi på hjemmesiden. Magi? Grunden til det er så stærkt, er, at Javascript er hele tiden ”tændt”, så det kan agere i henhold til de handlinger, der bliver gjort på sitet – i modsætning til server-side sprogene. For eksempel kan en menu foldes ud, når musen holdes over en menu.
Javascript kan også kommunikere med server-side scripts og ligeledes databasen ved behov. Her bruges noget kaldet AJAX forespørgsel.
Et godt eksempel på hvordan AJAX kan bruges, er til posting af kommentarer på Facebook. Kommentaren bliver synlig og er sendt til Facebook’s database, uden brugeren skal vente på at hele sitet bliver loaded igen. Dette er bare et lille eksempel, blandt et hav af de muligheder Javascript giver, som gør front-end udvikling spændende.
jQuery
Programmører leder hele tiden efter metoder, til at gøre tingene mere effektive. En af de mest effektive elementer er Javascript biblioteker. Hos CodeMakers bruger vi det mest populære Javascript bibliotek – jQuery.
HTML5
Kan du lide at eksperimentere med farver og funktioner? Eller måske du har brug for at vise en dynamisk skabt animation? For eksempel baseret på data, din kunde har indtastet? Så behøver du ikke kigge dig mere omkring. HTML5 er lavet lige præcis til dette, og meget mere.
HTML5 er et relativt nyt fænomen på internettet. Selvom de fleste ældre browsere ikke understøtter HTML5, er der nogle værktøjer som kan få HTML5 til at køre i forskellige browsere. Dette er blandt andet Internet Explorer 6,7 og 8, hvor tabet af ydeevne er minimal. Den største forskel HTML5 har bragt på banen er HTML5 Canvas. Blandt andet bruges HTML5 Canvas til at tegne og animere 2D skabeloner og 3D objekter.
Browsere og test
Engang ude i fremtiden vil alle front-end udviklere udvikle til den samme browser, men indtil da, er der forskellige overvejelser, som skal huskes, når man udvikler websites på tværs af browser. Browser tests er meget vigtig for front-end udvikling.
Hvorfor er test af browsere vigtigt?
Forskellige browsere har forskellige måder at tolke sidens kildekode på. Dette kan føre til at et website vises og/eller agerer forskelligt på tværs af forskellige browsere.
Vores standard løsninger inkluderer test og funktionalitet af følgende browsere:
- Internet Explorer 9
- Internet Explorer 8
- Internet Explorer 7 (Ikke altid. Afhænger af slutbrugeren)
- Chrome / Opera / Safari (Senesteversioner)
- Firefox (Senesteversioner)
- iPhone 4
- iPhone 3 (Ikke altid. Afhænger af slutbrugeren)
- iPad
For mere information omkring populærer browsere og trends i Danmark se:
http://fdim.dk/Statistik/teknik/browserbarometer