SlideShare uma empresa Scribd logo
1 de 41
TODAY Checking in again– one last try at explaining Module 6 #savagePhillure Call and Response Reminders Homework
Module 6 Okay, first… all that stuff I said last class. But two things I think are not communicating well: 1) The idea of Module 6 was for you to create a design (using CSS and HTML) then apply it to Tumblr 2) If we can’t get that far, that’s okay. The mock up is what matters
Module 6 We will try, that last week of class, to get your Mod 6 design to your Tumblr, but if you can’t, please don’t freak out. It’s not meant to be a colossal task. I am sorry it got so confusing. I take responsibility for that. *I* thought I was being clear, but I made PW mistake #1– I didn’t interrogate my audience well enough. It’s a teachable moment. :)
Call and Answer The next several slides will be your questions followed by my answers.They were great questions. Some of them will require doing some work in other windows, though, so be ready for me to alt-tab away.
I'm just wondering how I should start.
Very carefully.
I need to learn how to put (X)HTML and CSS files onto the internet using GoDaddy, ect. Do you have to alter file locations in da code?
Good question!  You don’t have to do anything special to the code, just remember that your links, when working in Dreamweaver, will be “relative.” So if everything is in one folder on your machine… it needs to be in one folder online.
I'm actually not sure about the best way to get out final sites up and accessible online...Should we be using our web folder? How?
That is the easiest way. To make a page live on the web using your MSU web space, all you have to do is copy it over to your “web” folder on the network.  You can host anywhere you’d like, though.
Two things to remember: Links are relative. So you need to move things so that they are in the same relative place on the server  If you have an index.html, you can link to the folder. If not, you must include the “x.html” with your links.
to begin, how to put active links on my site. … how to make it so when you click on a certain word it links to a different website …
how to make different pages of the same site in Dreamweaver, and how to connect them. … I want to be able to use images to link to PDF files on my portfolio website …
Links are actually deceptively easy. You just need to highlight what you want to link in DW then type the link address into the box (remember– relative!)
If you create your custom nav and the standard elements for your page first, you can create the sub-pages by saving the file as a new name. DW supports another way to do this, but switching machines when you use that method is sloppy, so we’re avoiding it.
You can link from any element– a picture, text, etc. If you link something that is not text, you will need to remove the border or you will have a link colored borderline.  Let me show you. (to the other window!)
Everything in Dreamweaver is a mystery, but a quick question would be "Whats the difference between the AP div and div tag?“ … Good question!
Everything in Dreamweaver is a mystery, but a quick question would be "Whats the difference between the AP div and div tag?“ … Good question!
That’s a question no one has ever asked me. An AP Div is “absolutely positioned,” which means you can put it wherever and it will stay there (it should, in DW, set coordinates for where it sits relative to the edges of the page).
Sometimes that doesn’t go quite right. Which sucks. But it happens. Particularly with fluid layouts.
A div, or a div tag, is just a div without the absolute positioning, which means if you don’t give it position properties… it’ll just sit where it is in your code. You may need these in some cases.
I've been having trouble incorporating what are essentially custom fonts. Typefaces that don't come standard with most machines.
There’s three ways to handle that (two I’d call bad and one I’d call good). You can offer the font for download (not such a good idea, particularly if it isn’t free)  you can embed the font (ditto)
The good way is to use Photoshop to make whatever pieces you need in that custom font. This means you probably won’t want large chunks of body-text in non-standard fonts. But that’s a best practice for design anyway.
In PS when you have an image w/a background but you just want the image, not the background stuff, how to cut out a clean image
The answer to this one depends on how perfect you need it to be and how difficult the image is to work with. Let me give two examples.
This one is easy money. The background is a solid color, so all you’d have to do is magic wand the background (set your tolerance so it gets all the white and no Spider-man), go to “select” and “select inverse” then hit ctrl+J to make a new layer. Turn the original layer off, and there will be transparency around Spider-man. Save him as a .png and you’re good to go.  This also applies to text elements. If you want transparency, you want .png (for detail) or .gif (for speed but less colors).
This one is a bit tougher. Notice that the background behind our webby friend is color and isn’t uniform. You can take a few different approaches here. One—which is not the best method but some people swear by– is to just grab ye old lasso tool and trace around Spidey. A second is to use the pen tool to trace an area around him. I’ll show you this in a second.  Any method that works for you is the right method.  Then there are these methods: http://blogs.sitepoint.com/masking-techniques-photoshop/
rollover text effects, layer text effects, how to really make my text shine...
The roll-over effect is done in Dreamweaver. The other elements are done in Photoshop. I’m going to show you how to make the following image in the other window.
http://www.phillalexander.com/quickie
And two of you asked:  I need help with drop down nav bars in Dreamweaver
This one is a little tougher to answer. I think Dreamweaver will animate one for you, but… those usually suck. You should find what you like online and then replicate it. Like so…
Go here: http://lwis.net/free-css-drop-down-menuwe’ll pick one to play with.
And that was all of your twitter questions.Remember, no class next Tuesday, the 19th but you should be working on your site and your Mod 6. Mod 6 mock-ups are due that day via email.
Also on the 19th, you should post the following response to your Tumblr:Describe one thing you are trying to do with your website that you haven’t been able to pull off. Be descriptive and specific.
On the 21st we will put Module 6 in the ground (six mod feet under) and talk through your Tumblr responses. If you need me before then, let me know via email, IM, phone, whatever.
Do NOT take a week off from working on your materials for class because we’re not meeting Tuesday. You will be deathly sorry. Remember your sites will be due in 3 weeks. TiCkTiCktIcKtIcKTiCkTiCk…

