Since this morning, I have been working on building a prototype website as a fun way of getting the hang of HTML.
I posted my code for the prototype below, the end goal is to have it display multiple videos at once. Right now, I have one embedded video embedded from one of my favorite educational YouTube channels, PBS SpaceTime. I've entered my code below, expect for an update tomorrow and a change in concept. The first version of it is just to see how to embed videos and code the bullet list in HTML files.
What I like about the website:
- It is playing the embedded video fine
- It includes a title and bullet points stating my current thoughts
- Website makes use of attributes for later organization
What I dislike:
-Too much empty space
-Very basic design overall due to lack of CSS involvement
-Needs more videos
-Needs to include hyperlink text
-Lacks background color and design scheme
<body>
<h1><u>Protowebsite</u></h1>
<div id="media">
<h2><p></p>PBS SpaceTime Discussing the recent the concept of "Attosecond"</h2>
<iframe src="https://www.youtube.com/embed/5e83QRGoRCo?si=PfZPSMWpSr6sZ4Bf" width=1080 height="1200" >
Video is not supported -_-
</iframe>
</div>
<div id="information">
<h2>Background</h2>
<p> This test website was created for viewing my current skillset in terms of HTML web building.<br>
I want to be able to create my own website after I feel this project is finished.
</p>
</div>
<div id="Progress check">
<h2>What I dislike</h2>
<ul>
<li>Website lacks background <strong>color and deseign</strong> scheme</li>
<li>Very basic design overall due to <strong>no CSS involment</strong></li>
<li><strong>A lot of empty space</strong> that needs to be filled somehow</li>
<li>Needs <strong>more videos</strong></li>
<li>Needs <strong>hyperlink text</strong> for subjects/nouns included in the update</li>
</ul>
<h2>What I like</h2>
<ul>
<li>Website is playing video just fine</li>
<li>website includes titles and bullet points</li>
<li>website shows that I know how to scale and embed youtube videos</li>\
<li>webiste makes use of attributes for later organization</li>
</ul>
</div>
</body>
This will wrap up my first week of the DPI program and I am excited to see what's next!
Top comments (0)