Tarea enviada

beta
Juanposo 2025-11-20 15:06:54 -03:00
parent 9702c10259
commit 2c84dc66c2
27 changed files with 172 additions and 107 deletions

BIN
.DS_Store vendored

Binary file not shown.

BIN
LabSO/.DS_Store vendored

Binary file not shown.

BIN
LabSO/CyCpp/.DS_Store vendored

Binary file not shown.

BIN
LabSO/HTML/.DS_Store vendored 100644

Binary file not shown.

View File

@ -1,34 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Escuchando</title>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<div class="sitecanvas">
<!--HEADER-->
<section class="siteheader">
<header>
<nav>
<a class="logo" href="index.html"><b>Logo</b></a>
<div></div>
<div class="menuitems">
<a href="escuchando.html">Escuchando</a>
<a href="recomendaciones.html">Recomendaciones</a>
<a href="favoritos.html">Favoritos</a>
<a href="otros.html">Otros</a>
</div>
</nav>
</header>
</section>
<!--CONTENIDO-->
<section class="pagecontent">
<h1>Cómo escuchar música en la era Moderna</h1>
<p>Encontrar música nueva es más fácil que nunca, el problema es que la mayoría se entrega a través de algoritmos o por plataformas donde uno no tiene el control sobre qué quiere escuchar, a menos que no sepas que te gusta, en ese caso te recoiendo la página <a href="recomendaciones.html">Recomendaciones</a> para ayudarte a encontrar tu música preferida.</p>
<p>lol</p>
</section>
</div>
</body>
</html>

View File

@ -1,36 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Recomendaciones</title>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<div class="sitecanvas">
<!--HEADER-->
<section class="siteheader">
<header>
<nav>
<a class="logo" href="index.html"><b>Logo</b></a>
<div></div>
<div class="menuitems">
<a href="escuchando.html">Escuchando</a>
<a href="recomendaciones.html">Recomendaciones</a>
<a href="favoritos.html">Favoritos</a>
<a href="otros.html">Otros</a>
</div>
</nav>
</header>
</section>
<!--CONTENIDO-->
<section class="pagecontent">
<div class="pagetext">
<h1>Otra info wena</h1>
<p>mish</p>
</div>
</div>
</section>
</div>
</body>
</html>

Binary file not shown.

View File