Mais conteúdo relacionado

Destaque (9)

Norway's movement
Norway's movementNorway's movement
Norway's movement
 
WRA 150 9/13
WRA 150 9/13WRA 150 9/13
WRA 150 9/13
 
First Visrhet of 2014
First Visrhet of 2014First Visrhet of 2014
First Visrhet of 2014
 
January 29th PowerPoint
January 29th PowerPointJanuary 29th PowerPoint
January 29th PowerPoint
 
WRA 150 Week 11 Hybrid Content
WRA 150 Week 11 Hybrid ContentWRA 150 Week 11 Hybrid Content
WRA 150 Week 11 Hybrid Content
 
Scavenger hunt
Scavenger huntScavenger hunt
Scavenger hunt
 
WRA 210 January 13, 2011
WRA 210 January 13, 2011WRA 210 January 13, 2011
WRA 210 January 13, 2011
 
WRA 150 Week 15 all-in-one
WRA 150 Week 15 all-in-oneWRA 150 Week 15 all-in-one
WRA 150 Week 15 all-in-one
 
WRA 150 Week 12 Conference Info
WRA 150 Week 12 Conference InfoWRA 150 Week 12 Conference Info
WRA 150 Week 12 Conference Info
 

Semelhante a WRA 210 April 14th PowerPoint

Visual Rhetoric, Monday March 10, 2014
Visual Rhetoric, Monday March 10, 2014Visual Rhetoric, Monday March 10, 2014
Visual Rhetoric, Monday March 10, 2014Miami University
 
Visual Rhetoric March 25th
Visual Rhetoric March 25thVisual Rhetoric March 25th
Visual Rhetoric March 25thMiami University
 
A Beginner's Guide to Popping the Bonnet and Getting Your Hands Dirty
A Beginner's Guide to Popping the Bonnet and Getting Your Hands DirtyA Beginner's Guide to Popping the Bonnet and Getting Your Hands Dirty
A Beginner's Guide to Popping the Bonnet and Getting Your Hands DirtyKenneth Scott Huntley
 
Intro to Drupal Slides - DrupalCampSC 2014
Intro to Drupal Slides - DrupalCampSC 2014Intro to Drupal Slides - DrupalCampSC 2014
Intro to Drupal Slides - DrupalCampSC 2014Sarah Shealy
 
