From 8c65b90523c023fb628421927292f2d248d9d1ed Mon Sep 17 00:00:00 2001 From: Kevin Oh Date: Tue, 28 Feb 2017 23:20:00 -0500 Subject: [PATCH] Initial commit --- GUIDE.md | 71 ++++++++++++++++++++++++++++++++++++++++++++++++++++++ README.md | 11 +++++++++ index.html | 15 ++++++++++++ style.css | 25 +++++++++++++++++++ 4 files changed, 122 insertions(+) create mode 100644 GUIDE.md create mode 100644 README.md create mode 100644 index.html create mode 100644 style.css diff --git a/GUIDE.md b/GUIDE.md new file mode 100644 index 0000000..6fe4041 --- /dev/null +++ b/GUIDE.md @@ -0,0 +1,71 @@ +Web Portfolio: Guide +--- + +Read this quick guide for tips, brainstorming prompts, etc. + +Refer to the [Project One Prompt](http://notes.adelie.co/s/rJNJFoc_e) for specifics. + +Feel free to write in this file and mess it up - that's why it's here! + +## First, the concrete stuff. + +`index.html` will be your home page HTML file. Write your HTML there. +`style.css` is your main CSS stylesheet. Write your CSS there. +`assets` is a blank folder for your assets, such as images or fonts you may wish to include. Put your assets here, and figure out how to link them. + +That's all! Use the Project Prompt and the rest of this guide for tips with the project! + +--- + +## Developing Content +Content comes in the form of text, audio, video, and photos. However, text will always be your weapon-of-choice on the web. Refer to the Project Prompt and think about what kind of text you'll need to produce. + +**TIP**: For images, it's optional, but a nice photo of yourself goes a long way.
+**TIP**: Audio and video are usually not necessary for these kinds of sites. + +## Building a Personal Brand` +Branding is an entire subject on its own, but for now, let's keep it very simple. + +What mood are you going for with your site? How are you trying to represent yourself, and to what audience? +- feminine, masculine, neutral? +- casual, serious? +- verbose, terse? +- informal, formal? +- nontechnical, technical? +- colorful, monotone? + +**TIP**: For a web portfolio, our audience is generally going to be the same: potential employers, professional connections, and coworkers. Keep this in mind as you proceed. + +## Using Photos Well + +A picture is worth a thousand words. Use photos to add personality and color to your site. + +There are tons of free image repositories available online. Peruse some of them to find great images for your site. Or, if your phone is capable, try snapping a beautiful photo yourself! + +[Here's one.](https://unsplash.com/) + +[Here's where you can find more.](http://google.com) Hehe. + +[If you take your own photo, you can host it here](http://imgur.com). + +**TIP**: Using too many photos as part of your main layout is a beginner mistake. Use it in moderation. + +## Fonts are like accents but for text. + +[Google Webfonts](https://fonts.google.com/) is an insanely popular choice for getting free, web-optimized fonts. They have a beautiful selection! + +**TIP**: One font for paragraphs, one font for headings. Maybe one more for special purposes. That's it. If you feel the urge to spice up your design with more fonts, it's an indication that your design is lacking elsewhere. + +## Don't Be Afraid To Copy + +There is this idea that copying other websites is somehow creatively dishonest. This is only true if you copy it exactly and claim that it's your work. Don't be afraid to draw inspiration from tons of sources, whether its other sites, business cards, billboards, anything! After all: + +> Good artists copy, great artists steal. - Pablo Picasso + +## Ask and ye shall receive! + +We can't help you if you don't ask for it. Do your best to read manuals, scour documentation, and google the crap out of things, but if you can't solve it on your own - ask. + +--- + +Like all documents in this group, this document is work in progress. Please give feedback to Kevin if you think it can be improved or fixed in some way. ;) \ No newline at end of file diff --git a/README.md b/README.md new file mode 100644 index 0000000..3404a14 --- /dev/null +++ b/README.md @@ -0,0 +1,11 @@ +Web Portfolio Project Template +=== + +This repository contains a project template for **Project One**. + +Currently, we are on **Milestone One**: `No Place Like Home`. + +1. Download the repository. +2. Open up `GUIDE.md` in Atom, or Sublime Text. +3. Fill it out, brainstorm. (Remember, it's just a guide!) +4. Get to work! \ No newline at end of file diff --git a/index.html b/index.html new file mode 100644 index 0000000..6bed78b --- /dev/null +++ b/index.html @@ -0,0 +1,15 @@ + + + + + + Web Portfolio + + +