Protecção e Segurança Rodoviária
From Labmm2
(Difference between revisions)
(→Objectivos gerais e específicos) |
(→CONDIÇÕES DE UTILIZAÇÃO DO PRODUTO FINAL) |
||
| Line 31: | Line 31: | ||
==CONDIÇÕES DE UTILIZAÇÃO DO PRODUTO FINAL== | ==CONDIÇÕES DE UTILIZAÇÃO DO PRODUTO FINAL== | ||
| - | <p><font face="Arial, Helvetica, sans-serif" size="3 | + | <p><font face="Arial, Helvetica, sans-serif" size="3" ><strong>Locais:</strong></font><font face="Arial, Helvetica, sans-serif" size="3"> Onde o utilizador tiver acesso à internet, seja num computador, telemóvel, pda, etc…</font></p> |
| - | <p><font face="Arial, Helvetica, sans-serif" size="3 | + | <p><font face="Arial, Helvetica, sans-serif" size="3" ><strong>Duração média da consulta:</strong></font><font face="Arial, Helvetica, sans-serif" size="3"> A duração média da consulta dependerá do conteúdo que o utilizador estiver interessado. Caso esteja interessado em consultar todo o conteúdo será cerca de 40 minutos.</font></p> |
==Publico-alvo== | ==Publico-alvo== | ||
Revision as of 15:36, 21 June 2011
Apresentação e contextualização do tema do projecto
Protecção e Segurança
Site de prevenção rodoviária, onde temos os conceitos de boa conduta e segurança de protecção. Com este site pretendemos implementar os efeitos que as substâncias interferem com a segurança rodoviária. A exposição de efeitos de alucinogénios e as suas consequências.
Objectivos gerais e específicos
-
Este site consiste em alertar os condutores para uma prevenção rodoviária eficiente, consiste essencialmente em informar os condutores para o efeito de drogas na condução.
-
Este site tem como objectivo criar um conceito cívico de protecção rodoviária.
-
Que procedimentos deverão tomar em caso de estar sob o efeito de substâncias alucinogénias.
-
Onde nos deveremos dirigir.
-
Como saber que estamos em condições para proceder a viagem.
-
Este site demonstra alguns factos verídicos de acontecimentos que tenham ocorrido, através de links redireccionados para jornais e revistas.
CONDIÇÕES DE UTILIZAÇÃO DO PRODUTO FINAL
Locais: Onde o utilizador tiver acesso à internet, seja num computador, telemóvel, pda, etc…
Duração média da consulta: A duração média da consulta dependerá do conteúdo que o utilizador estiver interessado. Caso esteja interessado em consultar todo o conteúdo será cerca de 40 minutos.
Publico-alvo
-
Este site tem como público-alvo os condutores em geral. Mais especificamente um público entre uma jovem e média idade.
-
Este site tem o conteúdo dirigido não só aos adultos como também aos jovens de ainda não tenham iniciado a sua vida como condutores para que possam desde tenra idade adquirirem uma ideia sólida de como se devem ou não comportar na via pública, e também para jovens que estejam a tirar a carta/licença de condução, jovens que tenham recentemente iniciado a exercer a condução de algum tipo de veiculo na via publica e daí para a frente ate uma idade mais adulta. Pois nunca é cedo nem tarde demais para ensinar as pessoas a ter civismo e bom senso na matéria de segurança rodoviária.
-
Os jovens/adultos que gostam de frequentar festas nocturnas/diurnas na qual existam bebidas alcoólicas, ou outro tipo de substâncias perigosas, que gostam de ingerir bebidas alcoólicas, etc., são um grupo de especial foco do nosso site.
Layout
No layout deste projecto o grupo optou pela utilização de um ambiente imersivo. No primeiro ecrã são dispostos vários elementos visuais (páginas de jornal) no espaço. O utilizador explora esta aplicação através do clique nestes elementos visuais.
Página Principal:
Página inicial de apresentação do website - Protecção e Segurança Rodoviária.
Página - Estatísticas:
Página que mostra links de ficheiros de consulta de estatísticas de acidentes na estradas de Portugal.
Página - Drogas
Página que mostra os diferentes e mais usuais tipos de drogas consumidos em Portugal.
Página - Segurança
Esta página consiste em alertar os condutores de veículos motorizados a ter em atenção os pontos de segurança que nesta são referidos.
Página - Emergências
Página com os procedimentos que deveremos ter ao ligar para o numero de Emergência internacional (112).
Página - Formulário
Página de contacto para esclarecimento de duvidas ou de futuras publicações sobre procedimentos a ter.
Página - Contactos
Página de contacto e comentários sobre o site.
Análise da concorrência
http://www.segurancarodoviaria.pt/noticias
http://www.brisa.pt/PresentationLayer/conteudo.aspx?menuid=8
http://www.dontriskit.info/country-roads/home/
http://think.direct.gov.uk/index.html
Estrutura XHTML implementada
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://www.facebook.com/2008/fbml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Prevenção e Segurança Rodoviária</title>
<style></style>
<link media="screen" rel="stylesheet" href="css/css.css" />
<script type="text/javascript" src="js/queryLoader.js"></script>
<script type="text/javascript" src="js/script.js" ></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js">
</script>
<script src="js/jquery.colorbox.js"></script>
<script>
$(document).ready(function(){
$(".drogas").colorbox({innerWidth:"500px", innerHeight:"500px", iframe:false});
$(".comentarios").colorbox({innerWidth:"520px", innerHeight:"500px", iframe:false});
$(".formulario").colorbox({innerWidth:"500px", innerHeight:"500px", iframe:false});
$(".emergencias").colorbox({innerWidth:"500px", innerHeight:"500px", iframe:false});
$(".segurança").colorbox({innerWidth:"500px", innerHeight:"500px", iframe:false});
$(".estatisticas").colorbox({innerWidth:"500px", innerHeight:"300px", iframe:false});
});
</script>
</head>
<body>
<div id="wrapper">
<div id="site"> </div>
<div id="estatisticas"> </div>
<div id="drogas"> </div>
<div id="seguranca"> </div>
<div id="emergencias"> </div>
<div id="bloco"><img src="imagens/pixel.png" width="1024px" height="650px" usemap="#bloco" /> </div>
<div id="maps">
<map name="bloco" id="bloco" style="visibility:hidden">
<area shape="poly" coords="536,650,474,470,458,415,638,371,654,378,667,402,689,399,722,483,698,492,736,611,726,623,616,647,533,646,454,417" href="quemsomos.html" alt="Quem Somos" class="comentarios cboxElement" onmouseover="opacidade('bloco',1)" onmouseout="opacidade('bloco',0)" />
<area shape="poly" coords="284,539,-4,437,-4,307,96,96,266,157,335,443,266,464,262,479,275,508" alt="estatisticas" href="estatisticas.html" class="estatisticas cboxElemnet" onmouseover="opacidade('estatisticas',1)" onmouseout="opacidade('estatisticas',0)"/>
<area shape="poly" coords="232,8,336,442,376,432,605,27,641,42,637,1,637,1" href="drogas.html" alt="Drogas" class="drogas cboxElement" onmouseover="opacidade('drogas',1)" onmouseout="opacidade('drogas',0)" />
<area shape="poly" coords="802,108,606,29,375,431,496,407,456,359" alt="Segurança" href="seguranca.html" class="segurança cboxElement" onmouseover="opacidade('seguranca',1)" onmouseout="opacidade('seguranca',0)" />
<area shape="poly" coords="733,602,1019,390,1019,157,901,32,458,360,495,406,636,372,653,379,667,402,687,399,721,483,697,492" alt="Emergências" onmouseover="opacidade('emergencias',1)" href="emergencias.html" class="emergencias cboxElement" onmouseout="opacidade('emergencias',0)" />
<area shape="poly" coords="533,649,455,415,268,460,264,476,323,648" alt="Formulário de Contacto" onmouseover="opacidade('bloco',1)" href="formulario.html" class="formulario cboxElement" onmouseout="opacidade('bloco',0)" />
</map>
</div>
</div>
<script type="text/javascript">
QueryLoader.init();
</script>
</body>
</html>
Folhas de estilos (CSS)
/* PRELOADER */
.QOverlay {
background-color: #000000;
z-index: 9999;
}
.QLoader {
background-color: #CCCCCC;
height: 1px;
}
/* /PRELOADER */
/* DIVs */
body {
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#000;
background-color:#000;
padding:0px;
text-align:justify;
margin:0px;
}
img {
border:none;
}
#wrapper {
width:1024px;
height:650px;
bottom: 50%;
right: 50%;
position:absolute;
}
#site {
left: 50%;
position: relative;
top: 50%;
width:1024px;
height:650px;
background-image:url(../imagens/fundo.jpg);
}
#bloco {
left: 50%;
position: relative;
top: 50%;
background-image:url(../imagens/bloco.png);
width:1024px;
height:650px;
position:absolute;
opacity:0.9;
filter:alpha(opacity=90);
-moz-opacity: .9;
}
#drogas {
left: 50%;
position: relative;
top: 50%;
width:1024px;
height:650px;
background-image:url(../imagens/Drogas.png);
position:absolute;
opacity:0.9;
filter:alpha(opacity=90);
-moz-opacity: .9;
}
#emergencias {
left: 50%;
position: relative;
top: 50%;
width:1024px;
height:650px;
background-image:url(../imagens/emergencias.png);
position:absolute;
opacity:0.9;
filter:alpha(opacity=90);
-moz-opacity: .9;
}
#seguranca {
left: 50%;
position: relative;
top: 50%;
width:1024px;
height:650px;
background-image:url(../imagens/Seguranca.png);
position:absolute;
opacity:0.9;
filter:alpha(opacity=90);
-moz-opacity: .9;
}
#estatisticas {
left: 50%;
position: relative;
top: 50%;
width:1024px;
height:650px;
background-image:url(../imagens/estatisticas.png);
position:absolute;
opacity:0.9;
filter:alpha(opacity=90);
-moz-opacity: .9;
}
#comentarios {
background:#09F;
}
/* /DIVs */
h1 {
text-align:center;
text-transform:uppercase;
background:#999;
color:#fff;
}
#conteudo {
width:475px;
background-color:#fff;
overflow:hidden;
margin-bottom:25px;
}
#conteudo img {
margin-top:20px;
margin-right:10px;
float:left;
}
/*
POPUP
*/
#colorbox, #cboxOverlay, #cboxWrapper {
position:absolute;
top:0;
left:0;
z-index:9999;
overflow:hidden;
}
#cboxOverlay {
position:fixed;
width:100%;
height:100%;
}
#cboxMiddleLeft, #cboxBottomLeft {
clear:left;
}
#cboxContent {
position:relative;
}
#cboxLoadedContent {
overflow:auto;
}
#cboxTitle {
margin:0;
}
#cboxLoadingOverlay, #cboxLoadingGraphic {
position:absolute;
top:0;
left:0;
width:100%;
}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow {
cursor:pointer;
}
.cboxPhoto {
float:left;
margin:auto;
border:0;
display:block;
}
.cboxIframe {
width:100%;
height:100%;
display:block;
border:0;
}
/*
CSS CONTEUDO POPUP
*/
#cboxOverlay {
background:#fff;
}
#colorbox {
}
#cboxTopLeft {
width:25px;
height:25px;
background:url(../imagens/colorbox/border1.png) no-repeat 0 0;
}
#cboxTopCenter {
height:25px;
background:url(../imagens/colorbox/border1.png) repeat-x 0 -50px;
}
#cboxTopRight {
width:25px;
height:25px;
background:url(../imagens/colorbox/border1.png) no-repeat -25px 0;
}
#cboxBottomLeft {
width:25px;
height:25px;
background:url(../imagens/colorbox/border1.png) no-repeat 0 -25px;
}
#cboxBottomCenter {
height:25px;
background:url(../imagens/colorbox/border1.png) repeat-x 0 -75px;
}
#cboxBottomRight {
width:25px;
height:25px;
background:url(../imagens/colorbox/border1.png) no-repeat -25px -25px;
}
#cboxMiddleLeft {
width:25px;
background:url(../imagens/colorbox/border2.png) repeat-y 0 0;
}
#cboxMiddleRight {
width:25px;
background:url(../imagens/colorbox/border2.png) repeat-y -25px 0;
}
#cboxContent {
background:#fff;
overflow:hidden;
}
#cboxError {
padding:50px;
border:1px solid #ccc;
}
#cboxLoadedContent {
margin-bottom:20px;
}
#cboxTitle {
position:absolute;
bottom:0px;
left:0;
text-align:center;
width:100%;
color:#999;
}
#cboxCurrent {
position:absolute;
bottom:0px;
left:100px;
color:#999;
}
#cboxSlideshow {
position:absolute;
bottom:0px;
right:42px;
color:#444;
}
#cboxPrevious {
position:absolute;
bottom:0px;
left:0;
color:#444;
}
#cboxNext {
position:absolute;
bottom:0px;
left:63px;
color:#444;
}
#cboxLoadingOverlay {
background:#fff url(../imagens/colorbox/loading.gif) no-repeat 5px 5px;
}
#cboxClose {
position:absolute;
bottom:0;
right:0;
display:block;
color:#444;
}
/*
FIX IE PNG
*/
.cboxIE #cboxTopLeft, .cboxIE #cboxTopCenter, .cboxIE #cboxTopRight, .cboxIE #cboxBottomLeft, .cboxIE #cboxBottomCenter, .cboxIE #cboxBottomRight, .cboxIE #cboxMiddleLeft, .cboxIE #cboxMiddleRight {
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF, endColorstr=#00FFFFFF);
}
/*
IE6 PNG
*/
.cboxIE6 #cboxTopLeft {
background:url(../imagens/colorbox/ie6/borderTopLeft.png);
}
.cboxIE6 #cboxTopCenter {
background:url(../imagens/colorbox/ie6/borderTopCenter.png);
}
.cboxIE6 #cboxTopRight {
background:url(../imagens/colorbox/ie6/borderTopRight.png);
}
.cboxIE6 #cboxBottomLeft {
background:url(../imagens/colorbox/ie6/borderBottomLeft.png);
}
.cboxIE6 #cboxBottomCenter {
background:url(../imagens/colorbox/ie6/borderBottomCenter.png);
}
.cboxIE6 #cboxBottomRight {
background:url(../imagens/colorbox/ie6/borderBottomRight.png);
}
.cboxIE6 #cboxMiddleLeft {
background:url(../imagens/colorbox/ie6/borderMiddleLeft.png);
}
.cboxIE6 #cboxMiddleRight {
background:url(../imagens/colorbox/ie6/borderMiddleRight.png);
}
.cboxIE6 #cboxTopLeft, .cboxIE6 #cboxTopCenter, .cboxIE6 #cboxTopRight, .cboxIE6 #cboxBottomLeft, .cboxIE6 #cboxBottomCenter, .cboxIE6 #cboxBottomRight, .cboxIE6 #cboxMiddleLeft, .cboxIE6 #cboxMiddleRight {
_behavior: expression(this.src = this.src ? this.src : this.currentStyle.backgroundImage.split('"')[1], this.style.background = "none", this.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src=" + this.src + ", sizingMethod='scale')");
}
.QOverlay {
background-color: #000000;
z-index: 9999;
}
.QLoader {
background-color: #CCCCCC;
height: 1px;
}
Principais scripts desenvolvidas (JavaScript)
//opacidade mouseover
function opacidade(obj, cond){
if(cond==1){
document.getElementById(obj).style.opacity=1
} else {
document.getElementById(obj).style.opacity=.9
}
}
var envio_form=0;
function validacampoobrigatorio(valor, tipovalidacao) {
// valor --> campo a ser validado
// tipovalidacao --> 0=global (sem focus no campo), 1=parcial (com focus no campo)
if (valor.value.length == 0) {
if (tipovalidacao == 1) valor.focus();
valor.style.backgroundColor="#FFC";
if (valor == form1.nome) {
document.getElementById("info1").innerHTML = "o preenchimento do nome é obrigatório";
} else if (valor == form1.apelido) {
document.getElementById("info2").innerHTML = "o preenchimento do apelido é obrigatório";
}else {
document.getElementById("info5").innerHTML = "o preenchimento da morada é obrigatório";
}
} else {
valor.style.backgroundColor="#3C0";
if (tipovalidacao == 0) envio_form++;
}
}
function validanumero(valor, tipovalidacao) {
// valor --> campo a ser validado
// tipovalidacao --> 0=global (sem focus no campo), 1=parcial (com focus no campo)
if (isNaN(valor.value) || valor.value < 18) {
if (tipovalidacao == 1) {
valor.focus();
valor.select();
}
valor.style.backgroundColor="#FFC";
document.getElementById("info3").innerHTML = "apenas para maiores de 18 anos";
} else {
valor.style.backgroundColor="#3C0";
if (tipovalidacao == 0) envio_form++;
}
}
function validaemail(valor, tipovalidacao) {
// valor --> campo a ser validado
// tipovalidacao --> 0=global (sem focus no campo), 1=parcial (com focus no campo)
if (valor.value.indexOf("@")==-1 || valor.value.length == 0) {
if (tipovalidacao == 1) {
valor.focus();
valor.select();
}
valor.style.backgroundColor="#FFC";
document.getElementById("info4").innerHTML = "email inválido";
} else {
valor.style.backgroundColor="#3C0";
if (tipovalidacao == 0) envio_form++;
}
}
function contacaract(numcaract, campovalor, idvalor) {
var y=campovalor.value;
document.getElementById(idvalor).innerHTML = (numcaract-y.length) + "/" + numcaract;
}
function validacaoglobal() {
validacampoobrigatorio(form1.primeironome, 0);
validacampoobrigatorio(form1.apelido, 0);
validacampoobrigatorio(form1.morada, 0);
validanumero(form1.idade, 0);
validaemail(form1.email, 0);
if (!(document.getElementById("tecnologias_0").checked || document.getElementById("tecnologias_1").checked || document.getElementById("tecnologias_2").checked || document.getElementById("tecnologias_3").checked)) {
document.getElementById("info6").innerHTML = "preencha uma das opções";
} else {
if (tipovalidacao == 0) envio_form++;
}
if (envio_form == 6) {
envio_form = true;
} else {
envio_form = false;
}
return envio_form;
}
function ajuda(campo) {
switch (campo) {
case 1:
document.getElementById("info1").innerHTML = "coloque aqui o seu nome";
break;
case 2:
document.getElementById("info4").innerHTML = "coloque aqui o seu e-mail";
break;
case 3:
document.getElementById("info5").innerHTML = "coloque aqui a sua mensagem";
break;
default:
}
}
function limpaajuda() {
for (i=1;i<7;i++) document.getElementById("info"+i).innerHTML = "";
}
Integração com outras tecnologias
var QueryLoader = {
/*
* QueryLoader Preload your site before displaying it!
* Author: Gaya Kessler
* Date: 23-09-09
* URL: http://www.gayadesign.com
* Version: 1.0
*
* A simple jQuery powered preloader to load every image on the page and in the CSS
* before displaying the page to the user.
*/
overlay: "",
loadBar: "",
preloader: "",
items: new Array(),
doneStatus: 0,
doneNow: 0,
selectorPreload: "body",
ieLoadFixTime: 2000,
ieTimeout: "",
init: function() {
if (navigator.userAgent.match(/MSIE (\d+(?:\.\d+)+(?:b\d*)?)/) == "MSIE 6.0,6.0") {
//break if IE6
return false;
}
if (QueryLoader.selectorPreload == "body") {
QueryLoader.spawnLoader();
QueryLoader.getImages(QueryLoader.selectorPreload);
QueryLoader.createPreloading();
} else {
$(document).ready(function() {
QueryLoader.spawnLoader();
QueryLoader.getImages(QueryLoader.selectorPreload);
QueryLoader.createPreloading();
});
}
//help IE drown if it is trying to die :)
QueryLoader.ieTimeout = setTimeout("QueryLoader.ieLoadFix()", QueryLoader.ieLoadFixTime);
},
ieLoadFix: function() {
var ie = navigator.userAgent.match(/MSIE (\d+(?:\.\d+)+(?:b\d*)?)/);
if (ie[0].match("MSIE")) {
while ((100 / QueryLoader.doneStatus) * QueryLoader.doneNow < 100) {
QueryLoader.imgCallback();
}
}
},
imgCallback: function() {
QueryLoader.doneNow ++;
QueryLoader.animateLoader();
},
getImages: function(selector) {
var everything = $(selector).find("*:not(script)").each(function() {
var url = "";
if ($(this).css("background-image") != "none") {
var url = $(this).css("background-image");
} else if (typeof($(this).attr("src")) != "undefined" && $(this).attr("tagName").toLowerCase() == "img") {
var url = $(this).attr("src");
}
url = url.replace("url(\"", "");
url = url.replace("url(", "");
url = url.replace("\")", "");
url = url.replace(")", "");
if (url.length > 0) {
QueryLoader.items.push(url);
}
});
},
createPreloading: function() {
QueryLoader.preloader = $("<div></div>").appendTo(QueryLoader.selectorPreload);
$(QueryLoader.preloader).css({
height: "0px",
width: "0px",
overflow: "hidden"
});
var length = QueryLoader.items.length;
QueryLoader.doneStatus = length;
for (var i = 0; i < length; i++) {
var imgLoad = $("<img></img>");
$(imgLoad).attr("src", QueryLoader.items[i]);
$(imgLoad).unbind("load");
$(imgLoad).bind("load", function() {
QueryLoader.imgCallback();
});
$(imgLoad).appendTo($(QueryLoader.preloader));
}
},
spawnLoader: function() {
if (QueryLoader.selectorPreload == "body") {
var height = $(window).height();
var width = $(window).width();
var position = "fixed";
} else {
var height = $(QueryLoader.selectorPreload).outerHeight();
var width = $(QueryLoader.selectorPreload).outerWidth();
var position = "absolute";
}
var left = $(QueryLoader.selectorPreload).offset()['left'];
var top = $(QueryLoader.selectorPreload).offset()['top'];
QueryLoader.overlay = $("<div></div>").appendTo($(QueryLoader.selectorPreload));
$(QueryLoader.overlay).addClass("QOverlay");
$(QueryLoader.overlay).css({
position: position,
top: top,
left: left,
width: width + "px",
height: height + "px"
});
QueryLoader.loadBar = $("<div></div>").appendTo($(QueryLoader.overlay));
$(QueryLoader.loadBar).addClass("QLoader");
$(QueryLoader.loadBar).css({
position: "relative",
top: "50%",
width: "0%"
});
},
animateLoader: function() {
var perc = (100 / QueryLoader.doneStatus) * QueryLoader.doneNow;
if (perc > 99) {
$(QueryLoader.loadBar).stop().animate({
width: perc + "%"
}, 500, "linear", function() {
QueryLoader.doneLoad();
});
} else {
$(QueryLoader.loadBar).stop().animate({
width: perc + "%"
}, 500, "linear", function() { });
}
},
doneLoad: function() {
//prevent IE from calling the fix
clearTimeout(QueryLoader.ieTimeout);
//determine the height of the preloader for the effect
if (QueryLoader.selectorPreload == "body") {
var height = $(window).height();
} else {
var height = $(QueryLoader.selectorPreload).outerHeight();
}
//The end animation, adjust to your likings
$(QueryLoader.loadBar).animate({
height: height + "px",
top: 0
}, 500, "linear", function() {
$(QueryLoader.overlay).fadeOut(800);
$(QueryLoader.preloader).remove();
});
}
}
Soluções técnicas para problemas encontrados
Melhoramentos futuros
Futuramente pretendemos melhor este site, ligando a uma base de dados mySQL / PHP, gerindo noticias de uma forma mais eficaz e mais eficiente.
Conclusões
Para o nosso projecto de protecção e segurança rodoviária realizado no âmbito da disciplina de Laboratório Multimédia 2, criamos um site com o principal objectivo de informar os condutores de todos os factores que afectam uma boa conduta na estrada. Os factores abordados foram: os efeitos das drogas na condução, entre eles o álcool e alguma drogas alucinogénas.Neste Website são disponibilizadas também estaticistas relativas aos acidentes nas estradas portuguesas nos últimos anos como forma de sensibilizar os utilizadores para a importância da prevenção.~
Sempre com o nosso público-alvo bem definido,os jovens que estão prestes a se tornarem condutores,os jovens/adultos que gostam de frequentar festas nocturnas/diurnas na qual existam bebidas alcoólicas, ou outro tipo de substâncias perigosas, finalizamos o nosso projecto aplicando os nossos conhecimentos de XHTML, CSS e JAVASCRIPT obtidos nas aulas práticas e teóricas e também aplicando outros conhecimentos obtidos através de pesquisas em prol do sucesso do nosso projecto. Aumentando assim os conhecimentos de todo o grupo envolvido.
Referências bibliográficas
Autoridade Nacional de Segurança Rodoviaria
