Search Adaface test library by skills or roles
⌘ K

HTML/ CSS online -test

The HTML/ CSS test evaluates a candidate's ability to create web pages and style them using CSS. Using scenario-based MCQ questions, it evaluates knowledge of HTML (DOM, tags, forms, tables etc.) and critical CSS concepts (box model, positioning, styling, Flexbox, Grid etc.) and the ability to build responsive layouts. The test also includes simple coding questions to evaluate hands-on programming knowledge.

Anpassad baserat på:

  • Erfarenhet/ svårighetsnivå
  • Flera färdigheter i 1 bedömning
  • Jobbbeskrivning/ rollkrav

Täckta ämnen:

Core HTML tags
Handling HTML forms
Core CSS (box model; inheritance; specificity)
Styling HTML elements with CSS
Flexbox and Grids for modern layouts
Responsive websites using media queries
Working with images
Integrating custom fonts
CSS-based animations
Se hela listan
Singapore government logo

Anställningscheferna ansåg att de genom de tekniska frågorna som de ställde under panelintervjuerna kunde berätta vilka kandidater som hade bättre poäng och differentierade med dem som inte gjorde så bra. Dom är mycket nöjd med kvaliteten på kandidater som är kortlistade med AdaFace -screening.


Personalchef

Singapore regering

85%
minskning av screeningstiden

Sample HTML/CSS Online Test Questions

Dessa är bara ett litet urval från vårt bibliotek med 10 000+ frågor. De faktiska frågorna om detta HTML/CSS Online Test kommer att vara icke-googleable.

🧐 Fråga🔧 Skicklighet💪 Svårighet⌛ Tid
Kolumnbredder
CSS Grid Layout eller CSS Grid är en CSS -teknik som gör det möjligt för utvecklare att skapa komplexa lyhörda webbdesignlayouter enkelt och konsekvent i webbläsare. CSS -nätet introducerade en ny längdenhet (FR) för att skapa flexibla rutnätspår. För sitt skolprojekt skrev Nu följande kod. Vad förväntar du dig att kolumnbredderna ska vara?
 image
En: 1: a kolumnen är 50px bred, 2: a kolumnen är 150px bred och 3: e kolumnen är 300px bred. 
b: 1: a kolumnen är 50px bred, 2: a kolumnen är 50px bred och 3: e kolumnen är 100px bred.
C: 1: a kolumnen är 50px bred, 2: a kolumnen är 300px bred och 3: e kolumnen är 150px bred.
D: 1: a kolumnen är 50px bred, 2: a kolumnen är 500px bred och 3: e kolumnen kommer vara 1000px bred.

Options:

  • A
  • B
  • C
  • D
Html/cssLätt2 min
Länkar
I följande HTML, vad kommer att vara färgen på länken till klassen "Mark"
 image

Options:

  • orange
  • black
  • blue
  • white
Html/cssMedium2 min
Sidfotlista
Lägg märke till sidelementet på AdaFace -webbplatsen. Vad är det bästa sättet att skriva HTML -kod för detta?
 image
A) beställd lista 
b) oordnad lista i ett navelement
c) beställd lista inuti ett navelement
d) oordnad lista

Options:

  • A
  • B
  • C
  • D
Html/cssLätt2 min
alternativ
Vi måste skapa en HTML-form för användare så att de kan välja mellan "icke-vegetariska", "eggetarian" och "vegetarian". Användaren ska bara kunna välja ett av alternativen. Av följande alternativ, vilket är det bästa sättet att koda detta?
 image

Options:

  • A
  • B
  • C
  • D
Html/cssMedium2 min

How to use the Adaface HTML/CSS Online Test

Börja visa kandidater inom några minuter med Ready-to-go HTML/CSS Online Test

1. Välj det lämpligaste testet för din roll

2. Börja bjuda in kandidater att slutföra bedömningen

3. Få realtidmeddelanden och kortlista de bästa kandidaterna

Anpassa Adaface HTML/CSS Online Test Enligt din arbetsbeskrivning

1. Få en anpassad bedömning från vårt bibliotek med 500+ färdigheter inom 48 timmar

2. Börja bjuda in kandidater att slutföra bedömningen

3. Få realtidmeddelanden och kortlista de bästa kandidaterna

Adaface HTML/CSS Online Test litar på företag över hela världen

amazon
PayPal
Morgan Stanley
Adidas
SG Government
Neilsen
UCLA
Ernst and Young
Microsoft
WeWork
Bosch
Optimum Solutions
SAP
Doubtnut
Deloitte
HCL
FusionCharts
United Nations
Sokrati
Love Bonito
ZiMetrics
MTM

