diff --git a/CHANGELOG.md b/CHANGELOG.md
index 32cb68832..a1eb96f9d 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -14,6 +14,8 @@ to [Semantic Versioning](http://semver.org/).
- Skip navigation has been added at the top of the page.
### Changed
+- The homepage has been refreshed to better inform
+the site vistors what they can do on the site.
- The `dist` dir is now cleaned up frequently during
development, ensuring that old files don't stay
around for too long.
@@ -42,7 +44,7 @@ to [Semantic Versioning](http://semver.org/).
- Added environment variables `MAILINGLIST_URL`
and `MAILINGLIST_PRIVACY_NAME`.
- The site now generates `index.html` files for redirects. This
- was done so that `/clubs/curriculum/` redirects to
+ was done so that `/clubs/curriculum/` redirects to
`/activities/web-lit-basics/`.
- `lib/changelog.js` can be used as a node script to help
update `CHANGELOG.md`.
@@ -50,7 +52,7 @@ to [Semantic Versioning](http://semver.org/).
changelog are now verified by the automated test suite.
### Changed
-- The Clubs Curriculum page has been renamed to
+- The Clubs Curriculum page has been renamed to
Web Literacy Basics, and is now available at
`/activities/web-lit-basics/`. It's no longer accessible
through the sidebar, but is instead listed as the
@@ -64,7 +66,7 @@ to [Semantic Versioning](http://semver.org/).
collapsed area becomes focused, improving navigation for
sighted users who can only use the keyboard for navigation.
- Signing up for the Maker Party mailing list now shows
- a "Thank you" modal when the user is returned to the
+ a "Thank you" modal when the user is returned to the
site from BSD.
- Moved all documentation about manual testing to
`CONTRIBUTING.md`.
diff --git a/components/blockquote.jsx b/components/blockquote.jsx
index 87c25993e..b45cc4884 100644
--- a/components/blockquote.jsx
+++ b/components/blockquote.jsx
@@ -6,7 +6,6 @@ var Blockquote = React.createClass({
className: React.PropTypes.string,
imgSrc: React.PropTypes.string.isRequired,
imgSrc2x: React.PropTypes.string,
- imgAlt: React.PropTypes.string.isRequired,
imgWidth: React.PropTypes.number,
imgHeight: React.PropTypes.number,
children: React.PropTypes.object.isRequired,
@@ -15,12 +14,12 @@ var Blockquote = React.createClass({
render: function() {
return (
We want more people to see themselves as citizens of the web. Mozilla Learning Networks offers programs and a global community dedicated to helping people learn the most important skills of our age: the ability to read, write and participate in the digital world.
-
-
-
+
+
About Mozilla Learning Networks
+
+
We want more people to see themselves as citizens of the web. Mozilla Learning Networks offers programs and a global community dedicated to helping people learn the most important skills of our age: the ability to read, write and participate in the digital world.
+
+
);
}
});
@@ -28,7 +26,7 @@ var Intro = React.createClass({
var OurFocus = React.createClass({
render: function () {
return (
-
+
@@ -60,7 +58,7 @@ var OurFocus = React.createClass({
var OurGoal = React.createClass({
render: function () {
return (
-
+
@@ -104,7 +102,7 @@ var AboutPage = React.createClass({
imgSrc="/img/pages/about/svg/icon-connect-blue.svg"
imgAlt="illustration of two people connecting"
head="Say Hello"
- subhead="Connect on the #teachtheweb Discourse forum"
+ subhead="Connect on the Discourse forum"
/>
diff --git a/pages/activities.jsx b/pages/activities.jsx
index e42cd563e..a2a998a3a 100644
--- a/pages/activities.jsx
+++ b/pages/activities.jsx
@@ -230,6 +230,8 @@ var ActivitiesPage = React.createClass({
description="In this activity, learners create a remix of a Wikimedia page as they think critically about the intersection of gender, culture, technology and identity."
/>
+
+
More resources
Hive Learning Networks are city-based communities of educators who champion digital skills and web literacy through connected learning. Visit each city's portfolio to find more inspiration, resources and projects for teaching and learning.
diff --git a/pages/clubs-toolkit.jsx b/pages/clubs-toolkit.jsx
index 7225e5539..a27faa60e 100644
--- a/pages/clubs-toolkit.jsx
+++ b/pages/clubs-toolkit.jsx
@@ -10,18 +10,16 @@ var config = require('../lib/config');
var ToolkitIntro = React.createClass({
render: function () {
return (
-
+
Clubs Toolkit
-
-
-
Get ready to start your club! Here are some best practices and resources to help you grow your local group.
-
-
-
+
+
Get ready to start your club! Here are some best practices and resources to help you grow your local group.
Thank you for helping us celebrate webmaking around the world! These resources will help you plan a unique event tailored especially for your audience.
-
-
+
+
Event Resources
+
Thank you for helping us celebrate webmaking around the world! These resources will help you plan a unique event tailored especially for your audience.
-
-
-
Event Guides
-
No matter the size of your event, we have a guide for you.
-
-
-
-
-
-
Logos & Assets
-
Feel free to use these Maker Party graphics in any of you promotional materials:
There are many details to consider when planning your event. Here's a list of what you need to know:
+
+
+
Event Guides
+
No matter the size of your event, we have a guide for you.
-
-
-
- Look for a comfortable, flexible space that's appropriate for the number of participants you expect. Contact local community spaces, museums, hackerspaces, coworking spaces, organizations, libraries, schools, or coffee shops to see if that have space available for events. Send them information on your event, the missions and what you hope to achieve and offer opportunities for their community to attend. Ensure there is reliable internet, enough power outlests and good lighting.
-
-
-
-
- Create a list of what equipment you need for your event. Check out the event space ahead of time to learn what additional items you might need to buy or bring. If learners need to supply their own equipment, like laptops, make sure this is communicated clearly ahead of time. Also reach out to your venue, mentors or other local organizations to see if they can lend equipment.
-
-
-
-
- Since we know there will be note-taking, brainstorming and making, you are going to need some materials. Have a sign-up sheet, name tags, post-it notes, pens and paper easily accessible. Prepare any other materials you will need ahead of time and set a table aside at the event where learners can grab materials as needed.
-
-
-
-
- Use this logo to create Maker Party t-shirts at your local print shop. Here's an example of what your shirts could look like. Don't have all the budget for printing? Ask participants to bring their own shirts and create Maker Party t-shirts with this activity. You can also print these certificates to give to the participants at the event that successfully complete the activities.
-
-
-
-
- Have you ever heard of an event with perfect Wi-Fi? Neither have we. Prepare for the worst and have a back-up plan in case you lose connection. There are also a lot of activities that require no Internet access. Print out a few activities and keep them with you just in case.
-
- Whether they’re colleagues, students or a group of talented friends, you can find volunteer mentors by tapping into your own networks. Provide them a Sample Volunteer Package with information on the event, activities, social media and any other necessary information in advance. Depending on how many volunteers you have, you might consider holding a meet-up in person or online prior to the event to answer any questions. Don't forget to gather and distribute contact information so that you can stay in touch with them in the days and weeks leading up to the event.
-
-
-
-
- Start spreading the word - share the link to your event so people can plan to attend or share it with others. Local coffee shops, community places, listservs, mailing lists, social networks and forums are all great places to post details. Consider making a poster with event information.
-
-
-
-
- Your event can be drop-in or require registration but make sure there is an effective way for individuals to indicate they are attending and can get access to event information. Having a rough idea of how many learners will attend will give you a better idea of how to prepare stations, materials and mentors.
-
-
-
-
- Plan your schedule ahead of time but be flexible; your participants might surprise you with interesting questions or challenges to explore. A checklist of things you will need for set-up/during/after is very useful. Don't forget to leave yourself adequate prep and clean-up time.
-
-
-
-
- Media coverage is an essential part of promoting an event and showing off what you accomplish. Use the Maker Party Press Kit for guidelines on how to reach out to local media (newspapers, blogs, local news shows). Our social media toolkit will also help you get more out of your posts online. Be sure to use hashtag #MakerParty. If your event is open to the public you may also want to invite community leaders and officials to attend.
-
- Your event should feel like a party! Create a welcoming, creative atmosphere that might include music, decorations and providing name tags. Starting your event with an offline activity or icebreaker such as a spectrogram is a great way to get everyone socializing. Raffles and challenges are good ways to keep the crowd engaged throughout the day.
-
-
-
-
- When preparing for event, be sure to arrive early to set-up the space using this sample event checklist. This will allow you plenty of time in case unexpected issues arise. Use posters or other clear signage to indicate different activity stations. Make sure washrooms and exits are clearly marked. Remind facilitators to welcome newcomers, and make sure the volunteers know what their responsibilities are and who to ask if they have questions.
-
-
-
-
- Find activity kits and tools online that encourage hands-on making, collaborating and participation from your attendees. Here are some of ours to get you started.
-
-
-
-
- Time flies when you’re having fun! It's often impossible to capture or get links of all the awesome things being made. Appoint a volunteer to be the photographer and make sure that activities are well-documented and that photos/video can be shared online. Use the #MakerParty hashtag so we can see them too.
-
-
-
-
- Set aside time for attendees to see each others' activities and exchange ideas. At the end of the event, bring everyone back together in a circle. Celebrate what participants made and invite a few people to share their work with the entire group.
-
-
-
-
- You’re done! Make sure to check the event take down checklist to make sure you’ve covered your bases. Do your best to make sure the space is in the same condition (if not better) than when you arrived.
-
- Ask participants for feedback. What did they learn? What did they enjoy? If they have suggestions for improvement, be sure to take notes or invite them to blog about it. Provide links to websites where they can continue learning new skills. Later, conduct a debrief with participating organizations and volunteers, so your next event can be even better.
-
-
-
-
- Post pictures of your event on Twitter and Flickr using the hashtag #MakerParty or write a blog post using our sample guidelines to share a deeper reflection.
-
-
-
-
- Send a heartfelt "Thank you!" to participating organizations, volunteers, facilitators, participants, partners, the venue and anyone else who helped make your event a success. Include photos, videos and links to the work that was created. Ask for feedback on the event and discuss next steps to getting involved, learning more or hosting a future event.
-
-
-
- )
- }
- ]}/>
+
+
+
+
+
+
Logos & Assets
+
Feel free to use these Maker Party graphics in any of you promotional materials:
-
Event Support
-
Get help from the community and our staff.
-
-
-
-
-
Ask The Community
-
- We have a large, global community of people like you who have hosted events and have lots of advice to share. Visit our discussion forum to ask questions or share your own advice and experience with others.
-
-
-
-
-
Request Support
-
- Still can't find an answer to your question? Our team is here to help you with all things Maker Party. Contact us and we will get back to you as soon as possible.
-
There are many details to consider when planning your event. Here's a list of what you need to know:
+
+
+
+ Look for a comfortable, flexible space that's appropriate for the number of participants you expect. Contact local community spaces, museums, hackerspaces, coworking spaces, organizations, libraries, schools, or coffee shops to see if that have space available for events. Send them information on your event, the missions and what you hope to achieve and offer opportunities for their community to attend. Ensure there is reliable internet, enough power outlests and good lighting.
+
+
+
+
+ Create a list of what equipment you need for your event. Check out the event space ahead of time to learn what additional items you might need to buy or bring. If learners need to supply their own equipment, like laptops, make sure this is communicated clearly ahead of time. Also reach out to your venue, mentors or other local organizations to see if they can lend equipment.
+
+
+
+
+ Since we know there will be note-taking, brainstorming and making, you are going to need some materials. Have a sign-up sheet, name tags, post-it notes, pens and paper easily accessible. Prepare any other materials you will need ahead of time and set a table aside at the event where learners can grab materials as needed.
+
+
+
+
+ Use this logo to create Maker Party t-shirts at your local print shop. Here's an example of what your shirts could look like. Don't have all the budget for printing? Ask participants to bring their own shirts and create Maker Party t-shirts with this activity. You can also print these certificates to give to the participants at the event that successfully complete the activities.
+
+
+
+
+ Have you ever heard of an event with perfect Wi-Fi? Neither have we. Prepare for the worst and have a back-up plan in case you lose connection. There are also a lot of activities that require no Internet access. Print out a few activities and keep them with you just in case.
+
+ Whether they’re colleagues, students or a group of talented friends, you can find volunteer mentors by tapping into your own networks. Provide them a Sample Volunteer Package with information on the event, activities, social media and any other necessary information in advance. Depending on how many volunteers you have, you might consider holding a meet-up in person or online prior to the event to answer any questions. Don't forget to gather and distribute contact information so that you can stay in touch with them in the days and weeks leading up to the event.
+
+
+
+
+ Start spreading the word - share the link to your event so people can plan to attend or share it with others. Local coffee shops, community places, listservs, mailing lists, social networks and forums are all great places to post details. Consider making a poster with event information.
+
+
+
+
+ Your event can be drop-in or require registration but make sure there is an effective way for individuals to indicate they are attending and can get access to event information. Having a rough idea of how many learners will attend will give you a better idea of how to prepare stations, materials and mentors.
+
+
+
+
+ Plan your schedule ahead of time but be flexible; your participants might surprise you with interesting questions or challenges to explore. A checklist of things you will need for set-up/during/after is very useful. Don't forget to leave yourself adequate prep and clean-up time.
+
+
+
+
+ Media coverage is an essential part of promoting an event and showing off what you accomplish. Use the Maker Party Press Kit for guidelines on how to reach out to local media (newspapers, blogs, local news shows). Our social media toolkit will also help you get more out of your posts online. Be sure to use hashtag #MakerParty. If your event is open to the public you may also want to invite community leaders and officials to attend.
+
+ Your event should feel like a party! Create a welcoming, creative atmosphere that might include music, decorations and providing name tags. Starting your event with an offline activity or icebreaker such as a spectrogram is a great way to get everyone socializing. Raffles and challenges are good ways to keep the crowd engaged throughout the day.
+
+
+
+
+ When preparing for event, be sure to arrive early to set-up the space using this sample event checklist. This will allow you plenty of time in case unexpected issues arise. Use posters or other clear signage to indicate different activity stations. Make sure washrooms and exits are clearly marked. Remind facilitators to welcome newcomers, and make sure the volunteers know what their responsibilities are and who to ask if they have questions.
+
+
+
+
+ Find activity kits and tools online that encourage hands-on making, collaborating and participation from your attendees. Here are some of ours to get you started.
+
+
+
+
+ Time flies when you’re having fun! It's often impossible to capture or get links of all the awesome things being made. Appoint a volunteer to be the photographer and make sure that activities are well-documented and that photos/video can be shared online. Use the #MakerParty hashtag so we can see them too.
+
+
+
+
+ Set aside time for attendees to see each others' activities and exchange ideas. At the end of the event, bring everyone back together in a circle. Celebrate what participants made and invite a few people to share their work with the entire group.
+
+
+
+
+ You’re done! Make sure to check the event take down checklist to make sure you’ve covered your bases. Do your best to make sure the space is in the same condition (if not better) than when you arrived.
+
+ Ask participants for feedback. What did they learn? What did they enjoy? If they have suggestions for improvement, be sure to take notes or invite them to blog about it. Provide links to websites where they can continue learning new skills. Later, conduct a debrief with participating organizations and volunteers, so your next event can be even better.
+
+
+
+
+ Post pictures of your event on Twitter and Flickr using the hashtag #MakerParty or write a blog post using our sample guidelines to share a deeper reflection.
+
+
+
+
+ Send a heartfelt "Thank you!" to participating organizations, volunteers, facilitators, participants, partners, the venue and anyone else who helped make your event a success. Include photos, videos and links to the work that was created. Ask for feedback on the event and discuss next steps to getting involved, learning more or hosting a future event.
+
+
+
+ )
+ }
+ ]}/>
+
+
+
Event Support
+
Get help from the community and our staff.
+
+
+
+
Ask The Community
+
+ We have a large, global community of people like you who have hosted events and have lots of advice to share. Visit our discussion forum to ask questions or share your own advice and experience with others.
+
+
+
+
+
Request Support
+
+ Still can't find an answer to your question? Our team is here to help you with all things Maker Party. Contact us and we will get back to you as soon as possible.
+
Since its inauguration in 2012, Maker Party has become Mozilla's largest celebration of making and learning on the web. From getting the hang of HTML to building robots to learning about remixing using paper and scissors, people of all ages and from all backgrounds have come together to joyfully explore the culture, mechanics and citizenship of the web.
+
+
+
+
@@ -150,6 +154,8 @@ var EventsPage = React.createClass({
Check out the highlights from Maker Party and see more photos in our Flickr gallery.
+
+
@@ -160,24 +166,24 @@ var EventsPage = React.createClass({
-
-
-
-
-
+
+
+
+
+
diff --git a/pages/home.jsx b/pages/home.jsx
index aa0b65e66..420b72211 100644
--- a/pages/home.jsx
+++ b/pages/home.jsx
@@ -1,19 +1,136 @@
var React = require('react');
var Router = require('react-router');
var Link = Router.Link;
+var moment = require('moment');
var HeroUnit = require('../components/hero-unit.jsx');
var Blockquote = require('../components/blockquote.jsx');
var Illustration = require('../components/illustration.jsx');
+var IconLinks = require('../components/icon-links.jsx');
+var IconLink = require('../components/icon-link.jsx');
+var IconButtons = require('../components/icon-buttons.jsx');
+var IconButton = require('../components/icon-button.jsx');
+
+var config = require('../lib/config');
+var loadBlogPosts = require('../lib/blog-feed-loader');
var CaseStudies = React.createClass({
render: function() {
return (
-
-
-
Web literacy is about more than coding - it's about how you can be a better web citizen.
-
+
+
+
+
+
"Web literacy is about more than coding - it's about how you can be a better web citizen."
);
}
@@ -25,20 +142,70 @@ var HomePage = React.createClass({
-
Unlock opportunities for all citizens of the Web.
-
+
The Mozilla Learning Network
+
+
+
+
+
-
-
- Join our community of educators and activists who want to teach digital skills and web literacy through making. Learn More
-
-
-
+
+
+
+
About Us
+
We want more people to see themselves as citizens of the web. Mozilla Learning Networks offers programs and a global community dedicated to helping people learn the most important skills of our age: the ability to read, write and participate in the digital world. Learn more
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
);
diff --git a/pages/web-lit-basics.jsx b/pages/web-lit-basics.jsx
index 54623ddd7..17ec8a7c1 100644
--- a/pages/web-lit-basics.jsx
+++ b/pages/web-lit-basics.jsx
@@ -8,19 +8,17 @@ var Link = Router.Link;
var CurriculumIntro = React.createClass({
render: function () {
return (
-
+
Web Literacy Basics
-
-
-
Learners get familiar with reading, writing and participating on the web in this six-part module. Discover the foundations of the web through production and collaboration.
-
-
-
+
+
Learners get familiar with reading, writing and participating on the web in this six-part module. Discover the foundations of the web through production and collaboration.
+
+
);
}
});
@@ -28,16 +26,14 @@ var CurriculumIntro = React.createClass({
var WebLitBasics = React.createClass({
render: function () { // TODO: update Link to weblit after #396 is merged
return (
-
-
-
Learning Objectives
-
- The learning objectives underpinning each activity are informed by Mozilla's Web Literacy Map. Complete the activities in
- sequence, or mix and match for your learners. Need help{'? '}
- Visit our discussion forum to get help and share
- your experience.
-
-
+
+
Learning Objectives
+
+ The learning objectives underpinning each activity are informed by Mozilla's Web Literacy Map. Complete the activities in
+ sequence, or mix and match for your learners. Need help{'? '}
+ Visit our discussion forum to get help and share
+ your experience.
+
