Initial commit

adelieco · Mar 1, 2017 · 8c65b90 · 8c65b90
commit 8c65b90
Show file tree

Hide file tree

Showing 4 changed files with 122 additions and 0 deletions.
diff --git a/GUIDE.md 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.<br/>
+**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. ;)
diff --git a/README.md 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!
diff --git a/index.html b/index.html
@@ -0,0 +1,15 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <style type="text/css" href="style.css"></style>
+  <title>Web Portfolio</title>
+</head>
+<body>
+  <div class="navbar"><div>
+  <div class="hero"></div>
+  <div class="about-me"><div>
+  <div class="projects"></div>
+  <div class="contact"></div>
+</body>
+</html>
diff --git a/style.css b/style.css
@@ -0,0 +1,25 @@
+/* Style.CSS*/
+/* This is where you can include your custom styles for your website.
+ * Try to keep it organized and well-structured. Feel free to 
+ * change around the default settings. (In fact, it's better to!)
+ */
+
+ .navbar {
+
+ }
+
+ .hero {
+
+ }
+
+ .about-me {
+
+ }
+
+ .projects {
+
+ }
+
+.contact {
+
+}