Brainscape's Knowledge GenomeTM

Browse over 1 million classes created by top students, professors, publishers, and experts.


See full index

B3 Desarrollo de sistemas > Tema_8_HTML > Flashcards

Tema_8_HTML Flashcards

HTML

1
Q

Di nombres de preprocesadores HTML:

A

PSHH

  • PUG
  • SLIM
  • HANDLEBARS
  • HAML
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
2
Q

¿Qué es Webkit?

A

Motor de renderizado para navegadores.
Principalmente para Safari.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
3
Q

¿Que es un Atributo en HTML?

A
  • Todos los elementos HTML pueden tener Atributos.
  • Proporcionan info adicional sobre el elemento
  • Siempre se ponen en la etiqueta de apertura.
  • La sintaxis es (nombre=”valor”)
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
4
Q

¿Qué es el API DATASET?

A

Se usa para acceder de forma dinámica, por JavaScript, a los atrivutos data- *

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
5
Q

Nombra 4 gestores de dependencias:

A
  • BOWER - Gestor de paquetes WEB. Contiene HTML, CSS, JavaScript, fuentes e imágenes.
  • YARN (JAVASCRIPT)
  • NPM (Para Node,js, Javascript)
  • COMPOSER (PHP)
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
6
Q

Librería para detectar qué API’s soporta un navegador:

A

Modernizr.
Es una biblioteca de Javascript, para HTML5 y CSS3.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
7
Q

Diferencia entre LINK ABSOLUTO y LINK RELATIVO.

A

En el enlace absoluto, hay que poner la URL completa, porque apuntamos a una web externa.

En el enlace relativo, se puede poner la dirección abreviada, porque apuntamos a una web local.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
8
Q

¿Con qué método puedes añadir un nuevo elemento de forma dinámica a un html?

A

document.createElement()

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
9
Q

Elementos del API del DOM básico.

A

NODO

ELEMENT ATTR TEXT DOCUMENT

https://www.w3schools.com/jsref/dom_obj_document.asp

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
10
Q

¿Que es DOM?

A

Document Object Model

  • Es una API para documentos web validos (HTML) y bien construidos (XML).
  • Define la estructura lógica de la web y la forma de acceder al documento y manipularlo.
  • Todo HTML se representa como un árbol.
  • Cada elemento del HTML es un nodo. Las etiquetas, los atributos, el texto dentro de las etiquetas…
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
11
Q

¿Qué es CONTENTEDITABLE?

A

Es un atributo enumerado y global, que indica que el elemento debe ser editado por el usuario.

Enumerado, porque hay que poner “True” o “False”. Si se deja en blanco, el valor de default, es heredado de su padre.

Ejemplo:
//<p contenteditable="true">This is a paragraph. It is editable. Try to change this text.</p>

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
12
Q

¿Que es WAI-ARIA?

A

Web Accessibility Initiative - Accesible Rich Internet Applications

Es una especificación técnica, publicada por el W3C, que intenta incrementar la accesibilidad de las páginas WEB. En particular, contenidos dinámicos, Ajax, HTML, JavaScript, etc..

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
13
Q

¿Dí 4 FRAMEWORKS de javascript?

A
  • Angular
  • Vue.js
  • Ember.js
  • Reactjs
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
14
Q

¿Que hace QuerySelector?

A

Utiliza SELECTORES CSS, para hacer una búsqueda. Es muy potente.
Es un método del DOM y se usa dentro de la etiqueta Script.
La sintaxis sería:
document.queryselector(selector);

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
15
Q

¿Como se usan los métodos del DOM?

A

se pone por ejemplo:
document.getElementById(“nombredelelemento”)
Y todo esto dentro de la etiqueta Script

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
16
Q

¿Qué es Ajax?

A
  • Apareció en HTML 4.
  • Asynchronous JavaScript And XML.
  • Usa el objeto: XMLHttpRequest.
  • Asíncrono.
  • Actualiza partes de una web, sin recargarla toda por completo.
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
17
Q

¿Que hace AppendChild?

A

Agrega un nuevo nodo al final de la lista de un elemento hijo de un elemento padre especificado.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
18
Q

Di 10 API’s de HTML 5..

A