@ -0,0 +1,54 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Escuchando</title>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<div class="sitecanvas">
<!--HEADER-->
<section class="siteheader">
<header>
<nav>
<a class="logo" href="index.html"><b>Música</b></a>
<div></div>
<div class="menuitems">
<a href="escuchando.html">Escuchando</a>
<a href="recomendaciones.html">Recomendaciones</a>
<a href="favoritos.html">Favoritos</a>
<a href="otros.html">Otros</a>
</div>
</nav>
</header>
</section>
<!--CONTENIDO-->
<section class="pagecontent">
<div>
<h1>Cómo escuchar música en la era Moderna</h1>
<p>Encontrar música nueva es más fácil que nunca, el problema es que la mayoría se entrega a través de algoritmos o por plataformas donde uno no tiene el control sobre qué quiere escuchar, a menos que no sepas que te gusta, en ese caso te recomiendo la página <a href="recomendaciones.html" class="link">recomendaciones</a> para ayudarte a encontrar tu música preferida.</p>
<p>Yo me voy a enfocar en el álbum, ya que esta es la forma de escuchar música donde el artista puso so mayor empeño en crear una obra completa, y siento que esto no se respeta tanto como se debería gracias a las playlists, aunque estas de por si no tengan nada de malo, es ideal conocer la obra de donde vino la música para darte cuenta que muchas veces en vez de ir directamente a la playlist, lo más probable es que quieras escuchar el disco.</p>
</div>
<div>
<h2><a href="https://rateyourmusic.com/" class="link">RYM (RateYourMusic)</a> - Cómo encontrar música</h2>
<p>El blog y tracker de música más grande del mundo, aquí puedes descubrir música de todos los países y de cualquier género de forma muy natural, puedes simplemente buscar al artista, algún single, álbum o lo que quieras y empezar a buscar más música relacionada a través de, por ejemplo, el género de la canción. Si no te gusta eso o simplemente quieres descubrir cuáles son las obras más apreciadas según la comunidad, puedes ver las listas por año, categoría país, etc...</p>
<p><a href="https://rateyourmusic.com/" class="link">RYM</a> tiene dos problemas muy grandes, el primero es que la gente que lo ocupa es como la gente que usa Reddit, quiere demostrarte porque su gusto es mejor y que el tuyo es muy simple, y el segundo que es una continuación es que la mayoría de gente sigue la opinión del otro en vez de formar la suya. Se aprecian estos problemas en las listas especialmente la de todos los tiempos, ya que en el top 10 hay múltiples álbumes de Kendrick Lamar, Radiohead y Pink Floyd. Aunque dentro de mis <a href="favoritos.html" class="link">favoritos</a> se encuentren Radiohead y Kendrick Lamar, hay más música que simplemente no se considera por estas razones.</p>
<p>Considerando eso, aún creo que <a href="https://rateyourmusic.com/" class="link">RYM</a> es la mejor forma de descubrir música y la que más recomiendo.</p>
</div>
<div>
<h2>Cómo escuchar música - Streaming</h2>
<p><a href="https://www.spotify.com/cl/" class="link">Spotify</a> es la opción obvia, solo que esta tiene un montón de prácticas cuestionables, especialmente lo poco que paga a los artistas, ya que una venta de CD equivale a 100.000 streams aprox. Aún así me quedo en Spotify, ya que es la plataforma que tiene mejor implementada la tecnología en relación al usuario, aunque esto cada vez empeora más.</p>
<p>La mejor alternativa que he encontrado es <a href="https://www.qobuz.com/cl-es/discover" class="link">Qobuz</a>, tiene música de alta fidelidad al mismo precio e incluso más barato que Spotify si eres estudiante. En vez de entregar música a través de un algoritmo, ellos tienen su propia prensa mostrando y recomendando música nueva, es una de las mejores y más innovativas propuestas que he visto, el problema es que la teconología no está al nivel de Spotify pero es la que más se acerca, aunque si te gusta mucho la opción de controlar la música de un dispositivo desde otro, <a href="https://www.qobuz.com/cl-es/discover" class="link">Qobuz</a> no incluye eso.</p>
<p>La otra opción es <a href="https://music.youtube.com/" class="link">YouTube Music</a>, esta opción es igual de inmoral que Spotify, pero es la que más música tiene, aparte que por muy poco dinero adicional incluye Youtube Premium, haciéndola una muy buena opción si esos son tus intereses.</p>
</div>
<div>
<h2>Cómo escuchar música - Físico</h2>
<p>Los medios físicos están volviendo a ser populares, dentro de los populares están el Disco de Vinilo y el CD.</p>
<p>El Vinilo es popular ya que es una de las únicas formas realmente físicas de almacenar datos, en este caso música, haciendo que un vinilo bien cuidado pueda permanecer a través del tiempo con la misma calidad, ya sean años o decadas. Mucha gente dice que la calidad del Vinilo es la mejor que hay, esto no es necesariamente verdad, ya que al ser un registro físico de una grabación muchas veces digital, la grabación puede no tener muy buena calidad, haciendo que suene igual que un CD, es esto malo? No, para nada.</p>
<p>El CD es mucho más barato y fácil de almacenar, el problema es que es simplemente otro medio digital de música, pero lo bueno es que nadie puede borrarte a través de un servidor un tema de un CD, a diferencia de servicios de streaming, estoy sufriendo esto con temas como Supervillain Theme de Madvillainy, el cuál ya no está en streaming y es de mis favoritos del disco, :C</p>
</div>
</section>
</div>
</body>
</html>

View File

