Landing : Athabascau University

Unit 2

  • Public
By Brent Beaudry in the group COMP 266 October 9, 2020 - 4:32pm

HTML Critique:

 

Sample1 – The first thing that jumped out at me was the lack of organization and poor readability. I cleaned up the indentation and provided some spacing between the head and body, as well each element within each. Then I was able to look at the tags and clean them up, properly ordering them so that the headings and text displayed properly. I left the table in the code but added the heading “Don’t do this:”. The reason for this is to demonstrate clean, readable coding for a table (body/rows/data elements). I also added a viewport meta tag to make the page scalable for width so that it can be read on different screen sizes.

 

Sample 2 – I got rid of the references in the and tags and added the viewport meta tag. I cleaned up the indentation. Now the file is ready to flesh out with code.

 

I added and divs to each file, and wrapped the existing body content in a div.

 

I opened each file with Firefox, Chrome and Edge to ensure cross-platform readability.

 

 

For the login page (index.html), I used a simple form and cheated (for the time being) on the interlinking by adding an href to the Submit button. I left out the “required” attributes for the username and password inputs to preserve flow functionality through the Submit button. There is no need to enter a username or password for our purposes, of course.

 

I created a home page for the client persona (client_home.html) that displays a dashboard of progress (in a table) and a list of communications from others with access to the client’s profile (provider and 3rd party). This is where I included the external link. The home pages for provider and 3rd party personas will be similar, but the 3rd party will be a read-only of the client dashboard. The provider home page will have one extra level in the hierarchy displaying a list of the client profiles in their portfolio.

 

There is an activity page (client_activity.html) containing a single activity (form for email is here). Functionality was tested and it works as intended.

 

I created the beginnings of a conference page, with a placeholder video for now. This page will be the portal to the video conference functionality of the site (beyond the scope of this course).

 

Link to files:

 

http://student.athabascau.ca/~brentbe9/Unit2

  Unit_2.zip

Comments

These comments are moderated. Your comment will not be visible unless accepted by the content owner.

Only simple HTML formatting is allowed and any hyperlinks will be stripped away. If you need to include a URL then please simply type it so that users can copy and paste it if needed.

(Required)

(Required)


Group members: this is the place for your learning diary. Use this to post your zipped-up site at least once each unit, and your reflections as often as you wish (at least once per unit). Please write your reflections directly in the post, not as attached files. Where you do need to attach documents, such as for unit 1 designs, use PDF, PNG or JPG formats. You can attach files using the 'Embed content' link in the editor.

QUICK COURSE LINKS:  Add blog post - Read latest group postsFAQs: Course process : Site design : HTML : CSS : JavaScript : JQuery : AJAX : Misc