blogluck1
TRANSCRIPT
Stanford BlogLuckBites ‘n’ Bytes
Intro to the Web
1Monday, September 21, 2009
Topics- Intro to the Web, Intro to Wordpress, and a word on Edublogs.
The Web as it WASHTML: Hyper Text Markup language
The language that your web browser can speak.
2Monday, September 21, 2009
This is an example of the web as we may have learned about it in High School HTML Class. The down side was that everythign was coded by hand, and each element (say, a headline with the word “News”) had to be styled individually. This took forever, and everything was stagnant.
The Web TodayCSS: Cascading Style SheetsPHP: Hypertext Processor
SQL (Sequel): Manages the “stuff”
They work together (with others).
3Monday, September 21, 2009
This is an abridged list, but for beginners purposes, its a good place to start. These things make the web DYNAMIC, and allow all the cool stuff we love about the beb today.
CSSHow your stuff looks
4Monday, September 21, 2009
Think of CSS as the designer’s swatchbook. CSS establishes what your site looks like. You set up “Classes” of objects, and assign them a set of attributes. Then, instead of styling each element by hand, you just make it part of that class and it gets ALL the attributes (atributes like size, color, font, ect.)
SQL (Sequel)Where your stuff lives.
5Monday, September 21, 2009
SQL is your filing cabinet online. It stores the data of your website or blog (data like posts, pictures, tags, videos ect.)
PHPThe HTML Machine
+
6Monday, September 21, 2009
PHP is a programming language, but its a one-trick-pony. It only knows how to write HTML. It goes and gets stuff from SQL, grabs the appropriate CSS and then combins them to print the proper HTML.
How it works...
7Monday, September 21, 2009
PHP
SQL
CSS
HTML(What you see)
8Monday, September 21, 2009
Extra Terms
HTTPFront-endBack-endUI (GUI)
WYSIWYGadmin
permissionsFlash
JavaScriptweb 2.0
9Monday, September 21, 2009
HTTP: Hyper Text Transfer ProtocolFront End: the user/visitor side of a siteBack-end: the andinistration side of a siteUI(GUI)- User Interface, or Graphical User Interface (pronounced gooey)WYSIWYG- (pronounced wizzywig) means What You See Is What You Get, it is a visual kind of website editor that allows you to see what the finished product will look like, rather than the “code”Admin- a website administratorPermissions- varied levels of administrative accessFlash- Kind of dynamic content written in its own language- bad for search engines, sometimes cool lookingJavaScript- web language that runs certain kinds of web stuffweb 2.0- web protocol that enables certain new levels of interactivity (think google maps)
So, thats a lot of Shit.
10Monday, September 21, 2009
CMSContent Management System
11Monday, September 21, 2009
Wordpress is our CMS of choice
PHP
SQL
CSS
HTML(What you see)
12Monday, September 21, 2009
PHPSQLCSS
13Monday, September 21, 2009
wordpress translates commands you give it into the correct actions for CSS, SQL and PHP so that it all “just works”
14Monday, September 21, 2009
Wordpress manipulates the code so that it is changeable by a pretty and intuitive panel called “the dashboard”
In the Wordpress World
Your Stuff lives in SQL
But its CALLED: Posts, Media, Links, Pages ect.
15Monday, September 21, 2009
In the Wordpress World
Your have a CSS Swatchbook
But its CALLED:
Your Theme.
16Monday, September 21, 2009
World of Wordpress17Monday, September 21, 2009
3 Flavors
wordpress.com
wordpress MU
wordpress.org
18Monday, September 21, 2009
Wordpress.com“Instant Blog”
wordpress.ilovekittens.com
19Monday, September 21, 2009
this is similar to blogger ect. you just sign up and your blog is all ready.
Wordpress MUAdministrate several of blogs, make
them cohesive.
(e.g. WSJ properties)
20Monday, September 21, 2009
This is for organizations that want several blogs but want to display data and posts from them all on one main page.
Wordpress.org100% Delicious
As simple as you want.
ilovekittens.com
21Monday, September 21, 2009
this is designed for an individual user to make use of the power and ease of Wordpress CMS, but be able to make as many changes/customizations as their skills allow. I can be as simple as wordpress.com, or as complicated as you can imagine.
Edublogshsblogs.stanford.edu/yourname/
- flexibility for the users+ admin rights for Comm Staff.
22Monday, September 21, 2009
lots more on this later... short story, we, as J students, will have to use these too.
Wordpress.orgIts cool because its not just a knife...
Its Expandable.
23Monday, September 21, 2009
Wordpress.org makes use of plugins and widgets (more on those later) to be expandable.
Intro to WordpressTerms and User Interface
24Monday, September 21, 2009
Terms
PostPage
CategoriesMediaThemePluginsWidgets
25Monday, September 21, 2009
Post: content added to the site desgned to be periodic and short lived in importance (like a blog post)Page: A location on the site that will have more static info (like “About Me”Categories: a sort of filing system for articles-have as many or as few as you wantMedia: Movies, Audio, PicturesTheme: The syle sheet that tells you wordpress site how to lookPlugins: stand-alone pieces of code that attach to wordpress to give it a new functionality- like adding a calendar to your site. Widgets: the front-facing side of a plugin- a new functionality added to the site to benefit the user experience.
Plugins & WidgetsThis is why we like wordpress.
26Monday, September 21, 2009
Plugins and Widgets are how we extend Wordpress from a basic blog into a pull featured web presence.
Plugins, Widgets and Themes
As of Today:
Plugins & Widgets: 6,651Themes: 982
JUST through wordpress.org
27Monday, September 21, 2009
lots of options... also, there is a whole industry devoted to making custom wordpress themes, so if its not out there, you can have it made.
Setting up wordpress.org total flexibility and at yourname.com
28Monday, September 21, 2009
Now some info about setting up your own website with wordpress, first some terms.
Host ServerYour remote hard drive
29Monday, September 21, 2009
This is the physical location where your data lives.
FTPFile Transfer Protocol
How you put stuff on your server
30Monday, September 21, 2009
This is a way of acessing that data when it lives on the server.
Domainwww.you.com
31Monday, September 21, 2009
your name online (mine is withdrake.com)
How it works...
32Monday, September 21, 2009
Back-end
Front-end
Host Server
Your Computer
FTPServer
Web Visitor
FTPClient
Admin
Web Browser
How the world interacts with your website.
Domain Name
FTPServer
AdminPanel
http://www.ilovekittens.com
33Monday, September 21, 2009
overly complicated diagram
So what do we do next?
1. Register a Domain2. Sign up with Hosting ($5-$6/month)3. Install Wordpress (easy)4. Have a popsicle.
34Monday, September 21, 2009
Strap in, we’re gonna do it.
35Monday, September 21, 2009
This is where we (in the meeting) set up a full wordpress install. It took about 10 mins.
Next time we will go over widgets, plugins, multi-media management, content production and developer tools. Stay tuned. next Blog-Luck is on Sunday, Jan 27th.