22 KiB
+++ Title = "En el sitio" Lastmod = 2024-08-25 #Template = WM.html #Style = @import "[staticoso:Site:RelativeRoot]Assets/Pages/index.css"; Categories = [ "Meta" ] Featured_Image = "@/RichPreview/index.png" +++
{{< noticeAutomaticTranslation it >}}
Esta era inicialmente la página de inicio del sitio, pero se ha vuelto tan problemáticamente larga que... no importa, todo se explica en el nuevo hogar. ¡Aquí, por lo tanto, está la serie clásica de información suelta sobre el ✨sitoctt✨ (parte de ella es antigua, se actualizará según las novedades)! 😊
✨sitoctt✨
✨sitoctt✨
✨sitoc< span style="--index: 6; --alpha-l: 0.5; --alpha-u: 1;">tt✨
¿De dónde viene el nombre ✨sitoctt✨? Por el hecho de que es literalmente mi sitio, porque soy oct y así sitio + octt = ✨sitoctt✨ (pronunciación: "sitòctt"). Si lo prefieres, puedes llamarlo sitocto. ¡O incluso postoctt! Éste sigue siendo un lugar, mi lugar, ¡aunque sea virtual!
Estado del sitio y cómo navegar
A pesar de que ya tiene un poco más de sustancia, todo este ambaradan todavía está en construcción. Y siempre lo será, porque siempre tendré cosas nuevas que compartir. Y, cuando esté muerto, todavía estará inacabado porque en mi vida no habré escrito todo el conocimiento universal teóricamente posible en el sitio.
Las actualizaciones del sitio son de diferentes tipos: la publicación de nuevos artículos del blog ocurre, bueno, 3 veces al mes, es una buena idea utilizar feeds que pongo a disposición; Los cambios en las páginas normales son continuos y ocurren al azar, por lo que deberías revisar las que te interesan quizás cada semana, si esperas noticias.
A tener en cuenta (desde Web): cuando los siguientes botones están en pantalla es porque pueden ocultar menús plegables.
Pueden estar en diferentes posiciones en diferentes páginas, porque me gusta experimentar con diferentes temas; pero trato de mantener su significado consistente en todo momento.
Un ícono emoji de pila de libros (📚) señala la página principal del menú del sitio, imprescindible poder navegar saltando entre páginas completamente diferentes y desconectadas.
En cambio, el icono con el emoji de una hoja con un marcador (📑) indica la lista de secciones de la página actual; no es imprescindible. , pero puede resultar útil para saltar entre diferentes partes de un texto extenso.
Secuencias de comandos del lado del cliente
El sitio web no utiliza ningún script del lado del cliente para funciones básicas, porque no quiero forzar a aquellos (por razones válidas de seguridad y de otro tipo) que no quieren habilitar JavaScript a tener una experiencia degradada. Respecto a este espinoso tema, también escribí un artículo: 📄 Los documentos no deberían convertirse en aplicaciones.
Sin embargo, de todos modos... para proporcionar alguna funcionalidad adicional, tengo que tener algo de JS, hay poco que puedas hacer. A continuación se muestra la lista de lo que uso. Todos los archivos se cargan desde los servidores de mi sitio, por lo que es difícil para entidades maliciosas ocultar malware en su interior.
Lista de scripts del lado del cliente utilizados en el sitio web (Expandir)
- Scripts internos, escritos por mí:
Menús que se expanden automáticamente en páginas temáticas de sitoctt en modo de escritorio(estoy intentando solucionar este problema...), visualización en pantalla completa de los fondos de la página.li> -
Polyfill para admitir imágenes AVIF en navegadores antiguos: avif.js de Kagami(Aún no activado...será pronto¿cuándo diablos lo haré? Lo he estado posponiendo durante meses, el problema es que no es una solución plug-and-play, primero tengo que entenderlo y luego crear un script envolvente 😭)
A continuación, pongo mi clasificación de las posibles formas de ver este sitio, de mejor a peor. Por estandarización, todos asumen soporte a todo color (cuando sea posible).
Mis digresiones inútiles sobre formas absolutamente absurdas de consultar el sitectt (Ampliar)
- • Navegador web, totalmente compatible con CSS3
- (¡Perfecto!)
- • Imprima en papel holográfico, GIF completamente renderizado y CSS3 cuando sea posible
- (¡Requiere mover el papel a mano pero es excelente!)
- • Navegador web, con soporte CSS3 incompleto
- (Bueno, está bien...)
- • Imprima en papel normal, animaciones CSS3 y GIF no renderizados
- (Boo, faltan animaciones...)
- • Navegador antiguo (Web antiguo, Web de texto o Gemini) / Impresión en papel normal, sin compatibilidad con CSS
- (¡¿Qué es esta basura?!?!)
¿Pero de qué se trata?
En este espacio mío de Internet pondré todo. Espero.
Por ahora, definitivamente coloco páginas poco profundas sobre temas específicos, pero también publicaciones de blog largas y conversacionales. También quiero crear muchas colecciones sobre las cosas que me gustan, tanto en forma textual como mediática. Una especie de galería de cosas que son valiosas para mí.
Sin embargo, además del contenido real, quiero que el sitio (la versión web, obviamente) sea una galería en sí mismo. Quiero crear algo que tenga su propio carácter único, como los sitios web de aficionados de los años 1995-2005, donde cada lugar en Internet siempre tenía una atmósfera diferente a todo lo visitado un momento antes.
El auge de las redes sociales tal como las conocemos hoy lamentablemente ha arruinado la web desde este punto de vista, lo que ha llevado a una estandarización completa y a la muerte de la creatividad expresada a través de la forma.
I Quiero que este espacio web mío sea diferente a todos los demás, caracterizado por textos monocromáticos y temas reciclados, porque es una pena tener herramientas muy poderosas y no explotarlas realmente.
Por esta razón, intentaré constantemente inventar formas de embellecer las páginas con CSS, no sólo con diseño o efectos de texto fijos, sino sobre todo con animaciones.
Al resto del formulario, como el orden del árbol de Las páginas del sitio o los párrafos de las páginas, no pensaré mucho, de lo contrario me distraigo de la creación de contenido y el deseo pasa.
Disponibilidad del sitio
Actualmente, este sitio está disponible para la navegación en varias direcciones diferentes (los contenidos son siempre idénticos). Para aquellos que no lo saben, sin embargo, el nombre cambió hace un mes a sitoctt de postoctt, porque el nombre antiguo me dio la impresión de algún servicio postal... También debería pensar en muchos otros espejos en la nube de diferentes proveedores (obviamente gratuitos), si quiero que el sitio sobreviva por sí solo y resista la prueba del tiempo... Pero esta es una pregunta larga.
Web
El sitio web está disponible desde varias fuentes.
- En el HTTPS clearweb, en los servidores GitLab: sitoctt.octt.eu.org.
- En Onion Web (Tor), en servidores Replit: sitoctt2fxjvx3lc2iqqef2aeulflprjaasv2xl4zi7sxxbmvjy5b5yd.onion. Al final ya no está alojado en mi casa, pero quizás sea lo mejor, es una carga menos para el pobre servidor improvisado que tengo (de momento,
una consola Nintendo Switch con Ubuntula Raspberry Pi 3).
💾 Opciones de compatibilidad para sistemas obsoletos o exóticos (Expandir)
- • Versión HTTP básica
- El sitio incluye funciones CSS complejas y relativamente modernas, para proporcionar efectos gráficos (y funcionales) épicos. Irónicamente, aunque al ver las páginas en navegadores muy antiguos, que carecen total o casi totalmente de soporte CSS, todo se ve feo pero es legible... en navegadores que son tanto demasiado antiguos como demasiado nuevos aparecen errores muy graves. , ¡lo que hace imposible usar algunos menús o incluso leer el texto!
Además del hecho de que (cuando sea posible) quiero admitir sistemas antiguos, estos malditos problemas también aparecen en dispositivos menos populares pero actuales, como el ¡Encender! En resumen, para muchos navegadores que no incluyen una configuración para deshabilitar completamente CSS, era imprescindible hacer lo que yo hice: ir a la ruta /Plain en mis dominios. clearweb hay una raíz paralela y páginas con el mismo contenido pero CSS reducido al mínimo. - • HTTP sin cifrar
- Para evitar problemas le dediqué un subdominio dedicado, manteniendo HTTPS forzado en el principal; pero, como no requiere mantenimiento, me aseguré de que desde el dominio de quinto (!) nivel "http" puedas acceder al sitio a través de HTTP sin cifrar. (alojado en GitHub, esta vez): en resumen, la dirección es
http://http.sitoctt.octt.eu.org
. Los contenidos son idénticos, por supuesto, pero finalmente puedes navegar por el sitio en cosas como Internet Explorer 4 directamente contactando al servidor.
Géminis
A partir de ahora, el sitio CTTT también está disponible como cápsula Gemini. Para ir allí, hay que utilizar un navegador Gemini.
Obviamente (para aquellos que conocen Gemini), todo está más castrado y la forma no es precisamente la mejor porque todas las páginas son una conversión directa del HTML de el sitio web (y el programa que uso para hacerlo también está un poco roto).
Vaya a la octocápsula, amablemente alojada en koyu.space: géminis://koyu.space/octt
Feeds y notificaciones
A partir de ahora el sitio (el blogoctt y el MicroBlog, específicamente) tiene feeds integrados, que se actualizan automáticamente cuando publico un nuevo artículo.
Atom Feed (moderno, recomendado, contiene publicaciones completas): feed/atom.xml
Feed RSS (obsoleto, disponible por compatibilidad): feed/rss. xml
Necesitas un agregador de feeds compatible para usarlos.
- En PC de escritorio recomiendo Thunderbird o SeaMonkey Mail.
- En Android recomiendo Alimentador o Rss simple.
- Si desea utilizar un dispositivo como un lector de libros electrónicos de tinta electrónica, el único software universal que, entre otras cosas, incluye un agregador de feeds, que conozco y puedo recomendar, es KOReader.
- Consejo: si usas Friendica, puedes copiar el enlace a el feed y pégalo en la barra de búsqueda, para poder seguirlo como si fuera un perfil!
Además, si utilizas cualquier plataforma del Fediverso ActivityPub (Mastodon, Pleroma, Misskey, ...) puedes seguir el bot del sitio ctt, para recibir nuevas publicaciones en tu Feed de inicio: < a href="https://botsin.space/@sitoctt" rel="me noopener" target="_blank">@sitoctt@botsin.space! Para algunas complicaciones que iniciado a finales de agosto de 2022, no se puede acceder al bot desde la instancia italiana más grande de Mastodon, mastodon.uno, por lo que ahora es prácticamente inútil. No lo voy a quitar sólo porque me costaría más hacerlo que dejarlo donde está :P; Sin embargo, tarde o temprano tendría que crear uno nuevo.
Fuentes y licencias
Licencias de contenido
Todo el contenido de este sitio que creé (mis propios escritos, medios originales y la mayor parte del código fuente) tiene licencia "Creative Commons Attribution - Share Alike 4.0 International" (CC BY-SA 4.0) ( ), una licencia gratuita que promueve el intercambio, y no afecta los legítimos derechos a la cultura y la colaboración de la humanidad en general.
Sin embargo, también hay contenidos que no son míos.
En cualquier caso, si algo viene de mi mano, no tendrá ninguna indicación de créditos cerca.
Para el material prestado, sin embargo, siempre se indicará la fuente de donde lo tomé y la licencia, ya sea de dominio público, Creative Commons o no especificada.
Cuidado con los créditos. porque a menudo dejo el material HTML y CSS en las fuentes de la página. Así que, por si acaso, consulte allí para ver este tipo de créditos. Sin embargo, para cosas como imágenes o textos, los créditos suelen ser una parte visible de la página, cerca del objeto prestado (como una descripción); otras veces, el mismo objeto es un enlace que, si se hace clic, te lleva de regreso a la fuente. Sin embargo, pensé en crear una sección de la página a continuación. dedicado a créditos especiales (que completo cuando recuerdo).
Código fuente
Hablando de fuentes del sitio, la fuente HTML de la página real cargada por el navegador puede ser difícil de leer. Esto se debe a que en realidad no escribo el HTML completo directamente para componer las páginas. No solo sería un desastre replicar mis diversas barras de navegación y secciones en todas las páginas, y si tengo que hacer cambios en ellas, entonces es un problema. Es un infierno replicar esto en cualquier lugar, pero la sintaxis HTML es sucia y difícil de escribir.
Precisamente por estas razones, creé mi propio generador de sitios estáticos (también, como este sitio, incompleto pero actualizado de vez en cuando cuando lo necesito), que preprocesa mi código fuente para incluir mis barras en todas las páginas. generar las secciones de la página (que aparecen en el menú de la derecha), generar la lista de páginas del sitio (desde el menú de la izquierda), y otras cositas. Paso importante, todos los archivos Markdown o Pug se traducen a HTML para que sean comprensibles para los navegadores normales, y aquí lo tienes.
Ah, sí, digo "otras pequeñas cosas" porque esto Es una cosa que al momento de escribir este capítulo la página está ausente o incompleta, y al escribir como escribo me cubro el trasero y no tengo que hacer cambios futuros.
H y h .
¡Tómalo todo!
Para terminar, busque todas mis fuentes en los respectivos repositorios de Git.
Las de mi sitio (divididas en varios repositorios para mantener limpio el historial), en las condiciones descritas anteriormente: gitlab.com/octtspacc/sitoctt; sitoctt-assets.
Los de mi generador, también liberados bajo licencia libre, la AGPL: gitlab.com/octtspacc/staticoso.p>
Otra cosa: en caso de que sea de su interés, para preservar y/o compartir inmediatamente (excluyendo archivos que están en repositorios separados, porque están absolutamente vinculados) copias fuera de línea del sitio, puede descargar un zip < /b> que contiene todas las páginas compiladas aquí !
Créditos especiales
Lista de créditos y agradecimientos especiales a quienes pidieron material prestado (Ampliar)
- Lista de scripts del lado del cliente, incluidos algunos scripts de terceros
- Título animado de Waaaves: Waaaves de jh3y
- Familia de fuentes: Space Mono de Colophon Foundry
- Paquete de emojis CSS: Twemoji de Twitter, a través de Twemoji asombroso
- Algunos botones de 88x31 no identificables: Colección GIF de 88x31 de cyber.dabamos.de
Confidencialidad y transparencia
Como mi interés legítimo, utilizo un servicio de análisis en este sitio web; tanto para mejorar lo que hago como para satisfacer mi pura curiosidad por descubrir datos.
El servicio de análisis se basa en un código completamente gratuito y abierto</ a> , alojado de forma gratuita para sitios de poco tráfico por GoatCounter.com.
Aparentemente, con GoatCounter no es necesario incluir una advertencia en pantalla que moleste a los usuarios para cumplir con el GDPR (ver goatcounter.com/help/gdpr), pero, por honestidad y transparencia, escribo este párrafo de todos modos.
Sólo se recopilan datos no personales, de forma anónima, con el único fin de realizar estadísticas generales y no para el seguimiento individual. El servicio no utiliza cookies y los datos no se transfieren a terceros. Para obtener más información, solo puedo recomendar leer la política de privacidad de GoatCounter.
.CCIcons > Imagen, .CCIcon { Pantalla: ¡En línea! Importante; Altura máxima: 1em !Importante; Alineación vertical: Sub; } .CCIcons > Imagen, .CCIcon { Margen izquierdo: 3px; }/!-- Créditos: https://codepen.io/jh3y/pen/WNrXqYz ---/ .Texto ondulado { Alineación de texto: Centro; Posición: Absoluta; Izquierda: 50%; Espacio en blanco: Sin ajuste; Transformar: Traducir(-50%, -50%) Traducir(Calc(Var(--x, 0) * 1%), Calc(Var(--y, 0) * 1%)); configuración de variación de fuente: 'wght' Var(--lower); Margen: 0; } .WavyText Intervalo { Color: HSLA(300, 100%, 20%, Var(--alfa-l)); Animación: Rise 2,25s con infinita facilidad de entrada y salida; Retardo de animación: Calc((Var(--index) - 6) * 0,225s); Pantalla: Bloque en línea; } @keyframes Subir { 50% { configuración de variación de fuente: 'wght' Var(--upper); Color: HSLA(300, 100%, 30%, Var(--alfa-u)); Transformar: Traducir(0, -15%); } }