vamos a colocar allí la etiqueta <title> 84 00:05:44.540 --> 00:05:48.600 ahí esta la etiquet <title>!, dentro de la etiqueta <title> 85 00:05:48.600 --> 00:05:50.320 vamos a... 86 00:05:50.320 --> 00:05:52.320 poner el título 87 00:05:52.620 --> 00:06:03.040 En este caso vamos a poner aquí: mi primera web en HTML5 88 00:06:03.040 --> 00:06:05.040 correcto! 89 00:06:06.700 --> 00:06:09.440 bien, aún... 90 00:06:09.720 --> 00:06:12.840 parece algo simple esto 91 00:06:12.840 --> 00:06:15.320 vamos a guardarlo para ver si funciona. 92 00:06:15.320 --> 00:06:17.320 voy a guardarlo 93 00:06:18.420 --> 00:06:27.720 aquí, ya es cuestión de qué editor utilizáis yo aquí utilizó Emacs, simplemente hice C-x C-s 94 00:06:28.140 --> 00:06:31.000 y ahora voy a guardarlo dentro del directorio "srv" 95 00:06:31.000 --> 00:06:33.000 .../http/... 96 00:06:33.480 --> 00:06:38.180 y voy a entrar a course, y lo voy a guardar con el nombre 97 00:06:39.240 --> 00:06:41.300 para esta parte 98 00:06:41.740 --> 00:06:43.920 de manera predeterminada 99 00:06:44.120 --> 00:06:47.840 el nombre que va llevar el archivo HTML 100 00:06:47.840 --> 00:06:50.960 por defecto debería de ser index 101 00:06:50.960 --> 00:06:55.400 debería ser index.html 102 00:06:56.460 --> 00:06:58.000 ¿por qué index? 103 00:06:58.260 --> 00:06:59.260 porque... 104 00:06:59.260 --> 00:07:00.720 este nombre 105 00:07:00.720 --> 00:07:02.220 el nombre index 106 00:07:02.220 --> 00:07:05.340 es el que los servidores web 107 00:07:06.020 --> 00:07:09.340 como por ejemplo: el apache, el nginx 108 00:07:09.560 --> 00:07:12.160 va a buscar en cada directorio 109 00:07:12.400 --> 00:07:18.180 sino encuentra el archivo llamado index.html o index.php 110 00:07:19.100 --> 00:07:20.600 sino los encuentra 111 00:07:21.300 --> 00:07:23.880 pues lo que va hacer es... 112 00:07:24.240 --> 00:07:27.980 mostrar la jerarquía de los archivos que están dentro 113 00:07:28.600 --> 00:07:31.400 por ejemplo vamos a colocar ahora. 114 00:07:33.220 --> 00:07:35.660 vamos hacer esto 115 00:07:35.660 --> 00:07:37.660 demo.html 116 00:07:37.660 --> 00:07:39.660 supongamos que es así 117 00:07:40.720 --> 00:07:44.720 que no le pusimos index y le pusimos demo.html 118 00:07:46.520 --> 00:07:49.440 aparentemente no pasó nada, simplemente se guardó 119 00:07:50.100 --> 00:07:52.260 y ahora vamos a ir al navegador 120 00:07:53.440 --> 00:07:54.740 al localhost 121 00:07:54.740 --> 00:07:56.440 actualizamos 122 00:07:56.440 --> 00:08:00.000 y vemos el archivo demo.html 123 00:08:00.000 --> 00:08:01.280 vamos a 124 00:08:01.280 --> 00:08:02.540 colocar ahí 125 00:08:02.540 --> 00:08:04.540 no se ve nada 126 00:08:04.540 --> 00:08:08.160 porque no hemos escrito nada en el <body>, solamente en el <head> 127 00:08:08.160 --> 00:08:10.160 y si os fijáis 128 00:08:23.140 --> 00:08:25.320 en esta parte 129 00:08:25.320 --> 00:08:30.780 pueden ver que dice «Mi primera web en HTML5» es bastante genial esto 130 00:08:30.780 --> 00:08:32.780 ahora 131 00:08:34.420 --> 00:08:44.100 para que veáis ese problema, hemos tenido que entrar dentro del archivo demo.html, no se ha mostrado automáticamente 132 00:08:44.400 --> 00:08:46.540 es decir no hemos recargado esto 133 00:08:47.520 --> 00:08:53.900 aparecido automáticamente la página, sino que hemos tenido que entrar dentro del archivo demo.html 134 00:08:54.780 --> 00:09:00.200 que pasaría si a este archivo demo.html le cambio de nombre 135 00:09:01.760 --> 00:09:02.920 por ejemplo 136 00:09:04.220 --> 00:09:06.900 ahora ya no se va llamar así, sino se va a llamar 137 00:09:10.580 --> 00:09:13.180 se va a llamar ahora pues... 138 00:09:14.220 --> 00:09:17.080 index.html ¿cómo hago eso? 139 00:09:17.300 --> 00:09:18.460 muy sencillo 140 00:09:18.900 --> 00:09:20.400 yo por acá tengo 141 00:09:20.840 --> 00:09:22.660 el directorio de course 142 00:09:22.980 --> 00:09:23.880 aquí está! 143 00:09:24.460 --> 00:09:26.680 he voy a cambiarle de nombre 144 00:09:26.680 --> 00:09:29.180 a index.html 145 00:09:30.260 --> 00:09:33.520 y automáticamente al actualizar me va ha cargar 146 00:09:33.880 --> 00:09:37.800 me va ha cargar el archivo index.html 147 00:09:40.040 --> 00:09:44.180 bien!, nos vemos en el siguiente vídeo para continuar avanzando