On Selecting JavaScript Frameworks (Women Who Code 10/15)
On Selecting JavaScript Frameworks (Women Who Code 10/15)On Selecting JavaScript Frameworks (Women Who Code 10/15)
On Selecting JavaScript Frameworks (Women Who Code 10/15)Zoe Landon
 
Visual Rhetoric, October 23rd, 2013
Visual Rhetoric, October 23rd, 2013Visual Rhetoric, October 23rd, 2013
Visual Rhetoric, October 23rd, 2013Miami University
 
7 crazy tips that will help you
7 crazy tips that will help you7 crazy tips that will help you
7 crazy tips that will help youJessica Wilson
 
Visual Rhetoric, Feb 5th, 2014
Visual Rhetoric, Feb 5th, 2014Visual Rhetoric, Feb 5th, 2014
Visual Rhetoric, Feb 5th, 2014Miami University
 
Going native with html5 web components
Going native with html5 web componentsGoing native with html5 web components
Going native with html5 web componentsJames York
 
Keeping Eloquent Eloquent
Keeping Eloquent EloquentKeeping Eloquent Eloquent
Keeping Eloquent EloquentColin DeCarlo
 
Ten tips for creating slides
Ten tips for creating slidesTen tips for creating slides
Ten tips for creating slidesTola Odugbesan
 
"Designing the Obvious" at WordCamp
"Designing the Obvious" at WordCamp"Designing the Obvious" at WordCamp
"Designing the Obvious" at WordCamprhoekmanjr
 
The best way to learn java script
The best way to learn java scriptThe best way to learn java script
The best way to learn java scriptWei Sun
 
Build your website before you install wordpress.
Build your website before you install wordpress.Build your website before you install wordpress.
Build your website before you install wordpress.Russell Aaron
 
Digital Graphics Pro Forma
Digital Graphics Pro FormaDigital Graphics Pro Forma
Digital Graphics Pro FormaCraig Cassidy
 

Semelhante a WRA 210 April 14th PowerPoint (20)

Wireframing
WireframingWireframing
Wireframing
 
Visual Rhetoric, Monday March 10, 2014
Visual Rhetoric, Monday March 10, 2014Visual Rhetoric, Monday March 10, 2014
Visual Rhetoric, Monday March 10, 2014
 
WRA 210 January 18, 2011
WRA 210 January 18, 2011WRA 210 January 18, 2011
WRA 210 January 18, 2011
 
Visual Rhetoric March 25th
Visual Rhetoric March 25thVisual Rhetoric March 25th
Visual Rhetoric March 25th
 
A Beginner's Guide to Popping the Bonnet and Getting Your Hands Dirty
A Beginner's Guide to Popping the Bonnet and Getting Your Hands DirtyA Beginner's Guide to Popping the Bonnet and Getting Your Hands Dirty
A Beginner's Guide to Popping the Bonnet and Getting Your Hands Dirty
 
Intro to Drupal Slides - DrupalCampSC 2014
Intro to Drupal Slides - DrupalCampSC 2014Intro to Drupal Slides - DrupalCampSC 2014
Intro to Drupal Slides - DrupalCampSC 2014
 
On Selecting JavaScript Frameworks (Women Who Code 10/15)
On Selecting JavaScript Frameworks (Women Who Code 10/15)On Selecting JavaScript Frameworks (Women Who Code 10/15)
On Selecting JavaScript Frameworks (Women Who Code 10/15)
 
Visual Rhetoric, October 23rd, 2013
Visual Rhetoric, October 23rd, 2013Visual Rhetoric, October 23rd, 2013
Visual Rhetoric, October 23rd, 2013
 
7 crazy tips that will help you
7 crazy tips that will help you7 crazy tips that will help you
7 crazy tips that will help you
 
Visual Rhetoric, Feb 5th, 2014
Visual Rhetoric, Feb 5th, 2014Visual Rhetoric, Feb 5th, 2014
Visual Rhetoric, Feb 5th, 2014
 
Going native with html5 web components
Going native with html5 web componentsGoing native with html5 web components
Going native with html5 web components
 
