Assessment 4 — Write Scripts
The road to now /
This post marks a bit of a milestone, in that the Pod Bay Doors website is now complete! The content that was required to be included is now all implemented and accounted for, and the only casualty has been this past weekend.
Given that the site underwent a bit of an overhaul over the past 48 hours, I’ve put together a bit of a changelog:
- Overhauled general website presentation.
- Social media integration has been altered significantly. Instead of a static page to the left of the website, the site now has a “Pod Bay Doors on Social Media” button at the bottom of each page, which — when clicked — opens up a drop-down page containing the Twitter, Instagram, and Facebook feeds.
- Added a touring widget from Bandsintown.com and linked it to the Pod Bay Doors’ Facebook account, where the Pod Bay Doors (or their manager) can update touring details at any given time.
- Scrapped the “Merchandise” page and replaced it with the “Biographies” page.
- Added a Javascript image carousel to the “Gallery” page, replacing the old static gallery.
- Made the “Touring” page the website’s index (home) page.
- Gave band members and the band itself little backstories in the “Biographies” page.
- Removed most HTML validation errors that were my fault (could NOT fix any errors due to third party widget implementation).
I feel that now it’s looking a lot more snazzy!
Revisiting the brief /
After looking through the needs of the client — the Pod Bay Doors — I’m feeling confidant now that I’ve met their expectations of what they were looking for in their website.
To summarise, I needed to:
- Create a place for a band bio — created the biographies page and wrote a backstory:
- Show contact details for band members — added Facebook and Twitter links on the biographies page, as seen in the above screenshot.
- Include photos of the band — created the gallery page and put a JavaScript slideshow in it which cycles through all photos of the band included in the client resources:
- Include list of upcoming shows that they (the band) can easily update — created a Bandsintown.com profile for the band and linked it to their Facebook page, allowing them to log into it at any time and post new gigs that might be coming up:
- Include A way to listen to their songs — Added Soundcloud functionality where the band can upload their songs to:
- Create a logo — created and included as the header for the website:
The brief also called for a site that was something different; an interactive site for fans, “something where you have to scroll” being desirable; due to this — and as mentioned in the changelog I revisited my social media pane that was housed on the left of the website and transformed it into another portion of the site which unlocks when you click a JavaScript button:
This was achieved by using some Bootstrap and jQuery, and with a bit of help by way of reading w3schools tutorials on how to get the drop-down effect to work.
And now, onto some other concepts to discuss — starting with Open Platform Programming!
Open Platform Programming/
Open Platform Programming is a concept where developers can create their own applications to be integrated with existing services in order to add to, improve, or modify them with extended functionality.
A prime example of this are Widgets used Twitter, and the Like buttons used by Facebook — both of which can be added quite easily to any website to add to its functionality and interactivity.
Open Platform is not to be confused with Open Source, which refers to a type of software which is made free to the community, so people from the world over can use, maintain, and improve it.
Standard Generalized Markup Language (SGML)/
SGML is basically the bread and butter of websites.
It is a concept that encompasses elements that more or less every website uses in its construction, from <p> paragraph tags, <br> breaks, <div> tags, <table> tables and just about every commonly used element.
Standards/
Web development standards are a massive concept that touch upon every facet of web development, from HMTL to CSS and beyond.
To summarise the purpose of standards: they have been put in place to ensure that developers have rules to adhere to when developing websites, so that correct formats and semantics are used for optimum compatibility across web browsers.
Client-Side Scripting/
Client-side scripting allows for — among other things — the aesthetic altering of webpages after they have loaded, of giving them an interactive feel, or giving them a slick appearance.
This is made possible by scripts being activated by the webs browser of an end user certain event handlers are activated (for example, when a button is clicked on the webpage to open a drop-down menu).
Difference between server-side and client-side scripting/
As mentioned above, client-side scripts are handled by the web browser of the end user.
Server-side scripts are handled by the server from which they are hosted. An example of this may be signing up for an account for a website.
Programming Documentation Standards/
There are a wide variety of different programming documentation standards, each of them catering to a different form of documentation.
Generally, time should be taken to include informative comments which explain in depth what the purpose of your code is. This can help to guide writing of code to achieve a certain goal, or to fix code that isn’t working properly, or to refactor it into a more efficient script.
And thus concludes this assessment blog post!
