Difference between revisions of "Interns - Web Portfolios"
From Help Wiki
m (→Getting Geeky) |
m (→Suggested themes for portfolio sites:) |
||
| (10 intermediate revisions by 3 users not shown) | |||
| Line 1: | Line 1: | ||
__NOTOC__ | __NOTOC__ | ||
| − | |||
=== Why a build a personal website? === | === Why a build a personal website? === | ||
* stake out your personal space/name on the web | * stake out your personal space/name on the web | ||
| Line 6: | Line 5: | ||
====What to use to build a site?==== | ====What to use to build a site?==== | ||
| − | *What is [http://wordpress.org/ WordPress]? How is [http:// | + | *What is [http://wordpress.org/ WordPress]? How is [http://wordpress.evergreen.edu/ wordpress.evergreen.edu] different from [http://wordpress.com/ wordpress.com] different from [https://wordpress.org/ wordpress.org]? |
* Alternatives include [https://www.squarespace.com/ Squarespace], [https://www.tumblr.com/ Tumblr], [http://dropr.com/ dropr] and [http://www.wix.com/ Wix] | * Alternatives include [https://www.squarespace.com/ Squarespace], [https://www.tumblr.com/ Tumblr], [http://dropr.com/ dropr] and [http://www.wix.com/ Wix] | ||
===Multimedia and Fine Art portfolio examples: === | ===Multimedia and Fine Art portfolio examples: === | ||
* http://www.femmefatale.paris/en | * http://www.femmefatale.paris/en | ||
| − | |||
* http://y78.fr | * http://y78.fr | ||
| − | |||
* http://www.taubaauerbach.com/ | * http://www.taubaauerbach.com/ | ||
* http://rameyfilms.com/index.html (evergreen alumna) | * http://rameyfilms.com/index.html (evergreen alumna) | ||
* http://cathydelacruz.com/ ((evergreen alumna) | * http://cathydelacruz.com/ ((evergreen alumna) | ||
| + | * [http://www.youngjerks.com/ Young Jerks—Dan Cassaro and Dan Christofferson] | ||
| + | * [http://davidrudnick.org David Rudnick] | ||
| + | * [http://jenmussari.com/ Jen Mussari] (see also: [http://www.ghostlyferns.com/ Ghostly Ferns]) | ||
| + | * [http://www.debbiemillman.com/ Debbie Millman] | ||
=== Audio portfolio examples: === | === Audio portfolio examples: === | ||
| Line 25: | Line 26: | ||
===Create a WordPress Site at Evergreen=== | ===Create a WordPress Site at Evergreen=== | ||
| − | As an Evergreen student, you have access to create a site at '''http:// | + | As an Evergreen student, you have access to create a site at '''http://wordpress.evergreen.edu''' and get support. This is a great opportunity to explore the waters of creating your own website in preparation for managing your own after graduation. |
'''To get started check out the [[WordPress Tutorial]]''' | '''To get started check out the [[WordPress Tutorial]]''' | ||
| Line 32: | Line 33: | ||
Always make sure themes are responsive and will look good across all device sizes. | Always make sure themes are responsive and will look good across all device sizes. | ||
* Baskerville | * Baskerville | ||
| + | * Fukasawa | ||
* Hatch | * Hatch | ||
* Hemingway | * Hemingway | ||
| − | * | + | * Garfunkle |
| − | * | + | * Klean |
| − | * | + | * Lovecraft |
| − | * | + | * Snaps |
* Wilson | * Wilson | ||
| Line 55: | Line 57: | ||
* Protect your privacy. Use contact forms whenever possible so you don't have to reveal your email address or phone number. | * Protect your privacy. Use contact forms whenever possible so you don't have to reveal your email address or phone number. | ||
| + | ====Wireframe Activity==== | ||
| + | With the provided Post-it Notes, map out the skeletal framework of your site. | ||
| + | * Image your site on a mobile device | ||
| + | * How do viewers navigate your content? | ||
===What about after graduation?=== | ===What about after graduation?=== | ||
| Line 88: | Line 94: | ||
* consider coding your own site using [https://css-tricks.com/snippets/css/complete-guide-grid/ Grid] | * consider coding your own site using [https://css-tricks.com/snippets/css/complete-guide-grid/ Grid] | ||
** Resources for learning: [http://cssgridgarden.com/ CSS Grid Garden], [http://flexboxfroggy.com/ Flexbox Froggy] | ** Resources for learning: [http://cssgridgarden.com/ CSS Grid Garden], [http://flexboxfroggy.com/ Flexbox Froggy] | ||
| − | |||
| − | + | [[Category:2019-2020]] | |
| − | [[Category: | + | |
Latest revision as of 10:16, 15 January 2020
Why a build a personal website?
- stake out your personal space/name on the web
- a stable location you control to point your social media accounts to
What to use to build a site?
- What is WordPress? How is wordpress.evergreen.edu different from wordpress.com different from wordpress.org?
- Alternatives include Squarespace, Tumblr, dropr and Wix
Multimedia and Fine Art portfolio examples:
- http://www.femmefatale.paris/en
- http://y78.fr
- http://www.taubaauerbach.com/
- http://rameyfilms.com/index.html (evergreen alumna)
- http://cathydelacruz.com/ ((evergreen alumna)
- Young Jerks—Dan Cassaro and Dan Christofferson
- David Rudnick
- Jen Mussari (see also: Ghostly Ferns)
- Debbie Millman
Audio portfolio examples:
- http://brianbinningaudio.com/
- http://www.gameaudiogirl.com/
- http://zacharyquarles.com/blog/
- http://chloestamper.com/
Create a WordPress Site at Evergreen
As an Evergreen student, you have access to create a site at http://wordpress.evergreen.edu and get support. This is a great opportunity to explore the waters of creating your own website in preparation for managing your own after graduation.
To get started check out the WordPress Tutorial
Suggested themes for portfolio sites:
Always make sure themes are responsive and will look good across all device sizes.
- Baskerville
- Fukasawa
- Hatch
- Hemingway
- Garfunkle
- Klean
- Lovecraft
- Snaps
- Wilson
Embedding media
Tips for building your web site
- Design it with your intended audience always in mind.
- What are your goals for your site?
- Look at how other's in your field are organizing their sites. Are there elements you like/dislike? Are there patterns you see being used across multiple sites in your field?
- Is it easy to view your work? Find your relevant experience.
How will people contact/connect with you?
- Consider connecting with social media tools like Twitter, Facebook, LinkedIn or Instagram.
- Make sure you present a professional image; create social media accounts or pages for your professional persona separate from your personal accounts.
- Have you included a resume? make sure it be viewed in full on the site and then optionally downloaded as a PDF.
- Protect your privacy. Use contact forms whenever possible so you don't have to reveal your email address or phone number.
Wireframe Activity
With the provided Post-it Notes, map out the skeletal framework of your site.
- Image your site on a mobile device
- How do viewers navigate your content?
What about after graduation?
Getting your own website
Securing your own custom domain name
Every website has a unique web address. Best practices for choosing a custom domain name:
- short, descriptive, easily communicated, not easily confused with other websites
- first and last name .com
- domain registration happens via a domain registrar. Often times web hosts will also offer domain registration. Coupling domain registration and web hosting is the easiest way to manage as each will have to be renewed annually.
- What about some of the new TLDs like .name, .design
Web Hosting and Editing Platforms
Web hosts are the folks who host your website on their internet connected web servers. They can host simple html files but now, more often they additionally host web editing platforms such as WordPress, Wix or Squarespace. Before you commit to a web host:
- Create a trial account and make sure it feels easy to use and meets all of your site's requirements.
- Add up all of the recurring costs (domain + web hosting)
- some platforms are Open Source such as WordPress which means if you don't like your web host you can always move your code to another server
- some platforms are proprietary such as Squarespace - web sites built here will have limited export functionality
Get Found
Register your site with the major search engines
Getting your site found by the major search engines can take time. By manually registering it can speed up the process.
Is my site successful?
A great way to measure how many people visit your site is to set up a Google Analytics account. You'll then need to use a plugin or manually add the Google Analytics code into your site.
Getting Geeky
- learn html/css
- consider coding your own site using Grid
- Resources for learning: CSS Grid Garden, Flexbox Froggy