Photoshop by Shannon
Photoshop by ShannonPhotoshop by Shannon
Photoshop by Shannon
 
Keeping Eloquent Eloquent
Keeping Eloquent EloquentKeeping Eloquent Eloquent
Keeping Eloquent Eloquent
 
WRA 210 March 24, 2011
WRA 210 March 24, 2011WRA 210 March 24, 2011
WRA 210 March 24, 2011
 
Ten tips for creating slides
Ten tips for creating slidesTen tips for creating slides
Ten tips for creating slides
 
"Designing the Obvious" at WordCamp
"Designing the Obvious" at WordCamp"Designing the Obvious" at WordCamp
"Designing the Obvious" at WordCamp
 
The best way to learn java script
The best way to learn java scriptThe best way to learn java script
The best way to learn java script
 
Build your website before you install wordpress.
Build your website before you install wordpress.Build your website before you install wordpress.
Build your website before you install wordpress.
 
WRA 210 March 17th, 2011
WRA 210 March 17th, 2011WRA 210 March 17th, 2011
WRA 210 March 17th, 2011
 
Digital Graphics Pro Forma
Digital Graphics Pro FormaDigital Graphics Pro Forma
Digital Graphics Pro Forma
 

Mais de Miami University (20)

At nasty
At nastyAt nasty
At nasty
 
Crap
CrapCrap
Crap
 
Rhetanal
RhetanalRhetanal
Rhetanal
 
Visual Rhetoric 4
Visual Rhetoric 4Visual Rhetoric 4
Visual Rhetoric 4
 
Visual Rhetoric 3
Visual Rhetoric 3Visual Rhetoric 3
Visual Rhetoric 3
 
Capstone Day 3
Capstone Day 3Capstone Day 3
Capstone Day 3
 
Capstone Day 4
Capstone Day 4Capstone Day 4
Capstone Day 4
 
Capstone Day 2
Capstone Day 2Capstone Day 2
Capstone Day 2
 
Capstone Day 1
Capstone Day 1Capstone Day 1
Capstone Day 1
 
Visual Rhetoric 2
Visual Rhetoric 2Visual Rhetoric 2
Visual Rhetoric 2
 
Visual Rhetoric 1
Visual Rhetoric 1Visual Rhetoric 1
Visual Rhetoric 1
 
224 summerfinal
224 summerfinal224 summerfinal
224 summerfinal
 
Dr philleval211
Dr philleval211Dr philleval211
Dr philleval211
 
211 finalreview
211 finalreview211 finalreview
211 finalreview
 
Week 2
Week 2Week 2
Week 2
 
Brief Video Game History
Brief Video Game HistoryBrief Video Game History
Brief Video Game History
 
Dungeons & Dragons history
Dungeons & Dragons historyDungeons & Dragons history
Dungeons & Dragons history
 
Rhetoric of Advertising
Rhetoric of AdvertisingRhetoric of Advertising
Rhetoric of Advertising
 
Logos
LogosLogos
Logos
 
411 Personal Logo PowerPoint
411 Personal Logo PowerPoint411 Personal Logo PowerPoint
411 Personal Logo PowerPoint
 

Último

2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...Martijn de Jong
 
GenCyber Cyber Security Day Presentation
GenCyber Cyber Security Day PresentationGenCyber Cyber Security Day Presentation
GenCyber Cyber Security Day PresentationMichael W. Hawkins
 
Partners Life - Insurer Innovation Award 2024
Partners Life - Insurer Innovation Award 2024Partners Life - Insurer Innovation Award 2024
Partners Life - Insurer Innovation Award 2024The Digital Insurer
 
Advantages of Hiring UIUX Design Service Providers for Your Business
Advantages of Hiring UIUX Design Service Providers for Your BusinessAdvantages of Hiring UIUX Design Service Providers for Your Business
Advantages of Hiring UIUX Design Service Providers for Your BusinessPixlogix Infotech
 
