top 35 html5 interview questions
Preguntes d'entrevista HTML5 més freqüents amb respostes i exemples de codi:
HTML5 és l’última versió del llenguatge HTML, HTML significa Hyper Text Markup Language, és un llenguatge universal de marcat mundial que permet crear i dissenyar pàgines web per visualitzar-les a Internet.
HTML5, que es va publicar oficialment el 2012, admet totes les pàgines web existents.
En aquest article es tractaran les preguntes bàsiques i avançades d’entrevistes sobre HTML5 amb exemples perfectes per a principiants i professionals amb experiència.
Funcions d'HTML5
Hi ha diverses funcions destacables d'HTML5 i poques d'elles es detallen a continuació per a la vostra referència.
Les noves funcions d'HTML5 inclouen:
- Admet elements multimèdia com ara vídeo i àudio.
- Emmagatzematge local
- Admet alguns elements nous i atributs personalitzats.
- Nous elements de formulari com ara URL, data, interval, hora, color, etc.
Lectura recomanada => Top 30 de les preguntes sobre l'entrevista HTML
Preguntes i respostes d’entrevistes HTML5 més importants
A continuació, es detallen algunes de les preguntes més freqüents Preguntes HTML5 amb exemples de codificació per facilitar la vostra comprensió.
Prepara't !!
P # 1) Què és HTML5?
Resposta: HTML5 és la darrera versió del llenguatge d’etiquetatge HyperText que es pot referir al llenguatge principal WWW (World Wide Web), aquest llenguatge de marcatge millora un fitxer de text amb bits de codi, i aquest codi que podem dir com a 'etiquetatge' descriu estructura del document.
HTML5 proporciona algunes funcions estàndard com la de CSS, HTML, JavaScript i DOM, que al seu torn reduirà el requisit de connectors externs. És més marcatge substituir la seqüència d’ordres, un millor tractament d’errors, etc. HTML5 és independent del dispositiu.
HTML5 introdueix algunes funcions noves que es poden utilitzar per canviar la forma d’interacció de l’usuari amb els documents, com ara:
- Afegir noves regles d’anàlisi per millorar la flexibilitat.
- Afegint atributs nous.
- Permet l'edició fora de línia.
- Suport (Web SQL), - Un estàndard comú per emmagatzemar dades a bases de dades SQL.
- Protocol de suport i registre de gestors MIME.
Q # 2) Quina diferència hi ha entre HTML i HTML5?
Resposta: A continuació es dóna la diferència entre HTML i HTML5:
HTML5 | HTML |
---|---|
Permet arrossegar i deixar anar els efectes. | No permet l'efecte d'arrossegar i deixar anar. |
HTML5 és compatible amb vídeo i àudio d'alt nivell. | El suport d'àudio i vídeo d'alt nivell no forma part de la versió i les especificacions de l'HTML anterior. |
Canvas, SVG i altres gràfics vectorials virtuals són compatibles amb HTML5. | En HTML, si volem implementar gràfics vectorials, això només era possible utilitzant una biblioteca de tercers com VML, Silver-light, etc. |
SVG i MathML es poden utilitzar en text. | Això no és possible en HTML. |
La base de dades Web SQL, la memòria cau d’aplicacions i l’emmagatzematge web s’utilitzen com a emmagatzematge permanent. | La memòria cau del navegador es pot utilitzar com a emmagatzematge temporal. |
HTML5 és més adequat per a mòbils. | L’HTML no és compatible amb els mòbils. |
La declaració de tipus de document és senzilla i senzilla. | La declaració de tipus de document és llarga i complicada. |
Hi ha disponibles atributs Async, set de caràcters i ping. | Aquests atributs no estan disponibles en HTML. |
HTML5 suporta JavaScript per executar-se en segon pla. | No admet JavaScript per executar-se al navegador web. |
Podem dibuixar formes com rectangles, cercles i triangles en HTML5. | No és possible dibuixar formes com rectangles, cercles, triangles, etc. |
P # 3) Què és? Quins són els diferents tipus disponibles?
Resposta: La declaració proporciona instruccions al navegador web per entendre quina informació ha de mostrar-se i la necessitat de començar amb la declaració. A HTML5, la declaració DOCTYPE és molt curta i no distingeix entre majúscules i minúscules i s’escriu a la part superior de cada pàgina HTML5.
El següent DOCTYPE també és compatible amb HTML5:
Hi ha 3 tipus de DOCTIPUS que s’esmenten a continuació:
- Tipus de document estricte
- Tipus de conjunt de marcs
- Tipus de transició
Q # 4) Quines són les etiquetes noves de Media Elements en HTML5?
Resposta: Les etiquetes noves de Media Elements en HTML5 es mostren a continuació :
- : Sol·liciteu contingut multimèdia com sons, reproduccions d’àudio o música, incorporeu contingut d’àudio sense que calgui cap complement addicional com el reproductor flash.
- : Sol·liciteu contingut de vídeo com a reproduccions de vídeo o clip de pel·lícula, incrustar contingut de vídeo, etc.
- : Sol·liciteu diversos recursos multimèdia en elements multimèdia, com ara àudio, vídeo, imatge, etc.
- : Sol·liciteu una aplicació externa o contingut incrustat (un complement).
- : Sol·liciteu pistes de text als elements multimèdia com ara vídeo o àudio. Aquesta etiqueta s'utilitza per a subtítols o fitxers de subtítols mentre es reprodueix el suport de vídeo.
P # 5) Què és una etiqueta a HTML5?
Resposta: Una etiqueta és un contingut especial en HTML5, que està envoltat per un claudàtor (). S’utilitza un símbol barra (/) per tancar l’etiqueta després de completar el bloc.
Per exemple
This is my Browser
Una etiqueta HTML5 és un conjunt de caràcters que desenvolupen una ordre formatada per a una pàgina web. Aquestes ordres formatades es comuniquen i envien la instrucció al navegador.
Q # 6) Què és el nombre mínim d’etiquetes HTML5 necessàries per crear una pàgina web?
Resposta: Es necessiten 3 etiquetes HTML5 com a mínim per crear una pàgina web, com ara (,,).
P # 7) Quina és la importància d'arrossegar i deixar anar a HTML5?
Resposta: Arrossegar i deixar anar és el concepte d’interfície d’usuari més important que facilita agafar un objecte i arrossegar-lo al lloc que vulgueu amb l’ajut d’un clic del ratolí.
Algunes de les característiques més habituals que s’utilitzen principalment en les operacions d’arrossegar i deixar anar són moure, enllaçar o copiar.
Podem arrossegar una imatge mitjançant elements, escriviu = , per fer que la imatge es pugui arrossegar i establir l'atribut de la imatge arrossegable a true.
Q # 8) Expliqueu els nous tipus d'entrada de formulari en HTML5.
Resposta: HTML5 té 14 tipus d’entrada de formularis nous:
- Data: Es tracta d’un selector de dates. Podem escollir una data utilitzant type = 'data'.
- Setmana: Aquest és un selector de setmanes, podem escollir una setmana mitjançant type = 'Setmana'.
- Mes: Aquest és un selector de mesos, podem escollir un mes mitjançant type = 'Mes'.
- Temps: Es tracta d’un selector de temps, podem escollir l’hora utilitzant type = 'temps'.
- datetime: Es tracta d’una data i hora combinades, podem escollir la combinació de data i hora utilitzant type = 'Datetime'.
- Data-hora local: Com a data i hora local combinades, podem escollir la combinació de data i hora local mitjançant el tipus = 'Data-hora-local'.
- Correu electrònic: Permet una o més adreces de correu electrònic, podem introduir diverses adreces de correu electrònic mitjançant type = 'Correu electrònic'.
- Telèfon: Permet diferents números de telèfon a tot el món. El client valida un número de telèfon. Podem introduir un número de telèfon mitjançant type = 'Telèfon'.
- Cerca: Permet fer consultes mitjançant text d’entrada. Podem introduir diverses consultes mitjançant type = 'cerca'.
- Número: Permet inserir un valor numèric amb atributs addicionals, com ara mín., Màx. etc., i podem introduir diversos valors numèrics mitjançant el tipus = 'Número'.
- URL: Un tipus d'entrada d'URL que s'utilitza per a l'adreça web. En un únic URL, podem utilitzar diversos atributs mitjançant type = 'Url'.
- color: Permet seleccionar diversos colors, podem seleccionar diversos colors utilitzant type = 'Color'.
- Rang: Permet inserir un valor numèric dins d'un interval específic, l'interval és similar al nombre, però és molt específic. Podem introduir un valor numèric dins d’un interval mitjançant el tipus = 'Gamma'.
- Posseïdor del lloc: Permet mostrar una pista breu (generalment en un color clar) als camps d’entrada, abans d’introduir el valor. Podem escriure una petita pista al camp d’entrada utilitzant type = 'posseïdor del lloc'.
P # 9) Què és el mapa d'imatges a HTML5?
Resposta: Els mapes d’imatges són una combinació d’URL i imatges, en fer clic a aquestes imatges (zona on es pot fer clic) s’obriran diferents pàgines web noves.
Hi ha disponibles dos tipus de mapes d’imatges en HTML5, és a dir, del costat del client i del servidor:
El mapa d’imatges del costat del client es crea mitjançant dos elementsand, on el mapa conté la informació del mapa i l'element de l'àrea pren els atributs per definir cada secció del mapa. Mapa d'imatges al costat del servidor creat mitjançant l’ús de l’atribut, l’atribut usemap és el nom del nostre mapa.
P # 10) Com s'escriu un símbol de copyright en una pàgina del navegador web?
Resposta: Per escriure un símbol de copyright, hem d’escriure © o © en un fitxer HTML5.
Q # 11) Com optimitzar els recursos del lloc web?
Resposta: Hem d’entendre algunes regles bàsiques d’optimització per optimitzar els recursos del lloc web. Inicialment, hauríem de reduir la mida de la baixada i fer menys sol·licituds http.
Per optimitzar els recursos del lloc web, podem seguir les tècniques següents:
- Compressió de fitxers
- Concatenació de fitxers
- Allotjament CDN
- Descàrrega d’actius
- Reorganització
- Codi de refinament
P # 12) Quin ús fa MathML Element a HTML5?
Resposta: La paraula MathML (Mathematical Markup Language) és un llenguatge de marques que s’utilitza per mostrar l’expressió científica i matemàtica a la xarxa. MathML és una forma de XML (llenguatge de marques extensible) per descriure la notació matemàtica.
Podem utilitzar ... etiquetes dins dels documents HTML5 per implementar l'element MathML.
Exemple: imprimeix a² + 2b + 5 = 0 mitjançant codi HTML5.
MathMl Example
Nota: Si MathML l’utilitza una aplicació que compleix l’espai de noms en una recomanació XML, s’hauria d’utilitzar l’espai de noms següent:
http://www.w3.org/1998/Math/MathML
P # 13) Quines són les diverses etiquetes de format a HTML5?
Resposta: HTML5 té algunes etiquetes de format antigues i noves, tal com es mostra a continuació:
- Text marcat: Representa el text ressaltat a efectes de referència. Podem utilitzar
> etiquetes per ressaltar el text. - Text suprimit: Especifica el bloc de text suprimit. Podem utilitzar etiquetes per implementar un text suprimit.
- Text destacat: Defineix el text ressaltat. Podem utilitzar etiquetes per implementar un text emfatitzat.
- Text inserit: Insereix un bloc de text en un document. Podem utilitzar etiquetes per implementar un text inserit.
- Petit text: Mostra el text inserit en una mida petita. Podem utilitzar etiquetes per implementar un petit text.
- Text de la superíndex: Es tracta d’un text superíndex. Podem utilitzar etiquetes per implementar un text de superíndex.
- Text del subíndex: Aquest és un text subscrit. Podem utilitzar etiquetes per implementar un text de superíndex.
P # 14) Per què fem servir HTML5?
Resposta: HTML5 admet animacions, dibuixos, àudio, vídeo, etc. i incorpora fàcilment un vídeo a la pàgina web. No necessita cap programari addicional com Flash per veure vídeos.
A continuació es detallen algunes de les raons importants per utilitzar HTML5:
- Herència i compatibilitat amb diversos navegadors
- Millors interaccions
- Emmagatzematge més intel·ligent
- Codi més net
P # 15) Què és un hiperenllaç? Només s'aplica al text?
Resposta: L'hiperenllaç és un enllaç que permet a un usuari passar d'una pàgina web a una altra pàgina web quan es fa clic. El concepte d’hiperenllaç s’utilitza tant en text com en imatge, i podem convertir una imatge en un enllaç amb l’ajuda de > etiquetes.
Exemplea C A continuació, es mostra un enllaç en una imatge (imatge on es pot fer clic).
Image Hyperlink Example Click the following link
P # 16) Expliqueu el concepte d'emmagatzematge web en HTML5.
Resposta: L’emmagatzematge web proporciona la possibilitat d’emmagatzemar localment les dades de les nostres aplicacions web al navegador de l’usuari. Pot emmagatzemar fins a 10 MB de dades. L’emmagatzematge web ajuda a augmentar el rendiment de les nostres aplicacions.
Hi ha dos tipus d’emmagatzematge web que s’utilitzen per emmagatzemar dades localment en HTML5:
- Emmagatzematge local: Emmagatzema les dades que no caducaran ni esborraran automàticament quan un usuari tanca o torna a obrir un navegador.
- Emmagatzematge de la sessió: Emmagatzema dades només per a una sessió (és a dir, un usuari que navega per internet o lloc web). Un cop tancat el navegador, les dades de sessió se suprimiran automàticament del navegador web.
P # 17) Expliqueu l'API de geolocalització en HTML5.
Resposta: L’API de geolocalització s’utilitza per localitzar la posició geogràfica d’un usuari.
Per motius de privadesa, es demana permís a l’usuari per informar de la informació d’ubicació. Utilitzar el navigator.geolocation.get posició actual () mètode per obtenir la posició i les coordenades geogràfiques de l’usuari (longitud i número de latitud).
Per exemple, a Retornar la posició de latitud i longitud d'un usuari es mostra a continuació.
Click The My Location Button to get your Location.
My Location var x = document.getElementById('location'); function getLocation() { if (navigator.geolocation) { navigator.geolocation.getCurrentPosition(showPosition); } else { x.innerHTML = 'Geolocation is not supported by this browser.'; } } function showPosition(position) { x.innerHTML = 'Latitude: ' + position.coords.latitude + '
Longitude: ' + position.coords.longitude; }
Exemple explicat:
- Comproveu si la geolocalització és compatible o no.
- Si la Geolocalització és compatible, executeu el mètode getCurrentPosition (). Si la geolocalització no és compatible, mostreu el missatge d'error a l'usuari.
- Si el mètode getCurrentPosition () té èxit, retorna les coordenades i les funcions especificades al paràmetre.
- La funció showPosition () obté la sortida: longitud i latitud.
P # 18) Expliqueu els gràfics HTML5.
Resposta: HTML5 admet dos tipus de gràfics, és a dir, Canvas i SVG.
a) Canvas: L'element s'utilitza per dissenyar gràfics a la pàgina web i disposa de diversos mètodes per dibuixar cercles, quadres, afegir imatges i text. 300 px X 150 px (amplada X alçada) és la mida de píxel predeterminada del llenç.
Exempleper dibuixar una caixa quadrada amb un element de llenç es mostra a continuació.
#mycanvas{border:2px solid pink;}
b) SVG: Els gràfics vectorials escalables s’utilitzen principalment per a aplicacions gràfiques i diagrames de tipus vectorial escalable, com ara el sistema de coordenades X, Y, els gràfics bidimensionals i circulars. Això el fa més ràpid i lleuger. SVG segueix el format XML.
Exemplea continuació es mostra per dibuixar un rectangle amb un element SVG.
P # 19) Quins avantatges té utilitzar HTML5?
Resposta: HTML5 és la versió avançada d’HTML. HTML5 permet crear llocs web més fàcils o interactius incrustant vídeo, àudio i gràfics a la pàgina web.
HTML5 admet tecnologia multimèdia i contingut gràfic a la web sense utilitzar cap complement de tercers.
Algunes de les funcions més importants afegides per HTML5 són:
- Geolocalització
- Memòria cau d'aplicacions fora de línia
- Base de dades del client
- Gestió d'errors
- Nova estructura i nous elements multimèdia.
- Suport i compatibilitat del navegador.
Admet algunes noves interfícies de programació d'aplicacions (API) com:
- Gestió de l’historial del navegador
- Arrossegar i deixar anar
- Dibuix 2D en una pàgina web
- Reproducció multimèdia de temps
Les aplicacions compatibles inclouen:
- Treballadors web: JavaScript
- Accés a fitxers locals
- Memòria cau d'aplicacions
- Emmagatzematge de dades locals
- Bases de dades SQL locals
P # 20) Com es crea un enllaç que es connectarà a una altra pàgina del navegador web quan es faci clic a HTML5?
Resposta: Utilitzeu l’etiqueta per crear hiperenllaços, que s’utilitzen per connectar-vos a una altra pàgina web. Podem crear un hiperenllaç utilitzant type = text etiqueta. Quan fem clic al text, s'obrirà l'URL enllaçat de la pàgina web.
Per exemple , el codi següent és un enllaç que condueix a la pàgina d'inici de Yahoo, ubicada a l'adreça https://in.yahoo.com
Yahoo link
Visit Yahoo Home Page
P # 21) Quants navegadors web admeten HTML5?
Preguntes i respostes d'entrevistes d'Android durant 3 anys d'experiència
Resposta: La majoria de les versions més recents d’Apple Safari, Google Chrome, Opera, Internet Explorer i Mozilla Firefox són compatibles amb HTML5.
P # 22) Quines són les API d'ús freqüent a HTML5?
Resposta: Una llista de les API més útils amb freqüència en HTML5 inclouen:
- Mitjana API
- API de transferència de dades
- API de memòria cau d'aplicacions
- Interacció de l'usuari
- API d’història
- API de validació de restriccions
- API d'ordres
- API de seguiment de text
P # 23) Quantes etiquetes s'han eliminat a HTML5?
Resposta: La llista de les etiquetes que s’eliminen completament a HTML5 inclouen:
P # 24) Quins formats de vídeo i àudio s'utilitzen per inserir a la pàgina web?
Resposta: A continuació es donen els formats de vídeo i àudio que s’utilitzen per incrustar a la pàgina web:
- Vídeo: MPEG4, Ogg, WebM.
- àudio: WAV, Ogg Vorbis, MP3.
Q # 25) Enumereu els elements de l'estructura de pàgina d'HTML5.
Resposta: Els elements d’estructura de pàgina d’HTML5 es donen a continuació:
- : Representa la secció de capçalera i emmagatzema la informació inicial sobre la pàgina web.
- : Representa la secció de peu de pàgina (última porció) de la pàgina.
- : Representa els elements de navegació de la pàgina HTML.
- : És un conjunt d'informació.
- : És un conjunt d’instruccions que s’utilitzen dins del bloc d’articles per definir l’estructura bàsica d’una pàgina.
- : Contingut de la barra lateral de la pàgina.
P # 26) Expliqueu algunes de les llistes habituals per dissenyar una pàgina web.
Resposta: Les llistes habituals per dissenyar una pàgina web inclouen:
- Llista de directoris
- Llista de definicions
- Llista ordenada
- Llista de menús
- Llista no ordenada
Diferents - S’utilitzen diferents etiquetes per compondre cada llista.
P # 27) Quin ús fa de l'etiqueta de sortida a HTML5?
Resposta: tag s'utilitza per representar els diferents tipus de resultats i resultats.
P # 28) Quin element proporciona la funció d’autocompletar en un quadre de text?
Resposta: A HTML5element, proporciona la funció d’autocompletar en un quadre de text.
P # 29) Com inserir vídeo i àudio a HTML5?
Resposta:
Vídeo:
Exemple per inserir un vídeo a HTML5:
àudio:
Exemple per inserir un àudio a HTML5:
P # 30) Quines són les etiquetes migrades d'HTML4 a HTML5?
Resposta: A continuació es mostra la llista de les etiquetes migrades d’HTML4 a HTML5:
HTML4 típic HTML5 típic
P # 31) Quina és la part de les tecnologies HTML5?
Resposta: La llista es mostra a continuació:
- Treballadors web
- Emmagatzematge web
- SVG
- CSS3
- Esdeveniments enviats al servidor (SSE)
- Microdades
- Intencions web
- Preses web
- Sol·licitud fora de línia
- Geolocalització
- Fitxer API
- Missatgeria web
- Arrossegar i deixar anar
- Llenç 2D
P # 32) Quina diferència hi ha entre els elements SVG i Canvas?
Resposta:
SVG | Elements de lona |
---|---|
SVG no és adequat per a gràfics de jocs. | Canvas és adequat per a jocs gràfics. |
Es basa en el model d’objectes. | Es basa en píxels. |
És adequat per utilitzar àrees de renderització grans. | És adequat per utilitzar zones de renderització petites. |
SVG proporciona qualsevol suport per als gestors d'esdeveniments. | Canvas no proporciona cap recurs per als gestors d'esdeveniments. |
Es permet la modificació mitjançant script i CSS. | La modificació només es permet mitjançant script. |
El SVG té una millor escalabilitat | El llenç té poca escalabilitat. |
SVG està basat en vectors (compost de formes). | Canvas està basat en ràster (compost per un píxel). |
SVG no depèn de la resolució. | El llenç depèn completament de la resolució. |
SVG és capaç d’animar l’API. | Canvas no té cap API per a l'animació. |
SVG és adequat per imprimir amb alta qualitat i qualsevol resolució. | El llenç no és adequat per imprimir d'alta qualitat i alta resolució. |
P # 33) Quin ús fa de l'etiqueta a HTML5?
Resposta: L'etiqueta de figura s'utilitza per afegir una imatge al document en una pàgina web.
P # 34) Què són les microdades a HTML5?
Resposta: Les microdades són una nova sintaxi semàntica senzilla que s’utilitza per afegir els grups imbricats de noms i parells de dades als documents, que normalment es basen en el contingut de la pàgina. Les microdades s’utilitzen per a nous atributs globals.
P # 35) Expliqueu les metaetiquetes.
Resposta: Les metaetiquetes s’utilitzen per proporcionar informació útil a les nostres pàgines web.
Algunes de les etiquetes inclouen:
- Títol: Proporciona un títol a la pàgina web.
- Estil: Insereix alguns estils i detalls CSS a la pàgina web.
- Enllaç: Defineix la relació entre una pàgina a una altra pàgina i una font externa.
Algunes abreviatures útils
- XML: Llenguatge de marques extensible
- W3C: World Wide Web Consortium
- SQL: Llenguatge de consulta estructurat
- JPEG: Grup conjunt d’experts en fotografia
- IP: Protocol d'Internet
- HTTP: Protocol de transferència d’hipertext
- href: Referència d’hipertext
- FTP: Protocol de transferència de fitxers
- INCENDI: Interfície de programació d'aplicacions
- AQUÍ: Entorn de desenvolupament integrat
- TRAMA: Eina de tipus de lletra d’incorporació web
- JUDICI: Model d'objectes de documents
- URL: Localitzador Uniforme de Recursos
Conclusió
HTML5 es pot considerar com la base de les tecnologies web, aquesta és la tecnologia principal que s’utilitza per crear pàgines web.
Molts professionals que tenen la intenció de construir una carrera en tecnologia web han d'aprendre HTML5. HTML5 no només és la subestructura de les tecnologies web, sinó que també s’utilitza per desenvolupar aplicacions mòbils. Terminològicament, HTML5 no és un llenguatge de programació, sinó un llenguatge de marques.
Aquest article serà una guia per a la llista de les preguntes i respostes més importants de l’entrevista HTML5, ja que cobreix les preguntes i respostes bàsiques i avançades d’entrevistes HTML5. Estem segurs que aquests són al seu torn els excel·lents recursos per ajudar-vos a preparar-vos per a l’entrevista HTMl5.
Espero que aquest article us ajudi a trencar amb èxit qualsevol entrevista HTML5.
Lectura recomanada
- Preguntes i respostes de l’entrevista
- Preguntes i respostes d’entrevistes de proves ETL
- Més de 35 preguntes i respostes de les entrevistes principals d'Apache Tomcat
- Algunes preguntes i respostes de proves manuals complicades
- 25 millors preguntes i respostes d’entrevista de proves àgils
- Top 35 de les preguntes i respostes de les entrevistes d'Android
- Preguntes d'entrevistes de Spock amb respostes (més populars)
- Algunes preguntes d’entrevistes de proves de programari interessants