# SkipLink

El primer enlace de la página, invisible hasta que el teclado lo alcanza: va directamente al contenido, saltando la navegación.

## Playground

```html
<a class="feitio-skip-link" style="position: static; translate: none" href="#playground">Saltar al contenido</a>
```

## Cuándo usarlo

-   En cada página con navegación antes del contenido, que es casi todas. AppShell y DocPage ya incluyen esto.

## Cuándo no usarlo

-   En una página sin nada antes del contenido.

## Ejemplos

### Cómo aparece

Presione Tab justo después de abrir esta página: "Saltar al contenido" aparece en la esquina, como papel levantado. Abajo, está dibujada abierta.

Mostrar código

```html
<a class="feitio-skip-link" href="#conteudo">Pular para o conteúdo</a>
…
<main id="conteudo" tabindex="-1">…</main>
```

## Accesibilidad

-   Debe ser el primer elemento enfocable, y su objetivo (`main`) debe aceptar el foco (`tabindex="-1"`).
-   Aparece al enfocar; nunca está oculto para bien.

## Atributos

Atributo

Valores

Para qué sirve

`class="feitio-skip-link"`

obligatorio

Oculto hasta que llega el teclado; aparece como papel levantado.

`href`

`"#conteudo"`

El id del contenido principal.

`tabindex="-1"`

sobre el `<main>`

El objetivo acepta el foco.