Comparative Website Development

Overview

This is a cluster of assignments that involves you learning to develop a public-facing website in two different environments that are free to you to access. Your goal is develop a website containing the same content in two different development scenarios.

1. All of us will create a website using GitHub Pages, which involves you establishing a GitHub account working with a personal GitHub repository.
2. Depending on your familiarity with writing HTML and CSS, you may decide on one of the following options:
   • If you are new to coding and not familiar with HTML and CSS, or want to experiment with Wordpress you should set up a free PSU Wordpress site.
   • If you are are comfortable with HTML and CSS, you may choose to develop a website in Personal Web Hosting at Penn State. Note: This requires passing a quiz with the Penn State web hosting services, and also involves you working with file transfer using SFTP. (I can help you with this individually if you have HTML and CSS background and are interested in accessing this free hosting service.)

For the second option, this is your choice, and much of the development will be on your own. See if you can build a site sharing the same content on your GitHub Pages site and the Penn State site you choose. If you find yourself wanting the freedom to develop and style your site as you wish, working with HTML and CSS on the Personal Web Server is more challenging but will give you freedom. You don't have to learn to write HTML and CSS in our class, though. You can take courses like Comm 270, MIS 387, or DIGIT 110, 210, and 400 to learn more about HTML, CSS, and more intensive work in designing your own websites from code.

Portfolio Site Contents

Develop both websites to be the foundation of a public-facing professional portfolio of your work. The site you design for this DIGIT 100 class does not have to be the professional portfolio you will be ready to share with potential employers in your junior or senior years. But it should be a beginning, and something you can build on and return to during your time as a student.

With this assignment, you will try to post the same material on two different kinds of websites. The informational content (reading text and images you share) should be the same on both sites, but your choice of presentation and the way it looks on the web will be different between the two site development environments.

Sites should contain:

• Some representation of digital projects you would like to feature from any of your past or current coursework. Describe what you did and the coursework it was part of (identify the course and semester you took it), and provide a direct web link to the project if it is available. If not, provide as much information as you can and try to provide an image (perhaps a screenshot) featuring some interesting aspect of the project you worked on.
  • If you are just beginning digital work with our class, that is okay. Create a page or a section to represent DIGIT 100 and (for now) "Hypothesis Annotations". You can provide your own brief explanation of Annotation work on our course readings, and feature some of your most interesting Hypothes.is annotations as some digital project content for your site.
  • Be mindful of whether your work is entirely your own to share. You are responsible for requesting and securing permission from the appropriate parties who own copyright on material you worked on or featured, and following their instructions (such as a link and clear reference to the source site).
  • Descriptions of group projects must highlight your contributions to the project. Point out what you worked on, and feature it in some way.
• Somewhere on your site, introduce yourself professionally. Present a professional image of yourself (this may be abstract artwork, or a realistic digitized photograph), but it should not be something that would cause you embarrassment if potential employers visited your site.
• Prepare a résumé to share on your site, even if it is just a beginning on your résumé. Try to prepare this resume for web searching. Ideally this should be prepared as part of the website (in markdown or HTML) and not be posted PDF or Word form. Here is a helpful resource for Penn State Behrend students on what to include in a résumé.
  • The portfolio website (perhaps the résumé) should contain a list of computing technologies and skills you are learning.
• Content on both your portfolio websites needs to be organized in some clear way, perhaps to separate different kinds of projects and technologies applied. Provide some introduction to yourself on a main page, and guide your visitors to areas of your site to learn more about your work.
• Make sure you proofread and edit the content of your sites carefully. You will not have the benefit of spell-checking in web interfaces. You can try typing up content in a word processing program first to help you with editing, and then paste into your site. You should try reading your site contents to yourself out loud, watching and listening for errors to correct. Errors in writing and miscommunications can present an unflattering and less than professional image of you. Edit your work with care, and your visitors will perceive that you care about the quality of your work.

The site should contain a combination of images and texts, carefully laid out to represent you in a way that helps others to learn about work that matters to you.

When complete, post links to your two sites on Canvas at the appropriate assignment link.

Reflection on Two Different Approaches to Website Development

After you have prepared both of your site sand you are satisfied with their appearance and contents, and that both contain the same information, it is time to reflect on the development experience. Draft a short essay with a title (in heading tags) and in paragraphs, to appear as a page on both websites, in which you compare the experience of developing a site in GitHub Pages with the other website development environment that you chose. This web essay should try to describe in your experience what the most significant difference is between the two website development methods. For each, consider:

• What are the most significant challenges for a new learner?
• What advantages do you associate with one method over the other?
• What challenges are there for learning how to modify the layout and organization of each site?
• What skills are necessary to learn and develop these sites in either format?
• What skills do you think you want to learn to improve on this website?
• Include in this reflection page (on each site) a direct link to your alternate website.

When this portion of this assignment is complete, post links to it on Canvas at the appropriate assignment link.