@ -3,7 +3,7 @@
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Recomendaciones</title>
<title>Favoritos</title>
<link rel="stylesheet" href="styles.css">
</head>
<body>
@ -12,7 +12,7 @@
<section class="siteheader">
<header>
<nav>
<a class="logo" href="index.html"><b>Logo</b></a>
<a class="logo" href="index.html"><b>Música</b></a>
<div></div>
<div class="menuitems">
<a href="escuchando.html">Escuchando</a>
@ -37,9 +37,7 @@
<div>
<h2>To Pimp a Butterfly</h2>
<h4>Kendrick Lamar - Hip-Hop/Jazz - 2015</h4>
<p>
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Exercitationem, quae minus nulla similique quasi, quod maxime adipisci earum laudantium iure iusto sapiente? Alias eum molestias inventore saepe, facilis voluptatibus vero!
</p>
<p>El disco que me permitió descubrir el mundo del Hip-Hop y la música más densa de por si, una obra maestra de la fusión de géneros.</p>
</div>
</div>
<div class="albumWrapper">
@ -50,9 +48,8 @@
<div>
<h2>In Rainbows</h2>
<h4>Radiohead - Rock Experimental - 2007</h4>
<p>
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Exercitationem, quae minus nulla similique quasi, quod maxime adipisci earum laudantium iure iusto sapiente? Alias eum molestias inventore saepe, facilis voluptatibus vero!
</p>
<p>Pucha que suena lindo este álbum.</p>
<p>Weird Fishes/Arpeggi es mi tema favorito, no he escuchado una canción mejor que esa.</p>
</div>
</div>
<div class="albumWrapper">
@ -63,9 +60,7 @@
<div>
<h2>Midnight Marauders</h2>
<h4>A Tribe Called Quest - Hip-Hop - 1993</h4>
<p>
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Exercitationem, quae minus nulla similique quasi, quod maxime adipisci earum laudantium iure iusto sapiente? Alias eum molestias inventore saepe, facilis voluptatibus vero!
</p>
<p>Si quieres escuchar un disco piola con muy buen flow, beats tranquilos pero potentes y simplemente algo que te haga sentir mejor después de escucharlo, este es tu disco.</p>
</div>
</div>
<div class="albumWrapper">
@ -76,9 +71,7 @@
<div>
<h2>Alive 2007</h2>
<h4>Daft Punk - House/EDM (Live) - 2007</h4>
<p>
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Exercitationem, quae minus nulla similique quasi, quod maxime adipisci earum laudantium iure iusto sapiente? Alias eum molestias inventore saepe, facilis voluptatibus vero!
</p>
<p>El mejor set de electrónica hasta la fecha.</p>
</div>
</div>
</section>

View File

Before

Width:  |  Height:  |  Size: 69 KiB

After

Width:  |  Height:  |  Size: 69 KiB

View File

Before

Width:  |  Height:  |  Size: 99 KiB

After

Width:  |  Height:  |  Size: 99 KiB

View File

Before

Width:  |  Height:  |  Size: 14 KiB

After

Width:  |  Height:  |  Size: 14 KiB

View File

Before

Width:  |  Height:  |  Size: 535 KiB

After

Width:  |  Height:  |  Size: 535 KiB

View File

Before

Width:  |  Height:  |  Size: 107 KiB

After

Width:  |  Height:  |  Size: 107 KiB

View File

Before

Width:  |  Height:  |  Size: 27 KiB

After

Width:  |  Height:  |  Size: 27 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 149 KiB

View File

Before

Width:  |  Height:  |  Size: 41 KiB

After

Width:  |  Height:  |  Size: 41 KiB

View File

Before

Width:  |  Height:  |  Size: 50 KiB

After

Width:  |  Height:  |  Size: 50 KiB

View File

Before

Width:  |  Height:  |  Size: 20 KiB

After

Width:  |  Height:  |  Size: 20 KiB

View File

@ -3,7 +3,7 @@
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Musique</title>
<title>Música x JP Parra</title>
<link rel="stylesheet" href="styles.css">
</head>
<body>
@ -12,7 +12,7 @@
<section class="siteheader">
<header>
<nav>
<a class="logo" href="index.html"><b>Logo</b></a>
<a class="logo" href="index.html"><b>Música</b></a>
<div></div>
<div class="menuitems">
<a href="escuchando.html">Escuchando</a>

View File

