Introduction to Web Development

For my first module, I was tasked with creating a website – this website in fact! Going with a meta approach, I decided to document my journey. Please click on the hyperlinks below to view project-specific elements.

Primary Objectives: Incorporate the following elements…

  • An initial home page in which you introduce the purpose of your website.
  • Navigation buttons that link to the different pages on your website.
  • Experiment with CSS to make your page visually interesting and try out different layouts.

Additionally: use jQuery to accomplish the following…

Draggable jQuery

The ability to drag elements through the use of jQuery can be very useful. For example, building off of this functionality can allow visitors to interact with your website in fun new ways. Whether creating games or building experiences that incorporate touchscreen devices, it is possible to integrate elements that increase user engagement and time on site.



 

Click & drag to move me!

 

 

jQuery Accordion

The jQuery accordion is a great way to display several pieces of information in a dynamic and concise format. While search engines like Google used to ignore expandable content in the past, the algorithm responsible for ranking website content has evolved and now crawls hidden text that can be found within the source code of a website.

My Accordion

This is an example of an accordion, there are many like it, but this one is mine…

How It Works

The accordion works by using jQuery to arrange graphical elements to list items that can be expanded to reveal additional details associated with the respective header.

How It Was Built

This accordion was created through a shortcode plugin available through WordPress.