About the Adaface HTML/CSS Assessment Test

Utvärdera HTML/ CSS tekniska och kodningskunskaper med AdaFace -kompetensbedömningsplattform som drivs av en intelligent chatbot

Ämnen:

Kärnhtml -taggar
Strukturen på en HTML -sida
Mellanrum
Textformatering och dekoration
Listor
Bord
Bilder och bakgrundsbilder
Flexbox
Rutnät
Boxmodell
Positioneringssystem
Arv
Mediefrågor
CSS -egenskaper
Pseudoklass
Klasser, spann, divisioner
Textegenskaper, marginaler och stoppning
Gränser, bakgrunder och transparens
Positionering - relativ, absolut, fast, float, klar
Z-index
Övergångar
Animationer
Lyhörd layouter
Bädda in videor
Ankare/ länkar
Tabeller och kapslade bord
Byggnadsformulär
Inbäddning av iframes
Svgs
Filreferens
Knappar
Inmatningsområden
Välj menyer
Navigering
Teckensnitt
Former
Pre-processorer

Rekommenderade roller:

Webbutvecklare
Frontend Software Developer
Senior HTML Web Developer
Front-end Developer
Software Engineer (HTML/ CSS)
Senior Frontend Developer
Webbdesigner

Varför du ska använda detta HTML/ CSS -utvärderingstest

HTML/ CSS Online Assessment Test är designat och validerat av branschexperter för att hjälpa tekniska rekryterare och anställa chefer för att utvärdera HTML/ CSS -programmeringsförmågan hos kandidaten. Top Tech -företag använder vårt HTML/ CSS -programmeringstest för att minska kandidatens screeningtid med 85%.

Testet säkerställer att kandidaterna har följande egenskaper:

  • Kunskap om kärnhtml -taggar och CSS -egenskaper
  • Möjlighet att skapa lyhörd HTML med moderna layouter- rutnät, flexbox
  • Kunskap om hur CSS fungerar bakom kulisserna
  • Styling HTML -element med CSS för att vara närmare designmockups
  • Hantera bilder, teckensnitt, videor i HTML
  • Skapa läsbar och skalbar HTML- och CSS -kod
  • Förstå JS Dom -manipulation
  • Hands-On JavaScript-programmeringsspråk

Hur anpassar du testet för senior frontend -utvecklare?

Frågorna för äldre utvecklare kommer att involvera avancerade ämnen och kommer att ha högre svårighetsnivå. Här är få ämnen som frågorna kommer att baseras på för mellanliggande och erfarna webbutvecklare:

  • Fördjupad kunskap om hur CSS fungerar bakom kulisserna: kaskaden, specificitet, arv, värdebehandling, den visuella formateringsmodellen, boxmodellen, lådtyper, positioneringsscheman och staplingssammanhang
  • Responsiva bilder i HTML och CSS för snabbare sidbelastningar: Upplösningsomkoppling, densitetsomkoppling, konstriktning;
  • DOM -manipulation med JS
  • Avancerade CSS-väljare, pseudoklasser och pseudo-element
  • Avancerade CSS -animationer med @KeyFrames, Animation och övergång
  • JS-baserade animationer
  • SVG -bilder i HTML och CSS: Hur och varför man använder SVG, genererar SVG -spriter, byter SVG -färger i CSS och bästa praxis;
  • Advanced Responsive Design: Media Queries, Mobile-First vs Desktop-First, EM vs REM-enheter, Fluid Grids, Layout-typer, flexibla bilder, med mediefrågor för att testa för olika skärmbredd, pixeldensiteter och beröringsfunktioner
  • Moderna CSS-tekniker för att skapa fantastiska mönster: klippväg, bakgrundsklipp, mask-bild, bakgrundsblandning, form-outside, filter, bakgrundsfilter, objekt-fit, transform, kolumnräkning, bindestreck, perspektiv , calc () och anpassade CSS -egenskaper;

Dessutom kommer de kodande frågorna som används för att utvärdera JavaScript -färdigheter att vara av högre svårighetsnivå.

Distribution av testresultat

The actual score distribution will vary based on your candidate pipeline quality, but you should typically expect ~20% of the candidates to do well on Adaface assessments.

Poängfördelningen för våra bedömningar följer den normala kurvan. Detta är en bra teckenstandardiserade tester som SAT och GRE följer normalfördelningen (klockkurva).