@ -0,0 +1,78 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Otros</title>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<div class="sitecanvas">
<!--HEADER-->
<section class="siteheader">
<header>
<nav>
<a class="logo" href="index.html"><b>Música</b></a>
<div></div>
<div class="menuitems">
<a href="escuchando.html">Escuchando</a>
<a href="recomendaciones.html">Recomendaciones</a>
<a href="favoritos.html">Favoritos</a>
<a href="otros.html">Otros</a>
</div>
</nav>
</header>
</section>
<!--CONTENIDO-->
<section class="pagecontent">
<div class="pagetext">
<h1>Mis discos favoritos de esta decada</h1>
<ul><h3>2025</h3>
<li>Lux - Rosalía - Art-Pop/Classical</li>
<li>Starburst - Danny Brown - Expermiental Hip-Hop</li>
<li>Getting Killed - Geese - Indie Rock</li>
<li><b>Let God Sort Em Out</b> - Clipse - Hip-Hop</li>
<li>Alfredo 2 - Freddie Gibbs & The Alchemist - Hip-Hop</li>
<li>private music - Deftones - Alternative Metal</li>
<li>Balloonerism - Mac Miller - Jazz Rap/Neo Soul</li>
<li>DeBÍ TiRAR MáS FOToS - Bad Bunny - Reggaeton/Salsa</li>
</ul>
<ul><h3>2024</h3>
<li><b>Imaginal Disk</b> - Magdalena Bay - Indie-Pop</li>
<li>brat - Charli XCX - EDM/Pop - 2024</li>
<li>The New Sound - Geordie Greep - Jazz-Rock</li>
<li>NO HANDS - Joey Valence & Brae - Hip-Hop</li>
<li>Chromakopia - Tyler, The Creator - Hip-Hop/Neo Soul</li>
<li>Charm - Clairo - Soft-Rock</li>
</ul>
<ul><h3>2023</h3>
<li>Scaring The Hoes - Danny Brown & JPEGMAFIA - Experimental Hip-Hop</li>
<li><b>Lahai</b> - Sampha - Alternative R&B</li>
<li>DATA - Tainy - Reggaeton</li>
<li>Enola Gay - Asia Menor (Son de Chileeeee) - Art Punk</li>
<li>Let's Start Here - Lil Yatchy - Psychedelic Rock</li>
</ul>
<ul><h3>2022</h3>
<li><b>The Forever Story</b> - JID - Hip-Hop</li>
<li>RENNAISANCE - Beyoncé - House</li>
<li>Mr. Morale and The Big Steppers - Kendrick Lamar - Hip-Hop</li>
<li>A Light For Attracting Attention - The Smile - Art Rock</li>
<li>MOTOMAMI - Rosalía - Art-Pop/Reggaeton</li>
</ul>
<ul><h3>2021</h3>
<li>LP! - JPEGMAFIA - Experimental Hip-Hop</li>
<li><b>Sometimes I Might Be Introvert</b> - Little Simz - Hip-Hop</li>
<li>An Evening With Silk Sonic - Silk Sonic (Anderson .Paak & Bruno Mars) - Soul</li>
</ul>
<ul><h3>2020</h3>
<li>The New Abnormal - The Strokes - Indie Rock</li>
<li><b>Circles</b> - Mac Miller - Neo-Soul</li>
<li>Future Nostalgia - Dua Lipa - Dance-Pop</li>
</ul>
</div>
</div>
</section>
</div>
</body>
</html>

View File