WEBVTT 1 00:00:05.580 --> 00:00:06.880 En el vídeo anterior 2 00:00:07.660 --> 00:00:08.820 logramos entender 3 00:00:08.940 --> 00:00:14.880 como funcionan la etiquetas de HTML5, las etiquetas obsoletas, las nuevas etiquetas 4 00:00:16.500 --> 00:00:18.380 y ahora pues vamos a 5 00:00:18.380 --> 00:00:20.380 escribir el código 6 00:00:21.120 --> 00:00:22.700 para poder generar 7 00:00:22.820 --> 00:00:24.060 cualquier página web 8 00:00:25.400 --> 00:00:27.780 vamos abrir el editor de código 9 00:00:27.780 --> 00:00:29.780 voy a... 10 00:00:30.080 --> 00:00:32.620 colocar aquí el localhost 11 00:00:33.420 --> 00:00:37.840 localhost 12 00:00:43.280 --> 00:00:46.100 y voy a entrar dentro del directorio course 13 00:00:46.560 --> 00:00:51.540 todavía no hay nada, porque todavía no he escrito nada 14 00:00:52.700 --> 00:00:54.300 vamos a ir... 15 00:00:54.300 --> 00:00:58.600 al editor de código, yo utilizaré Emacs 16 00:01:01.300 --> 00:01:02.480 ahí está 17 00:01:05.520 --> 00:01:08.500 voy a borrar, esta parte 18 00:01:10.280 --> 00:01:15.820 voy a minimizar también esto, ahí está!, voy a agrandar el texto 19 00:01:16.980 --> 00:01:18.120 ahí está 20 00:01:20.980 --> 00:01:24.860 bien primero podríamos... 21 00:01:27.460 --> 00:01:30.400 escribir la etiqueta 22 00:01:32.840 --> 00:01:36.340 ahora también se acostumbra también a escribir en minúscula 23 00:01:40.320 --> 00:01:41.860 que sería de esa forma 24 00:01:42.340 --> 00:01:45.740 etiqueta 25 00:01:46.540 --> 00:01:49.360 y etiqueta que cierra 26 00:01:49.360 --> 00:01:51.360 de esta forma 27 00:01:52.500 --> 00:01:53.340 como véis 28 00:01:54.020 --> 00:01:56.380 Emacs no me ha coloreado 29 00:01:56.560 --> 00:02:00.460 No me ha coloreado la parte de la sintaxis 30 00:02:00.460 --> 00:02:02.460 eso es porque estoy en mode-lisp 31 00:02:03.240 --> 00:02:05.180 los que usáis Emacs ya me entenderéis 32 00:02:05.860 --> 00:02:08.940 Si utilizáis otro editor pues automaticamente 33 00:02:10.320 --> 00:02:13.080 les va a detectar la sintaxis 34 00:02:13.360 --> 00:02:14.800 voy a utilizar el web-mode 35 00:02:15.720 --> 00:02:17.760 y aquí como podéis observar 36 00:02:17.760 --> 00:02:19.760 tenemos 37 00:02:20.560 --> 00:02:22.100 ya la estructura básica 38 00:02:22.780 --> 00:02:24.740 39 00:02:25.060 --> 00:02:27.880 etiqueta 40 00:02:27.880 --> 00:02:29.880 siempre tiene que llevar 41 00:02:30.040 --> 00:02:36.680 un atributo que es el artributo lenguaje, y dentro pues colocar 42 00:02:36.920 --> 00:02:40.300 el idioma, en esta caso Español-España (es-es) 43 00:02:40.680 --> 00:02:43.800 también podría ser inglés: en 44 00:02:44.860 --> 00:02:47.200 podría ser portugués: pt_BR 45 00:02:48.780 --> 00:02:51.440 cualquier tipo de idioma: zxy 46 00:02:53.220 --> 00:02:59.060 En este caso voy a poner español-españa, y dentro de la etiqueta 47 00:02:59.780 --> 00:03:03.640 siempre va un 48 00:03:04.460 --> 00:03:07.840 un que abre un que cierra 49 00:03:09.500 --> 00:03:17.480 aquí van todas las etiquetas que describen a la página, el título, los metadata, todo eso va ahí 50 00:03:17.780 --> 00:03:20.980 y luego tenemos la etiqueta 51 00:03:21.540 --> 00:03:23.580 52 00:03:25.760 --> 00:03:28.420 que también tiene su contraparte 53 00:03:30.160 --> 00:03:34.320 ¿qué va dentro de la etiqueta ? 54 00:03:35.660 --> 00:03:37.300 ahí vamos a colocar 55 00:03:38.160 --> 00:03:43.820 toda la información, el titulo, la información, toda esa información se va a colocar allí 56 00:03:44.460 --> 00:03:46.740 y aquí en la etiqueta 57 00:03:46.840 --> 00:03:50.120 se va a colocar la información 58 00:03:50.120 --> 00:03:52.120 que se le va a mostrar al usuario 59 00:03:52.120 --> 00:03:54.120 por ejemplo 60 00:03:54.500 --> 00:03:57.140 vamos a regresar a conocimientos libres 61 00:03:59.280 --> 00:04:00.720 ah... vamos a ver... 62 00:04:01.280 --> 00:04:02.940 la parte interna 63 00:04:02.940 --> 00:04:04.940 aquí lo tenemos 64 00:04:05.020 --> 00:04:07.620 en body, en 65 00:04:08.100 --> 00:04:12.040 tenemos que colocar todo lo que se le va a mostrar al usuario 66 00:04:12.280 --> 00:04:15.200 la cabecera, el área de navegación 67 00:04:15.920 --> 00:04:19.220 parte de los artículos, la figuritas 68 00:04:19.500 --> 00:04:27.140 toda esa información, va dentro de la etiqueta , todo va dentro de la etiqueta 69 00:04:27.300 --> 00:04:31.480 todo esto que véis aquí esta dentro de la etiqueta 70 00:04:31.660 --> 00:04:41.040 lo que esta dentro de la etiqueta , es esta parte, lo que se encuentra arriba, donde dice conocimientos libres y hay un logito 71 00:04:41.760 --> 00:04:47.200 eso va dentro de la etiqueta , ahí va 72 00:04:48.400 --> 00:04:55.300 no confundáis con esta otra etiqueta que es

