Sei sulla pagina 1di 2

1 2 3 4 5 6 7 8 9 10 11

<!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"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Thomas A. Peacock</title> Title of the website. <link href="style.css" rel="stylesheet" type="text/css" /> </head> I created the navbar div to keep the logo and menu in line. At the moment, the logo doesn't appear on the site, but I'm

<body> <div id="navbar"> <div id="navmenu"><a href="index.html"><img src="Graphics/Home.png" /></a>&nbsp;<a href="#aboutSection"><img src="Graphics/About.png " /></a>&nbsp;<a href="#previousSection"><img src="Graphics/Previous Work.png" /></a>&nbsp;<a href="http://thomasapeacock.tumblr.com"> <img src="Graphics/Blog.png" /></a>&nbsp;<a href="#contactSection"><img src="Graphics/Contact.png" /></a></div><!--Navmenuend--> 12 </div><!--Navbar end--> 13 14 <div id="section1"> 15 <center><img src="Graphics/thomasAPeacockXL.png" /></center> 16 <center><h1>A Television and Broadcasting (soon to be) Graduate</h1></center> 17 <center><h2>Welcome to my site, have a look around.</h2></center><br /> 18 <center><img src="Graphics/arrow.png" width="133" height="73" /></center> 19 </div><!--Section1 End--> I added comments like this throughout the code, for ease of use. If my client were to look at the code by 20 himself, he would have some idea of what he was looking at because of these. 21 <div id="section2"> 22 <a name="aboutSection"><center><h3>About</h3></center></a> 23 <div id="columnleft"> 24 Thomas is a Television and Broadcasting student, who will be graduating in the next few months. He has gained skills and experience at the Univ ersity of Portsmouth including producing, directing and editing for projects and the CCi television channel. <br /><br />Thomas has a professional working method and pride in his work. He strives to create the best work he can. 25 </div><!--columnleft end--> The Break line tag was used to format code 26 <div id="columnright"> 27 Originally from Leicester, Thomas is happy traveling where ever he needs to, to get the job he dreams of! </br><br /> 28 Sound good? Have a look at his <a href="document/CV.pdf" target="_new">CV</a> to find out more. </div><!--columnright end--> 29 </div><!--Section2 End--> 30 31 32 <div id="section25"> I used sections for each different part of the webite eg. Home,About, Previous Work, Blog, 33 <a name="previousSection"><Center>Examples of Work</Center></a> 34 35 <div id="pwthree"> 36 CCi Live<br /><br /> 37 <div id="colmnpw3l"> Embedded video code from Vimeo. I left the last bit they provided out because it didn't suit the design. 38 <iframe src="//player.vimeo.com/video/85530688" width="500" height="281" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullsc reen></iframe> 39 <!--<p><a href="http://vimeo.com/85530688">Watch on Vimeo</a></p>--> 40 </div><!--columnpw3l end--> 41 <div id="colmnpw3r"> 42 CCi Live was a 45 minute show I produced. It's the show I am most proud of due not to the quality and content, but the determination and work I h ad put into. The planning and organising of the show had to be turned around in 4 weeks which is quite a lot of time in TV standards. This show w as full of interesting contents from a talk with producer Jon Thompson to giving students top tips on dissertations. 43 </div><!--colmnpw3r end--> 44 </div><!--PWThree End--> 45 46 <div id="pwtwo"> 47 Eye on Portsmouth - UoPTV<br /><br /> 48 <div id="colmnpw2l"> 49 <iframe src="//player.vimeo.com/video/85530688" width="500" height="281" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullsc reen></iframe> 50 <!--<p><a href="http://vimeo.com/85530688">Watch on Vimeo</a></p>--> Commented out code, client didn't want the link to the video 51 </div><!--columnpw2l end--> underneath it, so I used this method, in case it is required. 52 <div id="colmnpw2r"> 53 Eye on Portsmouth was a show aimed at the community of Portsmouth, for this show I stayed on as director. This show was a lot more challengin g due to the success of the previous work. There is a few errors with sound on the VTs but this was a learning curve and the importance of sound will forever be engraved into my mind.</div><!--colmnpw2r end--> 54 </div><!--PWTwo End--> 55 56 <div id="pwone"> 57 HeadsUP - UoPTV<br /><br /> 58 <div id="colmnpw1l"> 59 <iframe src="//player.vimeo.com/video/85530688" width="500" height="281" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullsc reen></iframe> 60 <!--<p><a href="http://vimeo.com/85530688">Watch on Vimeo</a>--> 61 </div><!--colmnpw1 end--> 62 <div id="colmnpw1r"> 63 UOP was a brand new show concept for the CCI Channel. The show works alongside the University of Portsmouth press office to bring past, pres ent and future insight on to what old, present and new students have been up to. I directed this show and oversaw all edits. I also edited the Rach el lowe VT.</div><!--colmnpw1r end--> 64 </div><!--PWOne End--> 65 66 </div><!--Section25 End--> 67 F:\CIPM\Thomas Peacock Website\index.html: 1/2

hoping to implement some code that as soon as you soon past the first sectio, the logo appears

68 <div id="section3"> 69 <a name="contactSection"><center><a href="mailto:thomas@thomasapeacock.com" target="_top"><img src="Graphics/email.png" /></a> </cent er></a> The mailto feature was used, so when a user clicks on the image, it should 70 71 bring them to their email account to send an email. 72 </div><!--Section3 End--> 73 Twitter Plugin 74 <div id="footer"> 75 &copy;Thomas Peacock 2014. All Rights Reserved <a class="twitter-timeline" href="https://twitter.com/MediaPeacock" data-widget-id="446759 995858644992">Tweets by @MediaPeacock</a> 76 77 <script src="//platform.linkedin.com/in.js" type="text/javascript"></script> 78 <script type="IN/MemberProfile" data-id="http://www.linkedin.com/in/thompeacock" data-format="click" data-text="Thomas Peacock" data-related ="false"></script> 79 LinkedIn Plugin 80 </div><!--Footer End--> 81 82 </body> 83 </html> 84 85

F:\CIPM\Thomas Peacock Website\index.html: 2/2

Potrebbero piacerti anche