Suporte » Temas e templates » O que é "assistive-text" no Twenty Eleven

  • Estou usando o tema Twenty Eleven 1.2, e no nav-menu tem um código, porém não aparece no visual do site:

    <h3 class="assistive-text"><?php _e( 'Main menu', 'twentyeleven' ); ?></h3>

    que fica assim no site:

    <h3 class="assistive-text">Main menu</h3>

    O que é isso, e pra que serve?
    é algo relacionado a SEO?

    Obrigado!

A visualizar 6 respostas - de 1 a 6 (de um total de 6)
  • assistive-text é uma classe, serve para várias coisas, mas a mais primária é definir um nome ( atalho ) para um grupo de instruções de CSS.

    CSS é a linguagem usada para “colorir” e “dar forma” ao teu WordPress.
    Poderás ler um pouco mais em http://www.w3.org/Style/CSS/ e http://www.w3schools.com/tags/att_standard_class.asp

    PS: Preocupa-te primeiro em entender como funciona o HTML, CSS e toda a forma de construção de uma página web, depois sim, preocupa-te com o “SEO”.

    Thread Starter Gilson de Carvalho

    (@gilsones)

    Domino perfeitamente as linguagens CSS HTML e PHP, minha dúvida é para que serve aquele trexo de código que é inserido no nav-menu, já que ele não é mostrado, apenas está lá.

    Analise o código com atenção e perceberá:

    <nav id="access" role="navigation">
    
    				<h3 class="assistive-text">Main menu</h3>
    
    								<div class="skip-link"><a class="assistive-text" href="#content" title="Skip to primary content">Skip to primary content</a></div>
    
    				<div class="skip-link"><a class="assistive-text" href="#secondary" title="Skip to secondary content">Skip to secondary content</a></div>
    
    								<div class="menu"><ul><li class="current_page_item"><a href="http://localhost/tigertools/" title="Início">Início</a></li><li class="page_item page-item-2"><a href="http://localhost/tigertools/?page_id=2" title="Página de Exemplo">Página de Exemplo/a><ul class='children'><li class="page_item page-item-4"><a href="http://localhost/tigertools/?page_id=4" title="Página de teste">Página de teste</a></li></ul></li></ul></div>
    			</nav><!-- #access -->

    Ou se preferir:
    http://twentyelevendemo.wordpress.com/
    Repare os primeiros código dessa tag: <nav id=”access” role=”navigation”>

    Aparentemente não servem pra nada =/

    a Função _e() serve para retornar a tradução para uma dada frase.

    Thread Starter Gilson de Carvalho

    (@gilsones)

    kkkk Cyclop tá de brincadeira…

    melhor perguntar em outro lugar mais avançado, que aqui pelo jeito só tem amador

    Ok Master 🙂

    Thread Starter Gilson de Carvalho

    (@gilsones)

    Segue a explicação do código caso mais alguém tenha interesse de aprender:
    ——————————————-

    Olá. Isso é uma regra de acessibilidade para:
    (1) pessoas que possuem deficiência visual
    (2) pessoas com deficiência motora que navegam com a tecla TAB/ via teclado

    No caso (1), os deficientes visuais, utilizam um leitor de tela, que vai ler
    os links “Skip to primary content” e “Skip to secondary content”. Isso serve
    para que ele vá direto ao conteúdo do site, sem ter que passar pelos outros
    itens menos relevantes.

    No caso (2) é bem parecido. Só que o deficiente motor, ao navegar com o TAB,
    vai perceber pela barra inferior do navegador de internet, que está em um
    link “Skip to primary content” e poderá, da mesma forma, ir direto ao
    conteúdo do site.

    Quem se preocupa com acessibilidade web, geralmente cria outros itens como
    “Skip do menu”, ferramentas de alto contraste, tamanho da fonte, etc. Existe
    uma lei federal, desde 2004, que diz que os sites brasileiros devem ser
    acessíveis! Mas, estamos falando de Brasil…

    Uma observação é que estes links “Skip to primary content” são “invisíveis”
    para nós. Ou seja, eles estão no código, mas possuem um estilo
    “display:none” ou “text-ident:-10000” ou “visible:hidden” ou é inibido por
    javascript, para que seja mostrado apenas para quem deseja ver. O ideal é
    que estes links estejam visíveis, para até nós, utilizarmos, como você pode
    ver no site: http://www.brasil.gov.br/

    Eu fiz um trabalho acadêmico sobre isso. Caso tenha interesse em saber um
    pouco mais:
    http://acessoufba.wordpress.com/

    Se puder assista o vídeo, sua visão será outra!
    http://youtu.be/rx1-BawHDEY

    Espero ter ajudado.

    Abraços!

    Adriano Fialho
    http://about.me/afialho

    Post Original: http://groups.google.com/group/wordpress-brasil/browse_thread/thread/99560a88595330b0#msg_646c8fdb2b7b1891

A visualizar 6 respostas - de 1 a 6 (de um total de 6)
  • O tópico ‘O que é "assistive-text" no Twenty Eleven’ está fechado a novas respostas.