1- Web Storage, proporciona mecanismos para que el navegador pueda almacenar datos de tipo CLAVE/VALOR. Pueden guardarse mientras no se cierre el navegador, con SessionStorage, o de forma persistente con LocalStorage.
2- IndexedDB, permite almacenamiento y recuperación de datos, en una BBDD local, en el equipo del usuario.
3- Geolocation, permite averiguar la posición del usuario, con su consentimiento.
4- File, permite cargar un documento en el navegador e interactuar con el. NO SE PUEDE HACER CON UN FICHERO LOCAL.
5- Canvas, nos permite dibujar.
6- Worker, permite ejecutar Scripts en segundo plano, sin interrumpir el hilo principal.
7- WebSocket (Bidireccional) / Server Send Events (De servidor a cliente) técnica push.
8- Drag and Drop, permite arrastrar y soltar elementos.
9- Selector (css)
10- Microdata/Dataset, son la parte de extensibilidad de HTML5.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
19
Q

Automatizadores HTML:

A

GULP

GRUNT

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
20
Q

¿Qué es JavaScript Vanilla?

A

Es JavaScript puro, sin librerías ni nada externo.

Se usaba al principio.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
21
Q

¿Qué es una librería?

A

Un conjunto de Funciones/Clases

22
Q

¿Qué es ECMASCRIPT?

A

Es el estandar de Javascript.

La última versión es la 12.

23
Q

Editores de HTML

A
  • Atom
  • Sublime Text
  • Visual Studio Code
  • Notepad++
24
Q

¿Que es una API?

A
  • Conjunto de especificaciones funcionales que tienen que cumplir una serie de librerías.
  • La utilidad de un API es poder cambiar de librería, sin cambiar de código.
  • Es como un adaptador de interfaces., para software.
25
Q

Si nuestro navegador no implementa de forma nativa una determinada API, se puede simular con unos plugins llamados….??

A

Polyfills.

26
Q

Dí Frameworks de HTML:

A
  • Bootstrap
  • Foundation
  • Skeleton
  • Boilerplate
27
Q

¿Qué es PLACEHOLDER?

A

Es una explicación que aparece dentro de la caja y que desaparece al empezar a escribir.

28
Q

¿Qué es MVVM?

A

Marca la arquitectura que usan los Frameworks de HTML
Model View ViewModel
Aisla la parte visual, de la parte del modelo.
La vista modelo es la que hace de intermediaria entre Vista y modelo.

29
Q

¿Como es el inicio de una página de HTML5?

A

Hay que poner
~~~
<!DOCTYPE html>
~~~

30
Q

¿Que es BLINK?

A

Motor de renderizado desarrollado por Google, a partir de una bifurcación de Webkit. Es usado por Opera, Chrome y Edge, entre otros.

31
Q

¿Objeto que al usar XHR, va a inicializarse al recibir los datos?

A

Onreadystatechange

32
Q

¿En Ajax, donde se almacenan los datos recibidos?

A
  • Responsetext
  • Responsexml
33
Q

Fichero de NPM donde se definen las dependencias.

A

package.json

34
Q

¿Qué es node_modules?

A

Donde se instalan las dependencias que tenemos listadas en package.json

35
Q

¿Donde está Queryselector?

A

Dentro de APISelector

36
Q

Con la accesibilidad en mente, ¿ Qué atributo se coloca en una etiqueta, para describir su contenido y dotarlo de semántica, para un lector de pantalla, por ejemplo?

A

El atributo ALT.

Por ejemplo, si ponemos una imagen y no se carga por un fallo en la conexión o por que se está usando un lector de pantalla, se lee entonces el atributo alt y nos dice lo que hay.

El atributo alt, sería así:

img src=”foto.jpg” alt=”Esta foto es de una rana”

37
Q

¿Qué tipos de atributos tenemos en HTML?

A

“GEROE”
* Atributos Globales - Son los que se pueden usar con todas las etiquetas.
* Atributos de Eventos - Provocan un comportamiento concreto bajo un disparador.
* Atributos Requeridos - Acompañan siempre a ciertas etiquetas, para que estas funcionen correctamente.
* Atributos Opcionales - Modifican la funcionalidad de ciertas etiquetas.
* Atributos Estandar - Soportados por la mayoría de elementos.

38
Q

Title puede ser Atributo ó Etiqueta??

A

Si, existe de las dos maneras.
Como etiqueta tiene mucha importancia en el SEO (Search Engine Optimization), por que es lo que se usará para ordenar las webs.
Solo puede haber un Title por html.
Como Atributo, ofrece información adicional, al poner el cursor encima de un elemento.

39
Q

Dí varias etiquetas de HTML que aparecen en el body:

A
40
Q

¿Qué novedades incorpora HTML5?

