jdm / hellocon

Homepage for HelloCon Tech Conference

Website for Hello, Con!

Notable Design Features

Speed

• Minimize the use of javascript for styling; CSS does that job better. Only use javascript to interact and render data.
• Inline CSS and Script, improving first load speed, reducing the number of request.
• Optimized images: use .webp for chrome, use .jpg otherwise

Scalability & Automation (less work for me ::): :

• markdown parse: documents written by other teammembers on Google Doc e.g. code of conduct, are converted to Markdown, and then rendered with mark.js, the only manual step is to download the updated markdown file onto the server.
• csv parse: use Papa Parse library to parse csv of Speakers information (generated by google forms responses) into JSON, and then rendered. This makes updating speakers information effortless for the site maintainer (me).
• csv parse(again): for calendar, updates in the google doc will get synced easily.

Responsive & Interactive UI

• Interactive canlendar: inspired by Frosh to build a beautifully interactive calendar for the schedule page that provides an overall view without compromising details.
• Modal: Code of Conduct page is built with a modal to ensure focused reading.

Compatibility

• due to compability issues (especially for some Android integrated browsers and old version of iOS), ES5 standard is used.

Other Features

• Google Map API integration reduces the steps vistors needed to find out the location.

Todo:

• Sponsors section
• Submit (be a speaker) button embed google form in a separate page
• location BA
• home page button in menu
• update code of Conduct
• speaker page content
• intro content
• google map integration in location
• a close button for the modal
• minimize html and css