comp 1850 | web design and development one
- server-side includes
- php exercise
- web measurement and analytics
- life after comp 1850?
- project work
- a server function that allows for real-time echoing of information to the browser such as:
- file information
- conditional execution of documents
- How do they work?
- a series of characters (called tokens) are included in your HTML
- as page is processed by the HTTP server, any tokens are sent to the SSI engine
- the processed result is then either output as HTML, or some server side function is instantiated.
- your server must have the SSI module activated (there are SSI modules for almost every web server in existence)
- sometimes you may need to use a different extension on your HTML (usually SHTML) so that the server will understand that it needs to process embedded SSIs
- can be a powerful tool for web development:
- further lightens your code. A small SSI statement can take the place of a large, re-used codeblock
- this can save giant amounts of code footprint on your site!
- code changes made easy. If you have your navigation built into an SSI, you can make 1 change and all pages that subscribe to that SSI will change.
- execute script and applications within HTML. If you need to have live data on your site, you can write a mini-application that will execute each time you deliver a page. BCIT's navigation system runs on this.
- one of the most powerful types of server-side includes can take a chunk of your code and replace it with this:
- Download folder for week11 from bcitwebdev.com
- Using the notation above replace the navigation on all pages in the includes folder with a server-side include. Don't forget to rename the files (i.e., .shtml).
- Add a new item to the navigation bar to see how it appears on all pages (note: you don't have to create an actual page to see the link).
- Use server-side includes to replace the footer and/or header portion of the pages.
- more on ssi:
static vs. dynamic documents
- static documents can be created with markup languages and presentation rules:
- markup languages (HTML), enables the display of structured data in a textual form
- "tags" or "marks" indicate document elements
- used for structuring content:
- presentation rules can be applied using CSS
- dynamic documents require actions to be associated with events that may be initiated by the user:
- the opening of a web page
- hovering over an area
- submitting information via web forms
- the click of a button
- dynamic documents can change on-the-fly as various content sources change
- essentially, we are talking about the behaviour of a page, and how it changes based on user interaction
- behaviour can be altered using client-side scripting and/or server-side scripting
- server does all the processing of script
- does not matter which browser is being used
- can output a particular version of pages to cope with browser incompatibilities
- access to files and databases on server
- data sources do not need to be web accessible
- information can be accessed, retrieved, processed and stored through technologies such as databases and XML
- backend systems can be accessed to facilitate transactions and true interactivity
- can be written in a wide variety of languages:
- language chosen will depend on the server configuration
- common uses:
- password protection
- form processing
- dynamically building and displaying pages created from a database
- originally called "Personal Home Page" tools
- created by Rasmus Lerdorf, and released in June 1995
- now more commonly known as the "PHP Hypertext Preprocessor"
- you can configure your web server to identify HTTP requests that contain PHP
- interpreter processes the PHP Scripts, passes results back to Client
- whereas Perl is a standalone Scripting Language (i.e., separate Perl programs are created), PHP is a server-side scripting language that can be embedded right in your HTML
- syntax takes inspiration from several popular languages - bits of C, Java and Perl - and adds some unique PHP things for good measure
- "The goal of the language is to allow web developers to write dynamically generated pages quickly." (http://www.php.net/)
- it is easy to implement, easy to learn, and easy to use
- it runs on almost any web server on almost any platform currently available
- it is free
- PHP resources:
Luckily there are some great tools to help us visualize all this, and address any issues our visitors may be having.
Complete Beginner's Guide to Web Analytics and Measurement:
- Most websites have some set of goals or objectives in mind: sell stuff, educate, generate leads or prospects, provide support, etc.
- Now that you have a rudimentary understanding of how to build sites, you'll want to make sure that you are thinking about these goals and how to measure whether you are meeting them.
- Servers generate a great deal of data, and there are tools to help you understand what people are doing.
- In the early days people were only concerned with hits (how many requests are made to your server) - now we want to know:
- where people are coming from
- what search terms they used to find us
- what search terms they use on our site
- how long they stay on our site
- how quickly they leave
- what paths they're taking through our site
- whether our ad campaigns are working
- ...and so on
A crucial part of the web strategy toolbox; lots of opportunities for people who can understand the "how and why" of what people are doing on websites.
- what is it?
- who to follow (with links to their twitter accounts);
- tools of the trade;
- links to books.
set up a google analytics account
- Already have a Gmail account? Go here to set up a Google Analytics account.
- No Gmail account? Start here. Then move on to the link above.
- Once you've logged into Analytics, click on the Sign Up button in the Sign Up for Google Analytics box.
- Add the URL for your website (e.g., http://students.bcitwebdev.com/sharpener/) and complete the other required information.
- On the Analytics Tracking Instructions page select A Single Domain under What are you tracking? Then copy the tracking code in the textarea.
- Download your homepage from the student server and add the tracking code as instructed. Added it to all pages you want Google Analytics to track.
- Save the page and uplaod your page back to the server. Go back to the Analytics Tracking Instructions page and click Save and Finish.
- You'll be redirected to your account overview page. It will take a while for the tracking status to be confirmed, so in the meantime, review the article above or some of the course options below.
life after comp 1850?
- COMP 1950
- Official followup to COMP1850
- COMP 2015
- COMP 3015
- Introduction to PHP
- COMP 1630
- Relational database design and SQL
- COMP 1956
- Creating Web Graphics 1
- COMP 1011
- UX/UI Development
- COMP 2251
- Website Optimization with Google Analytics
- Web Technologies
- many of the above courses will lead you towards an Associate Certificate in Web Development or Web Application Software Development.