Skip to content

Commit

Permalink
Ajustes de acessibilidade
Browse files Browse the repository at this point in the history
  • Loading branch information
Bruno Pulis committed May 19, 2017
1 parent 46310c0 commit 0fd0cdf
Show file tree
Hide file tree
Showing 2 changed files with 95 additions and 76 deletions.
13 changes: 13 additions & 0 deletions css/style.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,19 @@
font-family: 'Open Sans', sans-serif;
}

/* Ckasse oara acessibilidade */
.sr-only {
position: absolute;
width: 1px;
height: 1px;
padding: 0;
margin: -1px;
overflow: hidden;
clip: rect(0,0,0,0);
border: 0;
}


body {
background: #f8f8f8;
}
Expand Down
158 changes: 82 additions & 76 deletions index.html
View file
Original file line number Diff line number Diff line change
@@ -1,84 +1,90 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Mulheres Palestrantes</title>
<link rel="icon" type="image/png" href="img/favicon-32x32.png" sizes="32x32" />
<link rel="icon" type="image/png" href="img/favicon-16x16.png" sizes="16x16" />
<html lang="pt-br">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Mulheres Palestrantes</title>
<link rel="icon" type="image/png" href="img/favicon-32x32.png" sizes="32x32" />
<link rel="icon" type="image/png" href="img/favicon-16x16.png" sizes="16x16" />

<meta name="description" content="Lista de mulheres que palestram sobre programação, design, empreendedorismo e tecnologia.">
<meta name="keywords" content="mulheres palestrantes, programação, design, empreendedorismo, tecnologia, insideout project brasil, inside out, insideout">
<meta name="description" content="Lista de mulheres que palestram sobre programação, design, empreendedorismo e tecnologia.">
<meta name="keywords" content="mulheres palestrantes, programação, design, empreendedorismo, tecnologia, insideout project brasil, inside out, insideout">

<!-- Open Graph Data -->
<meta property="og:type" content="website">
<meta property="og:title" content="Mulheres Palestrantes | InsideOut Project Brasil">
<meta property="og:description" content="Lista de mulheres que palestram sobre programação, design, empreendedorismo e tecnologia.">
<meta property="og:url" content="http://insideoutproject.xyz/mulheres-palestrantes">
<meta property="og:image" content="http://insideoutproject.xyz/images/insideout-600x600.png">
<!-- Open Graph Data -->
<meta property="og:type" content="website">
<meta property="og:title" content="Mulheres Palestrantes | InsideOut Project Brasil">
<meta property="og:description" content="Lista de mulheres que palestram sobre programação, design, empreendedorismo e tecnologia.">
<meta property="og:url" content="http://insideoutproject.xyz/mulheres-palestrantes">
<meta property="og:image" content="http://insideoutproject.xyz/images/insideout-600x600.png">

<!-- Twitter Card -->
<meta name="twitter:card" content="summary">
<meta name="twitter:title" content="Mulheres Palestrantes | InsideOut Project Brasil">
<meta name="twitter:description" content="Lista de mulheres que palestram sobre programação, design, empreendedorismo e tecnologia.">
<meta name="twitter:url" content="http://insideoutproject.xyz/mulheres-palestrantes">
<meta name="twitter:image" content="http://insideoutproject.xyz/images/insideout-600x600.png">
<!-- Twitter Card -->
<meta name="twitter:card" content="summary">
<meta name="twitter:title" content="Mulheres Palestrantes | InsideOut Project Brasil">
<meta name="twitter:description" content="Lista de mulheres que palestram sobre programação, design, empreendedorismo e tecnologia.">
<meta name="twitter:url" content="http://insideoutproject.xyz/mulheres-palestrantes">
<meta name="twitter:image" content="http://insideoutproject.xyz/images/insideout-600x600.png">

