Production notes

A great read on why breakpoints are not perfect in website-production

View story at Medium.com

In essence, the media queries should be set to accommodate content rather than setting fixed values for resolution of a small percentage of existing devices.


A nice little recap of CSS Display values and the consequences

http://www.creativebloq.com/how-to/understanding-the-css-display-property


 Auto-Scrolling

We have implemented and auto-scroll function to the MiniSite when using the mouse-wheel. This works great on Desktop, however it does not address swiping on mobile devices and touch screens.

While successful implementing “Dragend.js”, we have run into issues about the script adding unnecessary page-height. This was an easy fix – Line 522 in the development .js file had the configuration for pageDimentions (The typo in dimensions is part of the open-source script). We have set it to the equivalent of the height of our section classes (.section) and achieved a smooth implementation of the script.

During testing-phases, we came across a Chrome feature on mobiles that was messing with our view-height of the page. Due to the address bar disappearing and re-appearing, the scrolling behaviour was inconsistent. A suggested fix was to include metadata suggesting the site is web-app-capable. However, our tests did not prove this theory to be correct.

Due to these findings, we have decided to let mobile users free-scroll our MiniSite to ensure a consistent experience across browsers.

MiniSite in progress

http://xmascrow.net/webmedia/MiniSite/MiniSite-Low-Fi.html (in progress HTML version)

http://xmascrow.net/webmedia/MiniSite/php-version/ (Finished PHP version)

Finished:

  • Homepage layout with image placeholders
  • Homepage responsive
  • Video page layout with examples
  • Video page responsive
  • Fact page layout with image placeholders
  • Fact page responsive
  • Pairing page with image placeholders
  • Pairing page responsive
  • Implemented PHP selectors
  • Implement analytics
  • Implement Tag Manager
  • SEO optimisation

Landing Page is also finished with functionality and responsive design. However, Gavin has yet to send us the content (text and imagery). He was travelling the past two weeks for work.

The campaign still goes ahead as planned, as we are having enough content on the mini site to fill the first week.

Google Search Direct Submission made easy

https://thenextweb.com/google/2017/04/10/google-index-url-submission-search/

This will make it super easy to enter the new pages (MiniSite and Landing Pages) to be picked up by Google faster and give us more exposure for the duration of the campaign.

Advertisements

Leave a Reply

Please log in using one of these methods to post your comment:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s