Simple take – aways:
- Never leave a page “Untitled”
- Use Alt Text Behind Images
- Add Unique Descriptions using Meta Tags – including keywords
- Use Heading Tags
Simple take – aways:
Be sure to title your page!
Meta data = keywords and description: good for search engine optimization (SEO).
LYNDA: Chapter 8: (13 min)
From Adobe: Publish and Manage your Website
Really great tutorial: Publish your Website in Dreamweaver (with practice files)
Another good one: GoDaddy
Buying a domain name (one time fee) + Web Hosting (monthly fee)
One example: Godaddy.com
This page has some great hover effects that you can download : import CSS into Dreamweaver and source the code.
Great resource with good visual examples: CSS transitions and animations
Text overlay on hover
Today we are going to start our wire framing process as well as a lot of brainstorming for what you would like your responsive portfolio webpage to be.
Hopefully you feel a little more comfortable now that you have built a starter page in Dreamweaver. . . Remember, we are still learning !
Adobe (free) tutorials:
Excellent link on setting up your Responsive Layout
Here is what we are going to work towards with our Portfolio Responsive Web Page:
1. Extensive planning of mission, design and structure of your portfolio page
2. Wireframes built in Photoshop then imported into Dreamweaver
3. A fully responsive personal portfolio site ( to be viewed on mobile, tablet and desktop screens)
4. Personal logo and site with a unified color scheme and style
5. Experiment with Bootstrap and using Bootstrap Components (located in the Insert Panel)
6. Drop down menus to include at least 4 categories :
Portfolio (with a submenu of at least 3 mediums), About, Links to social media (could be Facebook, LinkedIn, etc.), Contact form, downloadable PDF resume
7. Rotating Bootstrap Carousel with quality images
8. Other possibilities: incorporating animation, video, etc. (open to your ideas!)
9. Do you want social media widgets, glyphicons, etc?
RESOURCE LINKS: SIMPLICITY is KEY
Boston Globe (EXCELLENT example of fluid grid layout)
Next week: What are media queries?
DUE DATE: Last class – Monday, April 29.