WRA 210 April 21st PowerPoint
-
Upload
phill-alexander -
Category
Technology
-
view
424 -
download
1
Transcript of WRA 210 April 21st PowerPoint
TODAY
1) Checkin’ in
2) Lab(office) hours
3) Q&A
4) Homewerkz
5) Tweet me/Tumblr for you
CHECKING IN
Open Twitter right now.
I want you to post this sentence, filling in the blanks: “I am about __% finished with my final project for WRA 210, and I feel ____.”
Please don’t lie, but remember, it is a public act, so you can be ‘creative’ if you are embarrassed.
OFFICE HOURS
No one has ever come to my office hours
this semester. So I’m cancelling them this
week and next.
Instead, I will be in the lab here in 317 on
Friday, IF you want to come in. Please tell
me if you’re coming, because if you don’t
RSVP, I’m not going to come in.
LAB HOUR FRIDAY
This Friday, the 22nd: 4pm-7pm(if coming, email [email protected] right after class).
Next Friday, the 29th: 1pm-6pm (email me by Thursday at 1 pm)
This will be “whatever you need” time. Come work. Come ask questions. Whatever we need to do we will.
IF YOU NEED HELP
And Friday isn’t your thing, I can stay after
class today (for a while), next Tuesday, and
next Thursday.
Otherwise, you can ask me for an IM
conference, we can exchange emails, or we
can plan to meet in my office. The only
problem with meeting in my office is I have a
mac there and not a PC.
Q&A
I thought this went awesome last time (did
you? I hope? Please stop me if it sucked),
so I’m going to do it again. Here’s most of
what you asked in your Tumblr posts.
If your question was super specific to you, I
emailed you instead of putting the question
here (so as not to confuse other people).
Question 1
One thing I really want to be able to do is link material to be available for download. I know we went over how to use images as PDF links in class, but how does that ACTUALLY work? I understand that links are relative and all that jazz, but in order for downloadable links to happen (in view-only format so no one can nab my stuff or make changes), do I need to host my files elsewhere and link them to my portfolio through Dreamweaver? Or… what?
Answer 1:
There’s a little going there, so let’s pull it
apart. First, for links to access/DL PDFs, all
you have to do is link to them. If the person
has the Adobe Acrobat Reader plugin, the
PDF will display in-browser (they then have
a save icon). If they don’t have the reader
plugin or if their computer is otherwise
buggered, clicking the link will cause the file
to download.
Answer 1:
You can link to the PDFs anywhere online. I
would recommend just making a folder
inside your MSU web space called “PDF”
and sticking them there (logic– I try to name
my subfolders things I understand). I have a
phillalexander.com/pdf folder with no index
file. All my site PDFs are there.
Answer 1:
Now locking a PDF from editing… that can be a little tricky, depending on how worried you are/how persistent the other person is.
You can do some special “lock file” stuff in Acrobat Writer that you can’t in, say, MS Office, but honestly, between you and me, it’s overkill. A PDF is difficult to edit, and if someone is that dead set on stealing your stuff, they’ll copy/paste the text and figure out how to modify it. But it CAN be done. I can show you if you’d like.
Answer 1:
As for posting PDFs that people cannot
save– that’s not possible in PDF as it exists,
as the whole idea of PDF as a format is that
it can be moved around easily.
Question 2
How do I fix my text formatting in HTML? It looks all double-spaced and funky.
Answer 2:
Some formatting issues can’t be fixed (the problem of HTML– remember that “Unwebbable” article?), but the double spacing is because you need a SOFT return at the end of a line (hold shift when hitting enter). HTML treats hitting enter differently than most editors. It’s a weird thing, but you’ll get the hang of it fast.
Also, how funny is it that I typed “soft” in all caps?
Question 3
The most important thing for me: Getting
those Photoshop elements over to
Dreamweaver successfully. I know we did it
once but it’s a critical step so it will help out
again.
Answer 3:
This one is easy, but if you forget the few easy steps it becomes a nightmare, so here we go (I’ll show you again, too).
1) Make sure your background is transparent if you want it to be transparent on the web
2) Make sure you crop away any excess space
3) Save as a .png. It must be a .png or you will lose the transparency (you can do transparency with a .gif, but you lose a bunch of color info and it will look… nasty unless you worked in 256 on purpose)
4) If you don’t need transparency, you can save some space by saving things as .jpg. It compresses better without losing (much) quality.
Question 4
How can I make textured backgrounds
and/or cool little watermarkish elements (I
don’t know what to call ‘em– swirlies?)
Answer 4:
And Ceiling Cat said “plz to be Photoshopzbrushes?” and it was so, and it was good.
Let’s truck over to http://www.brusheezy.com/
And do some texture work. Here’s grunge texture I made really fast last night (see previous slides for why)
Answer 4:
Brushes make it easy to create texture, but
you can also find lots of sort of floral or
stylized element brushes that allow you to
make… I guess we’d call it “Frill” for a
website. Here’s a thing I made real fast with
a few brushes (see next slide).
This was 3 clicks
Question 5
Can I link to pages before they exist?
Answer 5:
Yes. You should pick names for everything that will be on your nav as you make the first page of the site (using the methods I’ve been teaching you) so you don’t need to update the nav later.
There are more sophisticated ways to do that, but at this point, we’ll keep it simple and clean. The pages don’t have to exist, though. You just need to put in names. Make sure you remember what you called them, though.
Question 6
How can I put an image behind some text?
Answer 6:
There are a few ways. The easiest is to make it the background of the div where the text is (you can set an image to be the background of just a div– I will show you this).
You can also put the image on the background of the page and make the background of the div very, very light (almost transparent) so that you can see through it.
You can layer divs, too, using the Z axis, but that gets a little buggy sometimes.
Question 7
I need to know how my page will look on
other computers with smaller screens.
Answer 7:
This is another easy way/hard way question.
If you want to know EXACTLY how it will look on certain sizes/devices, you need to go find one of those devices and look at it.
But you can change your resolution to see what it looks like at various sizes. Let me show you.
Question 8
Super merger of questions: Basically…
Can has slideshow?
Answer 8:
Yep. Let’s look at some links.
http://workshop.rs/projects/coin-slider/ o
http://css-tricks.com/creating-a-slick-auto-playing-featured-content-slider/
To use one of these, you just grab the code
and follow the directions.
Question 9
Super merger of questions: Basically…
Okay, but can has Gallery? Will be teh l33t?
Answer 9:
Oh yeah. There are a pair of ways you could
pimp your photo gallery. The first uses Flickr.
Check out these links:
http://www.kishnel.com/kishlery/ or http://code.google.com/p/flogr/
Answer 9:
The advantage of using Flickr is that you
don’t have to tinker with the backend to add
photos.
The disadvantage is that you’re using flickr,
so if you don’t like the service… that’s a
problem. So here are some freestanding
options.
Answer 9:
• http://www.gethifi.com/blog/jphotogrid o
• http://www.pirolab.it/pirobox/ or
• http://fancybox.net/
Answer 9:
Or if you like quirk…
• http://www.marcofolio.net/webdesign/creating_a_polaroid_photo_viewer_with_css3_and_jquery.html
• http://blog.tremaynechrist.co.uk/post/2011/04/17/Photofy-New-Animated-Photo-Swap-Plugin-for-JQuery.aspx
• http://activetuts.s3.amazonaws.com/freebies/003_pieceMaker/piecemaker/index.html
Answer 9:
You can find the directions to set any of that
stuff up with the individual options (most of
the directions look pretty solid), but I can
assist you if you find that it’s giving you
trouble.
Q&A
That concludes our Q&A for today.
Any follow-ups from what we just looked at?
Homework
Twitter question: what’d you learn today? What is still not clear based on today’s Q&A?
Tumblr (I’ll assign one so you have something to post on): Give me another status update– be specific about what you have done/what is left to do. Don’t be shy, I need to know where you are.
On Tuesday
We will look at your Mod Six work. We are going to just be done with Module Six now, unless someone NEEDS to get their Tumblrto look like their design for part of their final project.
You all did good work, but I didn’t get time to assign grades (we had a long faculty meeting Wednesday).
On Tuesday
We will also do course evaluations.
Then we’ll work.
Have a great weekend!