Axa Assurance Maroc - Insurer Innovation Award 2024
Axa Assurance Maroc - Insurer Innovation Award 2024Axa Assurance Maroc - Insurer Innovation Award 2024
Axa Assurance Maroc - Insurer Innovation Award 2024The Digital Insurer
 
Tech Trends Report 2024 Future Today Institute.pdf
Tech Trends Report 2024 Future Today Institute.pdfTech Trends Report 2024 Future Today Institute.pdf
Tech Trends Report 2024 Future Today Institute.pdfhans926745
 
A Domino Admins Adventures (Engage 2024)
A Domino Admins Adventures (Engage 2024)A Domino Admins Adventures (Engage 2024)
A Domino Admins Adventures (Engage 2024)Gabriella Davis
 
Boost PC performance: How more available memory can improve productivity
Boost PC performance: How more available memory can improve productivityBoost PC performance: How more available memory can improve productivity
Boost PC performance: How more available memory can improve productivityPrincipled Technologies
 
Artificial Intelligence: Facts and Myths
Artificial Intelligence: Facts and MythsArtificial Intelligence: Facts and Myths
Artificial Intelligence: Facts and MythsJoaquim Jorge
 
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...DianaGray10
 
Finology Group – Insurtech Innovation Award 2024
Finology Group – Insurtech Innovation Award 2024Finology Group – Insurtech Innovation Award 2024
Finology Group – Insurtech Innovation Award 2024The Digital Insurer
 
Data Cloud, More than a CDP by Matt Robison
Data Cloud, More than a CDP by Matt RobisonData Cloud, More than a CDP by Matt Robison
Data Cloud, More than a CDP by Matt RobisonAnna Loughnan Colquhoun
 
How to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerHow to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerThousandEyes
 
Automating Google Workspace (GWS) & more with Apps Script
Automating Google Workspace (GWS) & more with Apps ScriptAutomating Google Workspace (GWS) & more with Apps Script
Automating Google Workspace (GWS) & more with Apps Scriptwesley chun
 
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...Drew Madelung
 
AWS Community Day CPH - Three problems of Terraform
AWS Community Day CPH - Three problems of TerraformAWS Community Day CPH - Three problems of Terraform
AWS Community Day CPH - Three problems of TerraformAndrey Devyatkin
 
From Event to Action: Accelerate Your Decision Making with Real-Time Automation
From Event to Action: Accelerate Your Decision Making with Real-Time AutomationFrom Event to Action: Accelerate Your Decision Making with Real-Time Automation
From Event to Action: Accelerate Your Decision Making with Real-Time AutomationSafe Software
 
TrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
TrustArc Webinar - Unlock the Power of AI-Driven Data DiscoveryTrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
TrustArc Webinar - Unlock the Power of AI-Driven Data DiscoveryTrustArc
 
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
04-2024-HHUG-Sales-and-Marketing-Alignment.pptxHampshireHUG
 

Último (20)

2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...
 
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
 
GenCyber Cyber Security Day Presentation
GenCyber Cyber Security Day PresentationGenCyber Cyber Security Day Presentation
GenCyber Cyber Security Day Presentation
 
Partners Life - Insurer Innovation Award 2024
Partners Life - Insurer Innovation Award 2024Partners Life - Insurer Innovation Award 2024
Partners Life - Insurer Innovation Award 2024
 
Advantages of Hiring UIUX Design Service Providers for Your Business
Advantages of Hiring UIUX Design Service Providers for Your BusinessAdvantages of Hiring UIUX Design Service Providers for Your Business
Advantages of Hiring UIUX Design Service Providers for Your Business
 
Axa Assurance Maroc - Insurer Innovation Award 2024
Axa Assurance Maroc - Insurer Innovation Award 2024Axa Assurance Maroc - Insurer Innovation Award 2024
Axa Assurance Maroc - Insurer Innovation Award 2024
 
Tech Trends Report 2024 Future Today Institute.pdf
Tech Trends Report 2024 Future Today Institute.pdfTech Trends Report 2024 Future Today Institute.pdf
Tech Trends Report 2024 Future Today Institute.pdf
 
