Build a List of Major Web Browsers

After grinding through two sets of fairly heavy theory lessons over the weekend and writing about them, it was a relief to get back to a freeCodeCamp workshop.

The workshop in question had me building a list of major web browsers with the HTML boilerplate provided, as shown beyond:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>List of Browsers and Descriptions</title>
</head>
<body>

</body>
</html>

As before on freeCodeCamp, earlier theory lessons will now be put into practice with this workshop - with Description Lists front-and-center!

In each exercise, I used description list elements to add a title and description. Every step followed the same pattern - listing the browser n…

After grinding through two sets of fairly heavy theory lessons over the weekend and writing about them, it was a relief to get back to a freeCodeCamp workshop.

The workshop in question had me building a list of major web browsers with the HTML boilerplate provided, as shown beyond:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>List of Browsers and Descriptions</title>
</head>
<body>

</body>
</html>

As before on freeCodeCamp, earlier theory lessons will now be put into practice with this workshop - with Description Lists front-and-center!

In each exercise, I used description list elements to add a title and description. Every step followed the same pattern - listing the browser name along with a short explanation. Seven steps later, the workshop was complete, and the final result is shown in the code below:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>List of Browsers and Descriptions</title>
</head>
<body>
<h1>List of Major Web Browsers</h1>
<dl>
<dt>Google Chrome</dt>
<dd>This is a free web browser developed by Google and first released in 2008.</dd>

<dt>Firefox</dt>
<dd>This is a free web browser developed by the Mozilla Corporation and first created in 2004.</dd>

<dt>Safari</dt>
<dd>This browser was developed by Apple and is the default browser for iPhone, iPad and Mac devices.</dd>

<dt>Brave</dt>
<dd>This is a free web browser first released in 2016 that is based on the Chromium web browser.</dd>

<dt>Arc</dt>
<dd>This is a free Chromium based web browser first released in 2023 by The Browser Company.</dd>
</dl>
</body>
</html>

After that, I jumped into a few theory lessons surrounding text and time semantic elements. I’ll probably wrap those up later today, and the next post will be another workshop, this time for a Job Tips page.

Similar Posts