Assignment#1:Tutorial
Tutorial: More design, More Blueprint, More CSS (final)
Now that we got some initial experience with Blueprint let’s dive a bit more into it.
- First of all I would like you to subscribe to the Blueprint CSS mailing list where you can both ask some questions when you run into difficulties, learn from other people’s experience, and yes, one day also help others with their BP & CSS questions…
- Second, go back to your PSD file and make changes to it based on the feedback you got in class.
- Third, fix your css grid if it need any more fixing and go straight into all the details, styling all the graphic and typographic elements in the page including :hover states, images and all. Feel free to steal take inspiration on other html/css design you find online. Visit the html validator every now and then, and try to see what you can learn from it.
- Post at least once to the blog this week with a tip for the rest of us, some cleverway you found of doing something or even a problem you have that you want us to help you solve. Please post before Tuesday 11:59pm.
- Buy a domain name for yourself and a hosting space that supports PHP 4+5 and preferably also provides one-click install for Wordpress. You are welcomed to do your own research and compare your results on the blog and through our del.icio.us tag OSDP.
* Personally, I can recommend Dreamhost which (even though lately they’ve been pretty bad with downtimes) are still a good bang for your buck (they host most of my site, and I have yet not moved). Anyway, I have arranged a serious discount for you so if you register through this link and entering our promotion code:OSDor by mentioning my email as a referrer (disclaimer: it’s a win-win referrer program so I am benefiting from your discount too).
- The final links to your works should already be hosted on your own sites.
- If any of you have technical (or other) problems with this assignment, or want to consult me on anything, please email me.
(don’t wait for the last moment with it)
Tape Tutorial V.1.3
http://i.dream.cx/Tape/Tape.html
This is the grid. I was hoping that I could also include a third column with the leftover space that I have for comments and suggestions
Graphic Steps
spicy meatball design
so i am assuming we’re going to design this with css so i tried to keep it really simple since some of this stuff is way over my head. i’m also not sure the font will work for this, but i thought i’d try it for the initial design
apt. tutorial w/ css.
Here’s the grid I used to create my tutorial w/ Blueprint. I’d seen Blueprint before this class, but never dug through it enough to see what it was doing and how. The hardest thing to deal with (though it grew on me) is the fact that BP links to so many different stylesheets – at first it takes a minute to figure out where a particular element’s attributes live within the hierarchy. Anyway, grid image below and live page here.
Soccer Tutorial Youtube .
Sheila, Hope you find this video useful. It has a pretty detailed explanation of how to curl a soccer ball. It’s in Japanese but the video itself pretty much demonstrates how to kick a soccer ball with the maximum curve. ENJOY!
Cyrus’ Tutorial
I tried Cyrus’ tutorial, and it went well. The instructions were easy to follow, but I don’t think I did it right. I never played soccer before so I wasn’t very successful. Curling to the right was impossible for me, but it was more due to lack of skill rather than the instructions. The only thing that could help the tutorial would have been a visual to go along with it, preferably a video so you knew what it should look like. Otherwise, good job!
Tape Tutorial V.12 HTML
Made using only pure code on notepad. I despise dreamweaver and have only been previously trained to do all of these using notepad alone. I can’t wait to do CSS.. keeping to html code is torturous to the eye because its so ugly and redundant.
http://i.dream.cx/tapetutorial.html
I almost duplicated my written tutorial and the endless <p> tags are horrible as well… maybe I should have used <ul>
Happily celebrating Chinese new year! To anyone else that is chinese, huzzah!
Here are two links that could help you in understanding code simply.
http://www.htmlcodetutorial.com/
very simple explanations and easy to read through
http://www.htmldog.com/
in depth reading on the meanings of each code inside a site. very thorough.
Country Showdown
Video Clip: Country Showdown
Band: Caballo Dorado (Golden Horse)
Song: No Rompas Mas (my achy breaky heart)
Outfit: Cowboy boots and Hat
Performer: Lan
Response: I practiced many times before recording. This clip is the fourth one. Previous ones are even worse. I have to admit that the instruction is very detailed. It is all my fault, YES i can’t dance but i did wear a cowboy hat.
Most importantly, i enjoyed it very much though i am sick!!
thank GAMEZ!!!
my HTML of my tutorial Anti-Aging: How to Apply Lotion to Face
Yeeehhaaa!!!!
http://www.youtube.com/watch?v=MSnUeAVOW0E[/youtube]