changed first header with visually hidden h1
This commit is contained in:
108
index.html
108
index.html
@@ -38,6 +38,64 @@
|
|||||||
<body id="body">
|
<body id="body">
|
||||||
<main>
|
<main>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!--
|
||||||
|
TITLE AREA
|
||||||
|
-->
|
||||||
|
<div id="title_area" class="section">
|
||||||
|
<h1 class="visually-hidden">hugo lamy - programmeur informatique</h1>
|
||||||
|
<div id="name" style="gap:10px 30px;" data-flex="horizontal center wrap">
|
||||||
|
<pre aria-hidden="true">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</pre>
|
||||||
|
<pre aria-hidden="true">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</pre>
|
||||||
|
</div>
|
||||||
|
<div id="title" style="gap:10px 30px;" data-flex="horizontal center wrap">
|
||||||
|
<pre aria-hidden="true">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</pre>
|
||||||
|
<pre aria-hidden="true">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</pre>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<!--
|
||||||
|
END TITLE AREA
|
||||||
|
-->
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<!--
|
<!--
|
||||||
PROJECTS
|
PROJECTS
|
||||||
-->
|
-->
|
||||||
@@ -78,6 +136,8 @@
|
|||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<!--
|
<!--
|
||||||
CV
|
CV
|
||||||
-->
|
-->
|
||||||
@@ -159,6 +219,9 @@
|
|||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<!--
|
<!--
|
||||||
INFOS
|
INFOS
|
||||||
-->
|
-->
|
||||||
@@ -177,51 +240,6 @@
|
|||||||
|
|
||||||
|
|
||||||
|
|
||||||
<!--
|
|
||||||
TITLE AREA
|
|
||||||
-->
|
|
||||||
<div id="title_area" class="section">
|
|
||||||
<div role="heading" aria-level="1" title="hugo lamy" id="name" style="gap:10px 30px;" data-flex="horizontal center wrap">
|
|
||||||
<pre aria-hidden="true">
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
</pre>
|
|
||||||
<pre aria-hidden="true">
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
</pre>
|
|
||||||
</div>
|
|
||||||
<div role="heading" aria-level="1" title="programmeur informatique" id="title" style="gap:10px 30px;" data-flex="horizontal center wrap">
|
|
||||||
<pre aria-hidden="true">
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
</pre>
|
|
||||||
<pre aria-hidden="true">
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
</pre>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!--
|
|
||||||
END TITLE AREA
|
|
||||||
-->
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<!--
|
<!--
|
||||||
MOUSE 1
|
MOUSE 1
|
||||||
|
|||||||
@@ -1,3 +1,20 @@
|
|||||||
|
/* https://stackoverflow.com/questions/62107074/how-to-hide-a-text-and-make-it-accessible-by-screen-reader */
|
||||||
|
.visually-hidden {
|
||||||
|
border: 0;
|
||||||
|
padding: 0;
|
||||||
|
margin: 0;
|
||||||
|
position: absolute !important;
|
||||||
|
height: 1px;
|
||||||
|
width: 1px;
|
||||||
|
overflow: hidden;
|
||||||
|
outline: none;
|
||||||
|
box-shadow: none;
|
||||||
|
clip: rect(1px 1px 1px 1px); /* IE6, IE7 - a 0 height clip, off to the bottom right of the visible 1px box */
|
||||||
|
clip: rect(1px, 1px, 1px, 1px); /* maybe deprecated but we need to support legacy browsers */
|
||||||
|
clip-path: inset(50%); /* modern browsers, clip-path works inwards from each corner */
|
||||||
|
white-space: nowrap; /* added line to stop words getting smushed together (as they go onto separate lines and some screen readers do not understand line feeds as a space) */
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
/*
|
/*
|
||||||
DATA-FLEX
|
DATA-FLEX
|
||||||
|
|||||||
Reference in New Issue
Block a user