Como deixar as palavras chaves fixadas no header

Boa Tarde! Quando eu digitei os códigos de posicionamento nas palavras muitas ficaram fora de lugar, então eu mesmo redimensionei eles ao meu gosto, mas quando eu dou zoom ou tiro zoom na pagina as palavras chaves não ficam no seu devido lugar, como resolver isso?

.palavra-home {
    position: absolute;
    font-family: "Shadows Into Light", cursive;
    font-weight: bold;
    color: #D5447E;
}

.eficiencia {
    top: 2%;
    left: 70%;
}

.boas-praticas {
    top: 15%;
    left: 20%;
}

.codigo-limpo {
    top: 2%;
    left: 20%;
}

.css3 {
    top: 30%;
    left: 2%;
}

.html5 {
    top: 15%;
    left: 2%;
}

.javascript {
    top: 2%;
    left: 2%;
}

.acessibilidade {
    top: 2%;
    left: 90%;
}

.responsivo {
    top: 30%;
    left: 20%;
}

.otimizacoes {
    top: 30%;
    left: 70%;
}

.agilidade {
    top: 15%;
    left: 70%;
}

.design {
    top: 15%;
    left: 90%;
}