The success of websites are crucial to any field. In chemistry specifically, websites that provide access to databases, journals, and products are necessary. Websites must be accessible to users as well, and look professional. The information given by a website could be correct, but if the website has different styles throughout and is hard to navigate, users will lose trust in the content quickly. CSS can help avoid formatting issues in HTML-based websites. It is also important for those who own the websites to be able to analyze who is visiting and other details of those visitors; Google Analytics offers a simple way to do this.
CSS
What is CSS?
CSS stands for Cascading Sheet Styles, and is a coding language that works along with HTML to allow websites to have consistent formatting across pages, as well as make professional presentation of content easier to achieve. CSS can format all text in factors like size, position, color, and other stylistic elements (Girl Develop It, n.d.).
How does CSS work?
CSS works in tandem with HTML in a few different ways. CSS can be utilized in a separate file known as a stylesheet that includes all the formatting data for the main HTML file that houses the content for the website, that are linked together (codecademy, n.d.). CSS can also be included directly in the HTML file, either as a separate style section or inline, though the separate style section is preferred since it deviates farther from standard HTML styling and is easier to use for larger projects (Girl Develop It, n.d.).
What is the CSS language made up of?
CSS uses rules, which are blocks of its code that include selectors and declarations, in which declarations are split into properties and values. Selectors can be for IDs or classes. IDs are reserved for single elements on a webpage, whereas classes are used for elements that are repeated. In the declaration - which comes after the selector - the property defines what will be formatted and the value declares what that formatting will look like (Girl Develop It, n.d.).
Example of CSS rule (Girl Develop It, n.d.).
Google Analytics
What is Google Analytics and how does it work?
Google Analytics is a service provided through Google that allows users to collect data from websites and mobile applications, as well as other digitally connected environments. Google Analytics is implemented differently depending on the digital source, but overall functions in the same way for each situation through a process that only starts with data collection. After raw data is collected, it goes through processing and configuration, and lastly, reporting (Google Analytics, 2013).
The process Google Analytics goes through (Google Analytics, 2013).
Collection
Collection is enabled through different coding techniques in different situations and systems. For websites, a small piece of JavaScript is embedded on each page to send data to Google Analytics' servers as a package known as a "hit" or "interaction" whenever someone visits that page. Some of the types of data that can be included in the "hit" are the browser the visitor is using to access the page, the country they are in as they access the page, and how long they stay on the page. For Blogger specifically - another Google service - only a tracking code must be added to the blog for Google Analytics to link to it and start collecting data. For mobile applications, JavaScript code pieces are not necessarily used, but a different method is used based on the operating system of the device. Data is then collected after an "activity" is completed rather than when someone has simply viewed the page. Data can also be collected when the device is offline and sent back when the device reconnects. Other digital environments can be linked with Google Analytics with similar but more complicated uses of coding (Google Analytics, 2013).
An example of a what Google Analytics looks like once a website has been linked, in this case, the Google Analytics linked to this blog.
Processing and Configuration
Processing is the step in which the raw data that has been sent back to Google Analytics' servers is organized and configuration settings used to process the data. Configuration settings will differ from user to user, and can allow the exclusion of data that may be useless. At the end of processing, data is stored into a database and cannot be changed. The database can then be accessed through the user's Google Analytics account and reports summarizing that processed data are also available there (Google Analytics, 2013).
Reporting: How Can Processed Data Be Analyzed?
Once a user has logged into their Google Analytics account, they can access the reporting interface and manipulate the processed data to utilize it for their needs. Many different aspects of the report can be changed to best analyze the data collected. The active data range can be changed, and also be compared to another date range across all graphs and reports. The main graph can also be changed to display by day, week, or month. Notes can be added to specific dates so the impact - or lack thereof - of events and campaigns can be measured. The metric displayed on the main graph can be changed and compared to another metric, the same way dates could be compared. Most reports also have tables where more data can be viewed and compared at once. Each row shows data for a different value of the dimension being analyzed, which could be country, browser, or something else entirely. The primary dimension is the dimension that will be shown in the first column, while a secondary dimension can be added into the second column so data can be refined. For example, the amount of users from the same country using the same browser to access a page can be analyzed using the country and browser dimensions together. The search feature allows only relevant data to be shown based on a search value. The advanced filter can be used to shown more specific data, which is quite useful when trying to remove sets of data that are so small that they are insignificant. There are a few different view options for reports, which include data view - shows tables, percentage view - shows pie charts, performance view - shows bar graphs, and comparison view - to see how different values are doing against each other. Specific segments of the data table can be viewed on the main graph and compared using the Plot Row feature (Google Analytics, 2013).
To show how useful CSS can be, this blog post was actually made using HTML and CSS instead of Blogger's ready-to-go blog composer.
Resources:
codecademy. (n.d.) CSS: An Overview. [Online Lesson]. Retrieved from: https://www.codecademy.com/en/courses/web-beginner-en-TlhFi/0/1?curriculum_id=50579fb998b470000202dc8b
Girl Develop It. (n.d.) Intro to HTML/CSS. [Slides]. Retrieved from: http://girldevelopit.github.io/gdi-core-html-css/class2.html#/
Google Analytics. (2013, Oct. 31) Digital Analytics Fundamentals - Lesson 3.1 How Google Analytics Works. [Video file]. Retrieved from: https://www.youtube.com/watch?v=eyltEFyZ678
Google Analytics. (2013, Oct. 15) Digital Analytics Fundamentals - Lesson 5.1 Reporting overview. [Video file]. Retrieved from: https://www.youtube.com/watch?v=xyh8iG5mRIs
No comments:
Post a Comment