A
  • API’s
  • Nuevas etiquetas de Semántica y Multimedia.
  • Editores como Atom, Sublime, VSCode.
  • Preprocesadores CSS
  • Frameworks, que se ajustan a MVVM.
  • Nuevos lenguajes de Scripting. (Que hay que traducir).
  • Herramientas de gestión de dependencias, automatización de tareas, plantillas de proyectos.
  • Etiquetas (Canvas 2D, 3D, audio y video), con codecs para mostrar contenidos multimedia. Los codecs pueden ser libres como, WebM+VP8 o privados como, H.264/MPEG-4 AVC.
  • Etiquetas para Manejar grandes conjuntos de datos: Datagrid, Details, Menu y Command, aunque estas etiquetas no las he visto.
  • Mejoras en los formularios.
  • Visores con MathML (fórmulas matemáticas) y SVG (Gráficos Vectoriales).
  • Drag & Drop.
41
Q

Frameworks vs Preprocesadores

A

Los Frameworks, son como plantillas, que tienen como partes ya construidas de HTML, para ahorrarnos trabajo.
Los Preprocesadores le dan capacidades adicionales al HTML, que de forma nativa no tienen.
Los Frameworks, suelen tener interfaz de usuario.

42
Q

¿Qué era CGI?

A
  • Common Gateway Interface.
  • Era una tecnología para generar páginas dinámicas.
  • Con cualquier lenguaje que cumpliera una serie de normas.
43
Q

Diferencia entre Librerías, API’s y Frameworks:

A
  • Librería -> Conjunto de funciones/clases. El flujo de ejecución lo marca tu programa.
  • API -> Conjunto de especificaciones funcionales que tienen que cumplir una serie de librerías. Así, se puede cambiar de librería, sin tener que cambiar tu código.
  • FRAMEWORK -> Conjunto de clases que proporcionan una arquitectura base para generar aplicaciones. El flujo de ejecución es compartido.
44
Q

Páginas para consultar las etiquetas de HTML5

A

https://www.htmlquick.com/es/reference/tags.html
https://html.spec.whatwg.org/multipage/

45
Q

Cosas sobre las nuevas etiquetas de Semántica:

A
  • header -> Puede aparecer al principio del HTML o también en mitad de otra etiqueta. NO CONFUNDIR CON “HEAD”.
  • main -> Etiqueta de contenido principal. Puede haber más de uno, pero solo una visible, el resto “hidden”.
  • nav -> Para agrupar los enlaces más importantes.
  • section -> Representa una sección del documento.
  • article -> Contenedor de bloques de contenido, que se consideran INDEPENDIENTES y pueden ser VISTOS, REUTILIZADOS Y DISTRIBUIDOS POR SEPARADO, por ejemplo en Sindicación.
  • aside-> Es información adicional.
  • footer -> También puede aparecer en mitad de otra etiqueta. Es un pie.
  • figure -> Vale para ilustraciones, textos, etc.
  • figcaption ->

Y más…..

46
Q

Mirar etiquetas de Head

A
  • meta name
  • meta charset
  • link rel= “alternate”
  • link rel = “stylesheet” href=”estilo.css”
  • link rel = “prev”
  • link rel = “next”
47
Q

¿Qué son en HTML5, los atributos “data - **”?

A
  • Son atributos personalizados, es decir, que los podemos crear a nuestro antojo.
  • Después, podemos buscarlos, con JavaScript, con el método “dataset”.
48
Q

HTML5 también tiene su parte de extensibilidad. ¿Qué nos encontramos en esta parte?

A
  • Atributos personalizados con “data -**”. Dataset, para buscarlos.
  • Podemos definir semántica con “itemtype” e “itemprop”. Genera Microdata.
49
Q

¿Qué es el “Document” en el DOM?

A
  • Es el nodo que representa a todo el HTML o XML que forma la página.
  • Se aplica tanto a HTML como a XML.
50
Q

Dí 5 métodos de “Document”:

A
  • getElementByID (…)
  • getElementByTagName
  • getElementByClassName
  • querySelector (selector)
  • createElement (…)
51
Q

¿Qué es PUG/JADE?

A

Permite escribir un HTML, sin la sintaxis de HTML, para después con un comando de PUG/JADE, ya convertirlo a la sintaxis de HTML.
Se conoce también como Motor de plantillas.

B3 Desarrollo de sistemas (17 decks)

Brainscape helps you reach your goals faster, through stronger study habits.
© 2024 Bold Learning Solutions. Terms and Conditions