<link rel="stylesheet" type="text/css" href="css/style.css">
<link href='http://fonts.googleapis.com/css?family=Open+Sans:400,300' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="css/font-awesome.min.css">
</head>
<body>
<a href="https://github.com/insideoutprojectbr/mulheres-palestrantes">
<img class="fork-me" src="img/fork-me.png" alt="Fork me on GitHub" data-canonical-src="https://s3.amazonaws.com/github/ribbons/forkme_right_white_ffffff.png">
</a>
<header>
<h1>Mulheres Palestrantes</h1>
<p><a class="contribute" target="_blank" href="https://github.com/insideoutprojectbr/mulheres-palestrantes#como-contribuir-com-o-projeto">Quero meu nome aqui! :) Como posso fazer isso?</a></p>
</header>
<main class="main">
<div class="headline">
<p>Procurando mulheres para palestrar em seu evento?</p>
<h2>O <strong>Mulheres Palestrantes</strong> é uma lista de mulheres que falam sobre assuntos relacionados a programação, design, empreendedorismo e tecnologia num geral.</h2>
</div>
<link rel="stylesheet" type="text/css" href="css/style.css">
<link href='http://fonts.googleapis.com/css?family=Open+Sans:400,300' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="css/font-awesome.min.css">
</head>
<body>
<a href="https://github.com/insideoutprojectbr/mulheres-palestrantes">
<img class="fork-me" src="img/fork-me.png" alt="Fork me on GitHub" data-canonical-src="https://s3.amazonaws.com/github/ribbons/forkme_right_white_ffffff.png">
</a>

<form action="#" class="search-form">
<input class="search" type="text" placeholder="Busque por nome, cidade ou tag" autocomplete="on" autofocus>
</form>
<header>
<h1>Mulheres Palestrantes</h1>
<p><a class="contribute" target="_blank" href="https://github.com/insideoutprojectbr/mulheres-palestrantes#como-contribuir-com-o-projeto">Quero meu nome aqui! :) Como posso fazer isso?</a></p>
</header>

<article class="card">
<img src="" class="photo" alt="">
<h3></h3>
<ul class="tags">
<li></li>
</ul>
<div class="after-tags">
<p class="location"></p>
<ul class="social-media">
<li class="fb"><a target="_blank"><i class="fa fa-facebook-square fa-2x"></i></a></li>
<li class="twitter"><a target="_blank"><i class="fa fa-twitter-square fa-2x"></i></a></li>
<li class="github"><a target="_blank"><i class="fa fa-github-square fa-2x"></i></a></li>
<li class="behance"><a target="_blank"><i class="fa fa-behance-square fa-2x"></i></a></li>
<li class="linkedin"><a target="_blank"><i class="fa fa-linkedin-square fa-2x"></i></a></li>
<li class="site"><a target="_blank"><i class="fa fa-external-link-square fa-2x"></i></a></li>
</ul>
</div>
</article>
</main>
<footer>
<img src="img/logo.png" alt="js4girls logo">
</footer>
<script src="http://pure.github.io/pure/libs/pure.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/blueimp-md5/1.1.1/js/md5.min.js"></script>
<script type="text/javascript" src="app.js"></script>
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-68652979-1', 'auto');
ga('send', 'pageview');
</script>
</body>
<main class="main">
<div class="headline">
<p>Procurando mulheres para palestrar em seu evento?</p>
<h2>O <strong>Mulheres Palestrantes</strong> é uma lista de mulheres que falam sobre assuntos relacionados a programação, design, empreendedorismo e tecnologia num geral.</h2>
</div>

<form action="#" class="search-form" role="search">
<label for="search" class="sr-only">Pesquisar</label>
<input class="search" type="text" placeholder="Busque por nome, cidade ou tag" id="search" autocomplete="on" autofocus>
</form>

<article class="card">
<img src="" class="photo" alt="">
<h3></h3>
<h4 class="sr-only">Área de interesse para palestras</h4>
<ul class="tags">
<li></li>
</ul>
<div class="after-tags">
<p class="location"></p>
<ul class="social-media">
<li class="fb"><a target="_blank"><i aria-label="Facebook" class="fa fa-facebook-square fa-2x"></i></a></li>
<li class="twitter"><a target="_blank"><i aria-label="Twitter" class="fa fa-twitter-square fa-2x"></i></a></li>
<li class="github"><a target="_blank"><i aria-label="GitHub" class="fa fa-github-square fa-2x"></i></a></li>
<li class="behance"><a target="_blank"><i aria-label="Behance" class="fa fa-behance-square fa-2x"></i></a></li>
<li class="linkedin"><a target="_blank"><i aria-label="Linkedin" class="fa fa-linkedin-square fa-2x"></i></a></li>
<li class="site"><a target="_blank"><i aria-label="Link externo" class="fa fa-external-link-square fa-2x"></i></a></li>
</ul>
</div>
</article>
</main>

<footer>
<img src="img/logo.png" alt="js4girls logo">
</footer>

<script src="http://pure.github.io/pure/libs/pure.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/blueimp-md5/1.1.1/js/md5.min.js"></script>
<script type="text/javascript" src="app.js"></script>
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-68652979-1', 'auto');
ga('send', 'pageview');
</script>
</body>
</html>

0 comments on commit 0fd0cdf

Please sign in to comment.