Screen shots and code for both web pages:
Professional web page:
Screen shot:
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="Bio1.css" />
<title>HAMILTON Nicolas Biography</title>
</head>
<body>
<div>
<h1> Biography </h1>
<hr></hr>
<h2>HAMILTON Nicolas</h2>
<h2>Media Designer</h2>
<div style="width:100%; height:10px; background-color:black"></div>
<img src="DSC_0020.JPG" height="300px" width="180px"></img>
<p> In this day and age it is important to be able to communicate ones ideas efficiently and meaningfully. It is the job of a media designer to do so, and as a media designer, I take great pride and pleasure in satisfying these demands.</p>
<p> As a media design student I spent 3 years studying at Victoria University in Wellington, New Zealand, and 4 more years studying game art in France. I also have 9 years of overseas experience in very different places around the pacific and south-east Asia, moreover I am fluent in three different languages, namely English, French and Japanese. I believe that this multicultural experience gives me the edge and allows me to bring a wide verity of skills and influences to my work.</p>
<p> If you wish to contact me you can do so <a href="http://nsbhschoolofdesign.blogspot.co.nz/">HERE</a>.</p>
</div>
<hr></hr>
</body>
</html>
CSS:
Personal web page:
Screenshot as normaly seen by viewer:
Screenshot with visible text:
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="Bio2.css" />
<title>Biography of ghosts</title>
</head>
<body>
<h2><em>The biography of the Ghost</em></h2>
<p><em>Our story is that of a Ghost, and it starts HERE > <span>The</span><span>thing</span><span>with</span>
<span>ghosts</span><span>is</span><span>that</span><span>you</span><span>can</span><span>only</span><span>ever</span><span>see</span><span>them</span>
<span>if</span><span>you</span><span>keep</span><span>your</span><span>eyes</span><span>on</span><span>them.</span>
<span>If</span><span>you</span><span>get</span><span id="distraction">distracted</span><span><span id="subtle">.</span><span>You</span><span>may</span><span>lose</span><span>them.</span>
<span>But</span><span>fear</span><span>not,</span><span>for</span><span>every</span><span>ghost</span><span>has</span><span>a</span><span>place</span>
<span>where</span><span>they</span><span>feel</span><span>safe,</span><span>a</span><span>place</span><span>they</span><span>are</span><span>alwase</span><span>found,</span>
<span>a</span><span>place</span><span>they</span><span>call</span><span id="home">HOME.</span>
</p>
</em>
</body>
</html>
CSS:
The black background was deliberately chosen to once again give life the idea of a child reading a ghost story under his bed sheets.
Aucun commentaire:
Enregistrer un commentaire