@ -12,7 +12,7 @@
<section class="siteheader">
<header>
<nav>
<a class="logo" href="index.html"><b>Logo</b></a>
<a class="logo" href="index.html"><b>Música</b></a>
<div></div>
<div class="menuitems">
<a href="escuchando.html">Escuchando</a>
@ -38,7 +38,8 @@
<div>
<h2>Songs in The Key of Life</h2>
<h4>Stevie Wonder - Soul - 1976</h4>
<p>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Exercitationem, quae minus nulla similique quasi, quod maxime adipisci earum laudantium iure iusto sapiente? Alias eum molestias inventore saepe, facilis voluptatibus vero!</p>
<p>Probablemente el disco más importante de la historia, esta es una oda a la música tan inspiradora que redefinió cómo se esta misma se hacía completamente, llevando a creaciones como "What's Going On" de Marvin Gaye a que pudieran ser creadas.</p>
<p>Una verdadera obra maestra con un poco de todo, muy feliz, muy funky y con casualmente uno de los mejores temas de Jazz Fusión creados. Cuna de hits como "Sir Duke", "Isn't She Lovely", y permitiendo que "Pastime Paradise" fuera a ser sampleada, dejando que Coolio creara el clásico "Gangsta's Paradise".</p>
</div>
</div>
<div class="albumWrapper">
@ -49,9 +50,7 @@
<div>
<h2>To Pimp a Butterfly</h2>
<h4>Kendrick Lamar - Hip-Hop/Jazz - 2015</h4>
<p>
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Exercitationem, quae minus nulla similique quasi, quod maxime adipisci earum laudantium iure iusto sapiente? Alias eum molestias inventore saepe, facilis voluptatibus vero!
</p>
<p>Este es un disco lleno de dolor y es una crítica directa al racismo de Estados Unidos en 2015, el cuál no solo se quedó ahí, sino que Kendrick divulgó el pensamiento al cómo es que la misma gente debe mejorar entre si para poder avanzar como sociedad, como el mismo puede permitirse ser esta persona que entrega este conocimiento siendo que el está lleno de problemas, y cómo es que al fin y al cabo todo es para que todos colaboremos como sociedad para un mundo mejor, el cuál no se consigue sin dolor ni esfuerzo.</p>
</div>
</div>
<div class="albumWrapper">
@ -62,35 +61,30 @@
<div>
<h2>Discovery</h2>
<h4>Daft Punk - French House - 2001</h4>
<p>
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Exercitationem, quae minus nulla similique quasi, quod maxime adipisci earum laudantium iure iusto sapiente? Alias eum molestias inventore saepe, facilis voluptatibus vero!
</p>
<p>Este disco revolucionó la electrónica utilizando el House como base para poder profundizar en musicalización nunca antes puesta en el género, aparte contando una historia de inicio a fin, la cuál se puede ver en la película muda "Interstella 5555", un animé animado por Toei (El estudio de Dragon Ball y mucho más) donde la música es la que habla, no los personajes de por si. Una apuesta muy arriesgada que funcionó perfectamente y revolucionó por completo su género.</p>
</div>
</div>
<div class="albumWrapper">
<div>
<img src="files/el jardin de los presentes cover.webp" class="image">
<iframe data-testid="embed-iframe" style="border-radius:12px" src="https://open.spotify.com/embed/track/4K5ZDxu6eeAXUXhbkJRXXA?utm_source=generator" width="100%" height="152" frameBorder="0" allowfullscreen="" allow="autoplay; clipboard-write; encrypted-media; fullscreen; picture-in-picture" loading="lazy"></iframe>
<iframe data-testid="embed-iframe" style="border-radius:12px" src="https://open.spotify.com/embed/track/7v9Q0dAb9t7h8gJOkcJHay?utm_source=generator" width="100%" height="152" frameBorder="0" allowfullscreen="" allow="autoplay; clipboard-write; encrypted-media; fullscreen; picture-in-picture" loading="lazy"></iframe>
</div>
<div>
<h2>El Jardín de Los Presentes</h2>
<h4>Invisible (Spinneta) - Rock Progresivo - 1976</h4>
<p>
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Exercitationem, quae minus nulla similique quasi, quod maxime adipisci earum laudantium iure iusto sapiente? Alias eum molestias inventore saepe, facilis voluptatibus vero!
</p>
<p>Uno de los discos más sorprendentes del Rock Progresivo que no tiene absolutamente nada que envidiar a grupos como Pink Floyd</p>
<p>El Jardín de Los Presentes narra la historia del Capitán Beto, un Argentino común y corriente que por sorpresa de la nación Argentina construyó una nave espacial y fue en la busqueda de respuestas sobre la vida, descubriendo en su viaje que todo lo que buscaba ya estaba donde el siempre estuvo en primer momento.</p>
</div>
</div>
<div class="albumWrapper">
<div>
<img src="files/Clube Da Esquina Cover.jpg" class="image">
<iframe data-testid="embed-iframe" style="border-radius:12px" src="https://open.spotify.com/embed/track/4YwIblyn5m2XAJ7ljh5d79?utm_source=generator" width="100%" height="152" frameBorder="0" allowfullscreen="" allow="autoplay; clipboard-write; encrypted-media; fullscreen; picture-in-picture" loading="lazy"></iframe>
<img src="files/Toxicity Cover.jpg" class="image">
<iframe data-testid="embed-iframe" style="border-radius:12px" src="https://open.spotify.com/embed/track/0snQkGI5qnAmohLE7jTsTn?utm_source=generator&theme=0" width="100%" height="152" frameBorder="0" allowfullscreen="" allow="autoplay; clipboard-write; encrypted-media; fullscreen; picture-in-picture" loading="lazy"></iframe>
</div>
<div>
<h2>Clube Da Esquina</h2>
<h4>Milton Nascimiento y Lô Borgue - MPB - 1972</h4>
<p>
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Exercitationem, quae minus nulla similique quasi, quod maxime adipisci earum laudantium iure iusto sapiente? Alias eum molestias inventore saepe, facilis voluptatibus vero!
</p>
<h2>Toxicity</h2>
<h4>System Of A Down - Alternative Metal - 2001</h4>
<p>Uno de los discos más intensos del Metal, System of a Down aprovechó hasta el último segundo para explotar tu cabeza con riffs descontrolados, baterías que causan terremotos, bajos de otro mundo y la increíble voz y letra de Serj Tankian, elevando a este disco como un clásico del Metal y transformando completamente la escena del Metal moderno.</p>
</div>
</div>
</section>

View File

@ -61,12 +61,29 @@ header {
padding: 20px;
color: black;
font-size: 20px;
h1 {
h1, h2{
margin-bottom: 12px;
}
p {
margin-top: 12px;
}
div {
margin-bottom: 20px;
}
ul {
padding-left: 20px;
padding-bottom: 20px;
}
}
.link {
text-decoration: underline;
color: black;
}
.link:hover {
color: orange;
}
.ytembed {
@ -86,5 +103,4 @@ header {
width: 280px;
box-shadow: 0 3px 3px 0 #32311933, 0 3px 6px 0 #32311933;
}
}