Status quo -bedömningar har vanligtvis exakt motsatsen till klockkurvan (för många kandidater närmar sig 0, för många kandidater närmar sig 100 och för få kandidater i mitten). Detta beror vanligtvis på att de fokuserar på teoretiska frågor eller trickfrågor, som är mycket binära i naturen- antingen vet du tricket/ teorin eller så gör du inte.

Hur AdaFace är annorlunda

Behållare samtalsbedömningar återspeglar färdigheter på jobbet och ser en avslutningsgrad på 86% jämfört med ~ 50% för traditionella utvärderingsplattformar.

Gammal

Traditionella tester

Teoretiska frågor/ pussel

Känns som ett test

One-size-fits-all assessments

😞
Anställa
Veckor/månader

NYTT SÄTT

Adaface -bedömningar

Frågor för färdigheter på jobbet

Samtals-

Anpassat
bedömningar

😀️
Anställa
Dagar

HTML/CSS Online Test FAQs

Om HTML/ CSS -jobbroller

HTML (Hypertext Markup Language) är den mest grundläggande byggstenen på webben. Den definierar betydelsen och strukturen för webbinnehåll. Andra tekniker förutom HTML används vanligtvis för att beskriva en webbsides utseende/presentation (CSS) eller funktionalitet/beteende (JavaScript).

HTML-utvecklare ansvarar för den fullständiga kodningen av webbplatser. De ger teknisk support till användare, direkta projekt, kodwebbplatser, utvecklar webbaserade applikationer och utför tester på webbplatser. De arbetar med andra kodare, designers och innehållsutvecklare, vilket innebär att kommunikationsförmågor är viktiga. HTML -utvecklare måste kunna översätta mönster till kod och skriva teknisk dokumentation.

CSS -utvecklare är webbproffs vars huvudansvar är att leverera en polerad och utformad produkt till en användares webbläsare. Nästan varje webbplats använder CSS. De flesta frontend eller till och med fullstackutvecklare kunde skriva CSS-koden. Men inte alla kan fixa varje CSS -fel eller implementera mönster utan att inveckla HTML -kod eller förlita sig på JavaScript onödigt.

En HTML/ CSS -utvecklarens ansvar skulle vanligtvis inkludera:

-Översättning av designer mock-ups och trådramar till front-end-kod -Front-End-integration med en back-end-ramverk

  • Optimera applikationen för maximal hastighet och skalbarhet
  • försäkra att all användarinmatning valideras innan du skickar till back-end
  • Bygg återanvändbar kod och bibliotek för framtida användning
  • Integrera data från olika back-end-tjänster och databaser
  • Samarbeta med webbdesigners för att matcha visuell design avsikt

Kan jag utvärdera JavaScript tillsammans med HTML/ CSS?

Ja. Vi stöder utvärdering av JavaScript och HTML/ CSS i samma bedömning. Du kan granska vårt standardklara färdiga javascript, html/css test för att förstå hur bedömningen skulle utformas. För anpassade bedömningar utformar vi frågorna enligt din arbetsbeskrivning och det slutliga testet kommer att utvärdera JavaScript, HTML/ CSS och kodningskunskaper tillsammans.

Kan jag utvärdera frontendramar tillsammans med HTML/ CSS som React/ Angular/ Vue?