A Domino Admins Adventures (Engage 2024)
A Domino Admins Adventures (Engage 2024)A Domino Admins Adventures (Engage 2024)
A Domino Admins Adventures (Engage 2024)
 
Boost PC performance: How more available memory can improve productivity
Boost PC performance: How more available memory can improve productivityBoost PC performance: How more available memory can improve productivity
Boost PC performance: How more available memory can improve productivity
 
Artificial Intelligence: Facts and Myths
Artificial Intelligence: Facts and MythsArtificial Intelligence: Facts and Myths
Artificial Intelligence: Facts and Myths
 
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
 
Finology Group – Insurtech Innovation Award 2024
Finology Group – Insurtech Innovation Award 2024Finology Group – Insurtech Innovation Award 2024
Finology Group – Insurtech Innovation Award 2024
 
Data Cloud, More than a CDP by Matt Robison
Data Cloud, More than a CDP by Matt RobisonData Cloud, More than a CDP by Matt Robison
Data Cloud, More than a CDP by Matt Robison
 
How to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerHow to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected Worker
 
Automating Google Workspace (GWS) & more with Apps Script
Automating Google Workspace (GWS) & more with Apps ScriptAutomating Google Workspace (GWS) & more with Apps Script
Automating Google Workspace (GWS) & more with Apps Script
 
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...
 
AWS Community Day CPH - Three problems of Terraform
AWS Community Day CPH - Three problems of TerraformAWS Community Day CPH - Three problems of Terraform
AWS Community Day CPH - Three problems of Terraform
 
From Event to Action: Accelerate Your Decision Making with Real-Time Automation
From Event to Action: Accelerate Your Decision Making with Real-Time AutomationFrom Event to Action: Accelerate Your Decision Making with Real-Time Automation
From Event to Action: Accelerate Your Decision Making with Real-Time Automation
 
TrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
TrustArc Webinar - Unlock the Power of AI-Driven Data DiscoveryTrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
TrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
 
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
 

