3. 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.
4. 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.
5. LAB HOUR FRIDAY
This Friday, the 22nd: 4pm-7pm
(if coming, email alexa325@msu.edu 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.
6. 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.
7. 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).
8. 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?
9. 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.
10. 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.
11. 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.
12. 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.
13. Question 2
How do I fix my text formatting in HTML? It
looks all double-spaced and funky.
14. 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?
15. 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.
16. 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.
19. Question 4
How can I make textured backgrounds
and/or cool little watermarkish elements (I
don’t know what to call ‘em– swirlies?)
20. Answer 4:
And Ceiling Cat said “plz to be Photoshopz
brushes?” 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)
21.
22. 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).
25. 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.
27. 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.
28. Question 7
I need to know how my page will look on
other computers with smaller screens.
29. 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.
31. 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.
32. Question 9
Super merger of questions: Basically…
Okay, but can has Gallery? Will be teh l33t?
33. 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/
34. 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.
36. Answer 9:
Or if you like quirk…
• http://www.marcofolio.net/webdesign/creati
ng_a_polaroid_photo_viewer_with_css3_and
_jquery.html
• http://blog.tremaynechrist.co.uk/post/2011/0
4/17/Photofy-New-Animated-Photo-Swap-
Plugin-for-JQuery.aspx
• http://activetuts.s3.amazonaws.com/freebies/
003_pieceMaker/piecemaker/index.html
37. 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.
39. 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.
40. 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 Tumblr
to 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).
41. On Tuesday
We will also do course evaluations.
Then we’ll work.
Have a great weekend!