Ja. Du kan utvärdera flera färdigheter i en enda bedömning. Du kan kontrollera vår standard React, [Angular](https://www.adaface.com/assessment-test/ Angularjs-test), vue bedömningar för att få en känsla av vilka frågor som skulle ställas. Du kan få en anpassad bedömning utformad som har frågor för att utvärdera alla måste-ha färdigheter i din arbetsbeskrivning. Så för en standard REACT -utvecklarroll kommer testet att ha frågor för att utvärdera React, JavaScript, HTML/ CSS och kodningskunskaper.

Vad är en anpassad bedömning?

Varje roll är annorlunda och kräver en anpassad bedömning för att identifiera toppkandidater effektivt. AdaFace ämnesexperter förstår dina arbetsbeskrivning/ rollkrav och väljer de mest relevanta frågorna från vårt bibliotek med 10000+ frågor för att skapa en teknisk bedömning som hjälper dig att hitta de kvalificerade kandidaterna i din kandidatpipeline snabbt. Alla anpassade bedömningar inrättas baserat på arbetsbeskrivningen, rollkraven, måste-ha färdigheter, erfarenhetsnivå och lönesortiment inom högst 48 timmar och du får ett e-postmeddelande när det går live.

Kolla in en provbedömning här (inget kreditkort krävs).

Kan jag kombinera flera färdigheter till en anpassad bedömning?

Ja absolut. Anpassade bedömningar ställs in baserat på din arbetsbeskrivning och kommer att innehålla frågor om alla måste-ha färdigheter du anger.

Hur skiljer sig AdaFace från andra utvärderingsverktyg?

Vi tror att status quo -tekniska utvärderingsplattformar inte är ett rättvist sätt för företag att utvärdera ingenjörer eftersom de fokuserar på trickfrågor/ pussel/ nischalgoritmer. Vi började AdaFace för att hjälpa företag att hitta bra ingenjörer genom att bedöma färdigheter på arbetsplatsen som krävs för en roll. Läs mer om Varför vi började AdaFace.

Här är vad som är annorlunda med AdaFace:

-Högkvalitativa frågor som inte är googleable som testar för färdigheter på jobbet i motsats till teoretisk kunskap.

  • En vänlig samtalsbedömning med en chatbot, istället för att skicka ett "test" till en kandidat. Detta innebär en högre färdigställande. AdaFACE-bedömningar (86% kandidatens slutföringsgrad), i motsats till traditionella tester (40-50% kandidatens slutförande)
  • Anpassade bedömningar för 700+ färdigheter på olika erfarenhetsnivåer.

Har du några anti-cheating eller proctoring-funktioner på plats?

Vi har följande anti-cheating-funktioner på plats:

  • webbproctoring
  • webbkamera proctoring
  • Plageirism Detection
  • Icke-Googleable-frågor
  • säker webbläsare

Läs mer om proctoring -funktionerna.

Hur tolkar jag testresultat?

Det främsta att tänka på är att en bedömning är ett eliminationsverktyg, inte ett urvalsverktyg. En kompetensbedömning är optimerad för att hjälpa dig att eliminera kandidater som inte är tekniskt kvalificerade för rollen, den är inte optimerad för att hjälpa dig hitta den bästa kandidaten för rollen. Så det ideala sättet att använda en bedömning är att bestämma en tröskelpoäng (vanligtvis 55%, vi hjälper dig att jämföra) och bjuda in alla kandidater som gör poäng över tröskeln för nästa intervjurundor.

Vilken erfarenhetsnivå kan jag använda detta test för?

Varje AdaFace -bedömning anpassas till din arbetsbeskrivning/ idealisk kandidatperson (våra ämnesexperter kommer att välja rätt frågor för din bedömning från vårt bibliotek med 10000+ frågor). Denna bedömning kan anpassas för alla erfarenhetsnivåer.

Får varje kandidat samma frågor?

Ja, det gör det mycket lättare för dig att jämföra kandidater. Alternativ för MCQ -frågor och ordningen på frågor randomiseras. Vi har anti-cheating/proctoring -funktioner på plats. I vår företagsplan har vi också möjlighet att skapa flera versioner av samma bedömning med frågor om liknande svårighetsnivåer.

Jag är kandidat. Kan jag prova ett träningstest?

Nej. Tyvärr stöder vi inte övningstester just nu. Du kan dock använda våra exempelfrågor för övning.

Vad är kostnaden för att använda detta test?

Du kan kolla in våra prisplaner.

Kan jag få en gratis provperiod?

Plattformen är helt självbetjänande, så här är ett sätt att gå vidare:

  • Du kan registrera dig gratis för att få en känsla för hur det fungerar.
  • Den kostnadsfria provperioden inkluderar en provbedömning (Java/JavaScript) som du hittar i din instrumentpanel när du registrerar dig. Du kan använda den för att granska kvaliteten på frågorna och kandidaternas upplevelse av ett konversationstest på Adaface.
  • För att granska kvaliteten på frågorna kan du också granska våra offentliga frågor för 50+ färdigheter här.
  • När du är övertygad om att du vill testa det med riktiga bedömningar och kandidater kan du välja en plan enligt dina krav.

Jag flyttade precis till en betald plan. Hur kan jag begära en anpassad bedömning?

Här är en snabbguide om hur man begär en anpassad bedömning på Adaface.

Med AdaFace kunde vi optimera vår första screeningprocess med upp till 75%, vilket frigör dyrbar tid för både anställningschefer och vårt Talent Acquisition -team!


Brandon Lee, Folkchef, Love, Bonito

hashtag image heart icon Brandon
Join 1200+ companies in 75+ countries.
Prova det mest kandidatvänliga utvärderingsverktyget idag.
Har några frågor om AdaFace HTML/CSS Online Test?
Har några frågor om AdaFace HTML/CSS Online Test?
chatta med oss ✨
Villkor Integritet Förtroende