73 00:04:59.520 --> 00:05:02.700 son palabras similares pero diferentes 74 00:05:04.840 --> 00:05:06.780 pueden ser dos 75 00:05:06.780 --> 00:05:08.780 pueden haber dos etiquetas

76 00:05:09.080 --> 00:05:13.980 he visto sitios donde tienen más de un cabecera 77 00:05:15.820 --> 00:05:22.420 bien primero vamos a completar la parte del 78 00:05:22.600 --> 00:05:25.480 en donde esta la información, esto vamos a ponerlo debajo 79 00:05:25.480 --> 00:05:27.480 y aquí vamos a colocar 80 00:05:27.800 --> 00:05:29.780 al igual como 81 00:05:29.780 --> 00:05:31.780 aquí en conocimientos libres 82 00:05:31.980 --> 00:05:36.480 vamos a poner una etiqueta bastante sencilla que... 83 00:05:37.300 --> 00:05:42.700 ...que es la etiqueta vamos a colocar allí la etiqueta <title> 84 00:05:44.540 --> 00:05:48.600 ahí esta la etiquet <title>!, dentro de la etiqueta <title> 85 00:05:48.600 --> 00:05:50.320 vamos a... 86 00:05:50.320 --> 00:05:52.320 poner el título 87 00:05:52.620 --> 00:06:03.040 En este caso vamos a poner aquí: mi primera web en HTML5 88 00:06:03.040 --> 00:06:05.040 correcto! 89 00:06:06.700 --> 00:06:09.440 bien, aún... 90 00:06:09.720 --> 00:06:12.840 parece algo simple esto 91 00:06:12.840 --> 00:06:15.320 vamos a guardarlo para ver si funciona. 92 00:06:15.320 --> 00:06:17.320 voy a guardarlo 93 00:06:18.420 --> 00:06:27.720 aquí, ya es cuestión de qué editor utilizáis yo aquí utilizó Emacs, simplemente hice C-x C-s 94 00:06:28.140 --> 00:06:31.000 y ahora voy a guardarlo dentro del directorio "srv" 95 00:06:31.000 --> 00:06:33.000 .../http/... 96 00:06:33.480 --> 00:06:38.180 y voy a entrar a course, y lo voy a guardar con el nombre 97 00:06:39.240 --> 00:06:41.300 para esta parte 98 00:06:41.740 --> 00:06:43.920 de manera predeterminada 99 00:06:44.120 --> 00:06:47.840 el nombre que va llevar el archivo HTML 100 00:06:47.840 --> 00:06:50.960 por defecto debería de ser index 101 00:06:50.960 --> 00:06:55.400 debería ser index.html 102 00:06:56.460 --> 00:06:58.000 ¿por qué index? 103 00:06:58.260 --> 00:06:59.260 porque... 104 00:06:59.260 --> 00:07:00.720 este nombre 105 00:07:00.720 --> 00:07:02.220 el nombre index 106 00:07:02.220 --> 00:07:05.340 es el que los servidores web 107 00:07:06.020 --> 00:07:09.340 como por ejemplo: el apache, el nginx 108 00:07:09.560 --> 00:07:12.160 va a buscar en cada directorio 109 00:07:12.400 --> 00:07:18.180 sino encuentra el archivo llamado index.html o index.php 110 00:07:19.100 --> 00:07:20.600 sino los encuentra 111 00:07:21.300 --> 00:07:23.880 pues lo que va hacer es... 112 00:07:24.240 --> 00:07:27.980 mostrar la jerarquía de los archivos que están dentro 113 00:07:28.600 --> 00:07:31.400 por ejemplo vamos a colocar ahora. 114 00:07:33.220 --> 00:07:35.660 vamos hacer esto 115 00:07:35.660 --> 00:07:37.660 demo.html 116 00:07:37.660 --> 00:07:39.660 supongamos que es así 117 00:07:40.720 --> 00:07:44.720 que no le pusimos index y le pusimos demo.html 118 00:07:46.520 --> 00:07:49.440 aparentemente no pasó nada, simplemente se guardó 119 00:07:50.100 --> 00:07:52.260 y ahora vamos a ir al navegador 120 00:07:53.440 --> 00:07:54.740 al localhost 121 00:07:54.740 --> 00:07:56.440 actualizamos 122 00:07:56.440 --> 00:08:00.000 y vemos el archivo demo.html 123 00:08:00.000 --> 00:08:01.280 vamos a 124 00:08:01.280 --> 00:08:02.540 colocar ahí 125 00:08:02.540 --> 00:08:04.540 no se ve nada 126 00:08:04.540 --> 00:08:08.160 porque no hemos escrito nada en el <body>, solamente en el <head> 127 00:08:08.160 --> 00:08:10.160 y si os fijáis 128 00:08:23.140 --> 00:08:25.320 en esta parte 129 00:08:25.320 --> 00:08:30.780 pueden ver que dice «Mi primera web en HTML5» es bastante genial esto 130 00:08:30.780 --> 00:08:32.780 ahora 131 00:08:34.420 --> 00:08:44.100 para que veáis ese problema, hemos tenido que entrar dentro del archivo demo.html, no se ha mostrado automáticamente 132 00:08:44.400 --> 00:08:46.540 es decir no hemos recargado esto 133 00:08:47.520 --> 00:08:53.900 aparecido automáticamente la página, sino que hemos tenido que entrar dentro del archivo demo.html 134 00:08:54.780 --> 00:09:00.200 que pasaría si a este archivo demo.html le cambio de nombre 135 00:09:01.760 --> 00:09:02.920 por ejemplo 136 00:09:04.220 --> 00:09:06.900 ahora ya no se va llamar así, sino se va a llamar 137 00:09:10.580 --> 00:09:13.180 se va a llamar ahora pues... 138 00:09:14.220 --> 00:09:17.080 index.html ¿cómo hago eso? 139 00:09:17.300 --> 00:09:18.460 muy sencillo 140 00:09:18.900 --> 00:09:20.400 yo por acá tengo 141 00:09:20.840 --> 00:09:22.660 el directorio de course 142 00:09:22.980 --> 00:09:23.880 aquí está! 143 00:09:24.460 --> 00:09:26.680 he voy a cambiarle de nombre 144 00:09:26.680 --> 00:09:29.180 a index.html 145 00:09:30.260 --> 00:09:33.520 y automáticamente al actualizar me va ha cargar 146 00:09:33.880 --> 00:09:37.800 me va ha cargar el archivo index.html 147 00:09:40.040 --> 00:09:44.180 bien!, nos vemos en el siguiente vídeo para continuar avanzando