Welcome to my website and my first blog post! Developing this website began as a homework assignment, but I have found this to be evolving into a more personal project as well. In this post, I hope to provide a brief overview of why I decided to create this website; how I put this site together; highlight obstacles encountered during the process and describe how they were resolved; and identify lessons learned and areas for improvement in the future.
Intro
Before describing the process of building this website, I should answer the “why build this website?” Developing a personal website featuring my resume, photography and other personal work is obviously not something that would happen in an IT department. However, much of the technical knowledge gained in developing this website will be helpful and directly applicable in my professional work. For instance, a simple understanding of how to upload PDFs and documents that are available for download on a website will be immensely helpful in my current job. This knowledge could help with disseminating helpful information to the public without relying on an IT Department that may have a backlog of other work to do.
Another component of this assignment was creating an online map using free open-source software. While ESRI’s ArcGIS is regarded as the gold standard for GIS software, it also requires a costly subscription fee. As something that is cost-prohibitive, especially at a department level, effectively leveraging free GIS software could be very powerful and deliver significant cost savings and value for a department. For this exercise I chose to use QGIS, a free Open Source GIS platform. I have extensive experience using ESRI’s ArcGIS products but have not used other GIS platforms and saw this as an opportunity to learn something new. In addition, not having ESRI’s ArcGIS on my work computer due to the limited number of licenses available at work means that free and open-source software could be useful in my day-to-day work.
The cost of ESRI ArcGIS software isn’t cheap
Gaining the ability to create online maps can also be useful in communicating information to the public. In my department, a map could show all the existing infrastructure projects that we are undertaking and their status. Specific information could include anticipated dates of construction, type of construction, project manager or contact person for those with questions, or projects in the design stages. Internally, there has been discussion of creating a map showing all projects that we have worked on and include data on the specific background studies that were conducted as part of each project. For example, there times when a biological study was prepared for a project site and a few years later, we get a new project in the vicinity of that site. We could use the previous study instead of hiring a consultant to prepare a new study resulting in further cost savings. Admittedly, there are times an individual in the department may remember these sorts of things but this map would remove the risk of losing this institution knowledge should that employee leave. The map developed and included on the website is representation of what this could be or look like.
Flowchart highlighting key milestones and tasks in completing the website
Part 1: Developing Website Content
The process began by selecting a content management system (CMS). Since I am not a coder, I chose to use Squarespace as it provided an easy way to organize and get the appropriate content online. I started by uploading examples of my work that would be available for download as pdf documents. At my current job at Contra Costa County Public Works, we often have to upload public notices and documents. By learning how to do this myself, I could start doing myself rather than having IT do it for me at work. In addition to the work examples and learning how upload downloadable content, I also wanted to learn how to develop an online map. This is discussed in further detail below. I later added a photography section to showcase some of my work, resume, contact, and blog sections to better familiarize myself with developing the website.
Part 2: Website Logistics
In creating this website, I wanted to ensure that I had a unique domain name. My cousin previously purchased the mattkawashima.com domain name and encouraged me to build a website showcasing some of my photography. I had never managed to get around to doing that until now. Squarespace had domain names available including mattkawashima.net and mattkawashima.org but I was set on using the .com domain name. As such, I had to work with my cousin (the domain name holder) in transferring the domain name to me on square space. This process proved fairly painless and required my cousin to unlock the domain name from Bluehost and provide me with a code to use on Squarespace to initiate the domain name transfer.
Part 3: GIS Map Creation
I love maps. I can entertain myself looking at maps for hours. Maps can also serve as an incredibly powerful tool in communicating ideas or information more effectively than text. I decided to create a simple map showing the location of some of my project sites at work. A more complex and detailed map could have included the project sites for all environmental employees and identified specific studies that were prepared as part each project. However, for the purpose of this task and simply getting a map online, this map was sufficient.
As previously noted, I chose to use QGIS, a free Open Source GIS platform, in creating the map. Having had experience using ArcGIS, using QGIS took some time in figuring out some of the controls and functions but was fairly easy once I started getting the hang of it. Having the background knowledge and experience with GIS helped me in identifying specific controls and then researching them online to come up with solutions. I created a new point layer identifying the location of some of my project sites at work and identifying myself as the project manager in the attributes table.
Part 4: Moving Data to Cloud
Once the map was created, it was time to export the map for online use. To do this, I installed the QGIS2Web plugin on QGIS and exported the background Google Aerial basemap with the newly created point layer to my computer. When I opened up the .html file in the folder on my computer, it brought up my newly created map being displayed in Google Chrome but the link in the address was where the file was saved on my local computer.
In order to make the map publicly viewable online, I spent a significant amount of time researching methods of accomplishing this. I attempting to save the files on Dropbox and Google Drive in publicly viewable files but was unsuccessful in opening the .html web file. I then signed up for the Google Cloud Platform and uploaded the data into a bucket on there. I changed the privacy settings in the bucket to publicly viewable. This had the result I was looking for as it opened the map I had created and pointed to it’s location on the cloud.
Data saved to the Google Cloud Platform and made publicly available
The map is now hosted and available on the Google Cloud Platform
Part 5: Finalizing the Website and Map
After creating the map and opening it up from the Google Cloud, I attempted to embed the map onto the website. Squarespace has an option to automatically embed links; however, when trying to embed the link to my map on the cloud, it was unsuccessful. I tried finding an embedded link when inspecting the map online and finding something that might be helpful but abandoned that idea after striking out a few times. I then researched online and found the code below and inserted the link to my map in bolded section below. This yielded the result I was looking for and I then changed the frame width and height to sizes I wanted. The final result was the map you see above.
Attempting to find an embedded link when inspecting the page led to nothing helpful
Conclusion
And there you have it, I created a website complete with downloadable content and a custom map created with open source software and hosted on Google Cloud Storage. While this project isn’t specific to any one agency, the skills and familiarity gained during this process are easily transferable to much of my “real-world” work. In particular, I will be able to upload content including public notices to our department website without needing the IT department to constantly help. In addition, I can begin using QGIS at work in creating maps without needing an expensive ESRI license which can save the department funding. Finally, I gained experience creating an online map — the possibilities of using this experience are endless from public-facing maps that inform the public of upcoming project and status to more internal maps that help in identifying previous background studies or other existing information.