Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
_data
_includes
_layouts
_sass
css
img
js
photography
post
.gitignore
404.md
CNAME
Gemfile
Gemfile.lock
README.md
TODO.md
_config.yml
about.html
design.html
experimental.html
index.html
published-work.html
video.html

README.md

Sitio web - portafolio personal

Por Sebastian Reategui.

  • Diseñado con Jekyll, mediante el lenguaje Liquid
  • Utilizando el framework Bootstrap para:
    • Hacer que la estructura sea responsiva a los dispositivos móviles tanto como escritorios
    • Crear una barra de navegación útil
    • Suavizar los estilos de tipografía
  • Sobre ello, código de CSS custom basado en SCSS
  • Utilizando ícones de Bytesize

Como ver el código fuente

  • La mayoría de la estructura de las páginas se queda dentro de la carpeta /_layouts, la cual tiene una plantilla para cada sección del sitio
    • e.g. /_layouts/photography.html determina la estructura para todas las subpáginas de fotografía
  • De ahí, el contenido de esas páginas de hecho se mantiene en otro lugar, en los archivos .html en la carpeta de raíz.
    • e.g. /photography/people.html o /video.html
  • El contenido en este formato se coloca mediante YAML. A este fin, la idea es separar la definición de las colecciones, imágenes, descripciones de proyectos y fechas del código que los estructura.
  • Finalmente, el CSS queda a través de varios archivos:
    • Primero, en /css/style.css
    • Luego, más hojas de estilos (/_sass/index.scss; /_sass/about.scss) que pertenecen especificamente a las secciones del sitio se agregan mediante una llamada de SCSS @import
    • Jekyll lo combina todo y lo comprime para crear un solo archivo, minificado

Notas

  • En este diseño no se utiliza un lógotipo gráfico, dado que tenía la preferencia de dejar que mi nombre fuera la marca mediante solamente letras, las cuales me llaman más la atención que un gráfico.