Template com CSS Grid - #7 W3C, Minificação e Inclusão Dinâmica
02/01/2021Nesse tutorial falaremos um pouco sobre aprimoramentos que podemos realizar no frontend no nosso website, tais como validações e minificações.
Aprimoramentos no Frontend
O primeiro aprimoramento que faremos será a validação no W3C, então basta acessar o link abaixo e enviar seu arquivo html para o ar.
O segundo aprimoramento citado é a minificação dos arquivos CSS e JS que servem para retirar comentários e espaços vazios, reduzindo assim o tamanho final dos arquivos e consequentemente facilitando a abertura dos websites. Segue abaixo o link externo para minificar seu CSS:
Por convenção os arquivos minificados são salvos como nome_do_arquivo.min.css. Não esqueça que após minificar é necessário linká-lo no html:
<link rel="stylesheet" href="./lib/css/style.min.css?v=2">Uma outra maneira de comprimir seus arquivos é através do Yui Compressor com o PHPStorm.
O terceiro aprimoramento é a inclusão dinâmica de partes do código que não se alteram de um template pra outro, por exemplo as meta-tags. Podemos usar para isso o include do PHP:
index.html
<?php include('inc/header.php'); ?>
<div class="container">
</div>
<?php include('inc/footer.php'); ?>inc/header.php
Criaremos posteriormente o diretório inc e dentro dele os arquivos header e footer.php que serão incluídos dinâmicamente.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Layout Grid</title>
<link rel="stylesheet" href="./lib/css/style.min.css?v=2">
</head>
<body>Por hoje é só! Sucesso nos códigos e na vida!
Precisa de um professor para te auxiliar? webdesignemfoco@gmail.com
Posts Relacionados
