Web Design

 

Try this link to log in to your cPanel account.

Looking for some video tutorials?

 

3rd Quarter Assignments:

Click on an assignment to read its description.

 

Create a username that you will use for this course. This will be part of your website's address, so choose wisely. Your username should be between 6-14 characters long, may contain only lower-case letters and numbers, must begin with a letter, and may not contain your name. Record your choice of username in a document and submit as Last_First_username.pdf.

To prepare for creating a website, we'll begin by looking at some terminology and some examples. Use this template as a starting point or refer to this pdf file to answer a set of introductory questions. Submit your responses as Last_First_WebIntro.pdf.

Log in to your cPanel account and create a basic page in the cPanel file manager, following the tutorial. Your page should be titled 'Basic Webpage,' should have a background color other than white, should have at least three different size fonts, and should have at least one font color other than black. Post a note in Schoology once you have completed your page.
Here's an example.

Add at least two images to your basic web page. At least one image should be stored in your folder and at least one image should be linked from the internet. Be sure to include an alt text. Use Creative Commons/Public Domain images that do not require citation, or give credit where credit is due. Center at least one image on your page. Leave a note in Schoology when you have completed the assignment.
Here's an example.

Continue working with your basic web page. Follow the video posted in Schoology to add at least 5 special characters and/or emojis to your page, including at least one of each. Add these to your homepage, and leave a note in Schoology when completed.
Here's an example.

Follow the hyperlinks video tutorial to explore adding links to your basic page. You will need to create a second page if you have not already done so, linking to it with a relative URL, and providing a link back to your home page. Also include at least one external link (absolute URL) that opens in a new tab. You do not need to submit these pages. Rather, upload them to the server and then leave a comment in Schoology that you have completed the assignment.
Here's an example.

Follow the video posted in Schoology or on the Tutorials page to add spans and font descriptions to your basic page. Add at least one instance each of italics, strikethrough, underlining, and a unique font family. Leave a note in Schoology when you have finished.
Here's an example.

Follow the video posted in Schoology or on the Tutorials page to explore using an image as the background for an html page. Experiment with different size images and with different levels of transparency. Add a background image to at least one of your online pages. Leave a comment in Schoology when you are done.
Here's an example.

Use the video in Schoology or on the Tutorials page to create and upload a favicon for your website. The video demonstrates modifying an image to use as a favicon, but one can also create a new image using a program such as Photoshop that contains a simple character, as an example. Once the favicon is working properly on all of your online pages, click on Submit in Schoology, then on the Create tab, and leave a short note that your favicon is working.

Use the video in Schoology to create and upload a CSS stylesheet for your website. The video demonstrates using CSS to define a font, but CSS can serve many other functions, as well. In fact, after completing the assignment you should explore some of those possibilities on your own. For the assignment, define a minimum of three fonts that you can use on at least one of your online pages. After uploading your stylesheet and your updated html pages, click on Submit in Schoology, then on the Create tab, and leave a short note that you have completed the assignment.

View the Divs video in Schoology or on the Tutorials page and use it as a guide to create at least three divs in the provided html file. For this assignment, place the styling statements in the head section of the html file, not in an external stylesheet. Make sure each div uses a unique font and background color; you may also use a background image. Rename the provided file as divs.html and leave a note in Schoology that you have updated your page in your cPanel account.

View the CSS Positioning video in Schoology or on the Tutorials page and use it as a guide to create at least four divs that have the positioning style defined. For this assignment, place the styling statements in the head section of the html file, not in an external stylesheet. Make sure to use at least one example each of relative, absolute, fixed, and sticky. Submit your page in Schoology as Last_First_Positioning.html.

Use the video on Lists in Schoology, as well as other resources you find helpful, as a guide to create a page that has at least one ordered list and at least one unordered list. Instead of making a new page, you can add lists to an already existing page in your cPanel account. Apply some styling in the head section of your page to help distinguish between the two list types. This could include font color, font family, line height, etc. Leave a note in Schoology providing the name of the page on your site which has lists.

Spend some time sharing your website with at least three classmates that you normally do not sit near. Fill out and physically turn in the sheet you receive, highlighting what you observe and how that could potentially influence further work on your own site.

 

 

 

Home