WRA 210 April 14th PowerPoint

  • 1.
  • 2. TODAY Checking in again– one last try at explaining Module 6 #savagePhillure Call and Response Reminders Homework
  • 3.
  • 4. Module 6 Okay, first… all that stuff I said last class. But two things I think are not communicating well: 1) The idea of Module 6 was for you to create a design (using CSS and HTML) then apply it to Tumblr 2) If we can’t get that far, that’s okay. The mock up is what matters
  • 5. Module 6 We will try, that last week of class, to get your Mod 6 design to your Tumblr, but if you can’t, please don’t freak out. It’s not meant to be a colossal task. I am sorry it got so confusing. I take responsibility for that. *I* thought I was being clear, but I made PW mistake #1– I didn’t interrogate my audience well enough. It’s a teachable moment. :)
  • 6.
  • 7. Call and Answer The next several slides will be your questions followed by my answers.They were great questions. Some of them will require doing some work in other windows, though, so be ready for me to alt-tab away.
  • 8. I'm just wondering how I should start.
  • 10. I need to learn how to put (X)HTML and CSS files onto the internet using GoDaddy, ect. Do you have to alter file locations in da code?
  • 11. Good question! You don’t have to do anything special to the code, just remember that your links, when working in Dreamweaver, will be “relative.” So if everything is in one folder on your machine… it needs to be in one folder online.
  • 12. I'm actually not sure about the best way to get out final sites up and accessible online...Should we be using our web folder? How?
  • 13. That is the easiest way. To make a page live on the web using your MSU web space, all you have to do is copy it over to your “web” folder on the network. You can host anywhere you’d like, though.
  • 14. Two things to remember: Links are relative. So you need to move things so that they are in the same relative place on the server If you have an index.html, you can link to the folder. If not, you must include the “x.html” with your links.
  • 15. to begin, how to put active links on my site. … how to make it so when you click on a certain word it links to a different website …
  • 16. how to make different pages of the same site in Dreamweaver, and how to connect them. … I want to be able to use images to link to PDF files on my portfolio website …
  • 17. Links are actually deceptively easy. You just need to highlight what you want to link in DW then type the link address into the box (remember– relative!)
  • 18. If you create your custom nav and the standard elements for your page first, you can create the sub-pages by saving the file as a new name. DW supports another way to do this, but switching machines when you use that method is sloppy, so we’re avoiding it.
  • 19. You can link from any element– a picture, text, etc. If you link something that is not text, you will need to remove the border or you will have a link colored borderline. Let me show you. (to the other window!)
  • 20. Everything in Dreamweaver is a mystery, but a quick question would be "Whats the difference between the AP div and div tag?“ … Good question!
  • 21. Everything in Dreamweaver is a mystery, but a quick question would be "Whats the difference between the AP div and div tag?“ … Good question!
  • 22. That’s a question no one has ever asked me. An AP Div is “absolutely positioned,” which means you can put it wherever and it will stay there (it should, in DW, set coordinates for where it sits relative to the edges of the page).
  • 23. Sometimes that doesn’t go quite right. Which sucks. But it happens. Particularly with fluid layouts.
  • 24. A div, or a div tag, is just a div without the absolute positioning, which means if you don’t give it position properties… it’ll just sit where it is in your code. You may need these in some cases.
  • 25. I've been having trouble incorporating what are essentially custom fonts. Typefaces that don't come standard with most machines.
  • 26. There’s three ways to handle that (two I’d call bad and one I’d call good). You can offer the font for download (not such a good idea, particularly if it isn’t free) you can embed the font (ditto)
  • 27. The good way is to use Photoshop to make whatever pieces you need in that custom font. This means you probably won’t want large chunks of body-text in non-standard fonts. But that’s a best practice for design anyway.
  • 28. In PS when you have an image w/a background but you just want the image, not the background stuff, how to cut out a clean image
  • 29. The answer to this one depends on how perfect you need it to be and how difficult the image is to work with. Let me give two examples.
  • 30. This one is easy money. The background is a solid color, so all you’d have to do is magic wand the background (set your tolerance so it gets all the white and no Spider-man), go to “select” and “select inverse” then hit ctrl+J to make a new layer. Turn the original layer off, and there will be transparency around Spider-man. Save him as a .png and you’re good to go. This also applies to text elements. If you want transparency, you want .png (for detail) or .gif (for speed but less colors).
  • 31. This one is a bit tougher. Notice that the background behind our webby friend is color and isn’t uniform. You can take a few different approaches here. One—which is not the best method but some people swear by– is to just grab ye old lasso tool and trace around Spidey. A second is to use the pen tool to trace an area around him. I’ll show you this in a second. Any method that works for you is the right method. Then there are these methods: http://blogs.sitepoint.com/masking-techniques-photoshop/
  • 32. rollover text effects, layer text effects, how to really make my text shine...
  • 33. The roll-over effect is done in Dreamweaver. The other elements are done in Photoshop. I’m going to show you how to make the following image in the other window.
  • 35. And two of you asked: I need help with drop down nav bars in Dreamweaver
  • 36. This one is a little tougher to answer. I think Dreamweaver will animate one for you, but… those usually suck. You should find what you like online and then replicate it. Like so…
  • 38. And that was all of your twitter questions.Remember, no class next Tuesday, the 19th but you should be working on your site and your Mod 6. Mod 6 mock-ups are due that day via email.
  • 39. Also on the 19th, you should post the following response to your Tumblr:Describe one thing you are trying to do with your website that you haven’t been able to pull off. Be descriptive and specific.
  • 40. On the 21st we will put Module 6 in the ground (six mod feet under) and talk through your Tumblr responses. If you need me before then, let me know via email, IM, phone, whatever.
  • 41. Do NOT take a week off from working on your materials for class because we’re not meeting Tuesday. You will be deathly sorry. Remember your sites will be due in 3 weeks. TiCkTiCktIcKtIcKTiCkTiCk…