Landing : Athabascau University

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 : MiscPodcasts for each unit

Updated resource pages:  Unit 1 - Unit 2  - Unit 3Units 4 & 5 - Unit 6 - Unit 7

mportant notice: the student web server is unavailable. Until this is fixed, we do not require you to upload your site to the student server. See Running a web server on your local machine for details of how to meet the requirements for the final unit

Unit 6.1 - JQuery proposal

  • Public
By Mohamed Yehya in the group COMP 266 September 16, 2018 - 8:11am

Unit 6 - JQuery proposal

For this Unit, I am going to try to enhance the user experience of the webpage through Jquery.For this I have selected some of the ideas that I think will have a great effect on my personas.

1: Display a loading icon until the page loads completely

Since I have used a lot of images in my website, such as slideshows and other icons, it takes time for them to load. And it really irritating for user to see images slowly loading, especially when they have a slow internet connection. To enhance the user experience, I am going to use Jquery that will show a loading icon until the page is loaded completely.


2. Scroll Down Anchor :

My webpages have slideshows that cover the whole desktop screen. The users have to scroll down to see the content. Some user might get confused and think there is not more content on the page. To solve this issue, I will add a scroll down anchor using Jquery. This will help user know that if they want to view more content they have to scroll down or click on the scroll Anchor.

3. Add a responsive Nav Bar using Jquery

I have noticed that my navigation bar doesn’t work in some browsers such as old browsers of internet explorer. It is because I have used different methods to represent my navbar. By using jQuery plugins, I will be able to use my navbar in almost every browser.


Other Ideas will be applied if the above three ideas are done in time


Add Dynamic Content for Reviews:  I will make a separate HTML page for reviews.  Although these reviews will be made by users. But they will be directly appended to the website. These elements cannot be deleted from the user anymore once they are made. 

Modal Box: I will use the modal box using jQuery to display stylish message boxes that attracts the users.

Date picker:  By using Jquery, it will be a lot easier for me add restrictions to this date picker that I have used in my form page.