Find online courses made by experts from around the world.
Take your courses with you and learn anywhere, anytime.
Learn and practice real-world skills and achieve your goals.
Whether you’re an HTML veteran or just a beginner, this course is for you. Award-winning trainer Geoff Blake will walk you through the process of creating a website wireframe in just under three hours! This series of instructional videos will guide you through the process of creating the basic sections of your site, arranging and aligning text and images, and adding interactive features. Once you’re finished creating the wireframe, Geoff will show you how to put it online to share with coworkers and clients. After taking this course you’ll be able to build attractive and professional website prototypes in about an hour. The best part? Unlike a simple mockup in Photoshop, you can actually turn this wireframe into a fully-functioning website! Let Geoff Blake help you build your professional skills with this easy to follow course from Ten Ton Online.
Not for you? No problem.
30 day money back guarantee.
Learn on the go.
Desktop, iOS and Android.
Certificate of completion.
|Section 1: Introduction|
Welcome! Understanding Layout WireframingPreview
Why Using Photoshop May Not be the Best ChoicePreview
Using HTML & CSS for Fast Wireframe CompositingPreview
A Look At What We'll Build in this CoursePreview
Bonus Lesson: How to turn any web page into a wireframePreview
|Section 2: Getting Started|
Setting Up the Rough Page Structure
Building the Structural CSS Rules, Part 1
Building the Structural CSS Rules, Part 2
Connecting Up the HTML to the CSS
Centering Layout Elements
Setting Up Inner Layout Containers
Inserting Additional Inner Containers
Spacing Apart the Layout
|Section 3: Wireframing The Header in Greater Detail|
First Thing's First: Getting Organized
Building the Logo Container
Setting Up the Main Navigation Menu
Creating A Call-To-Action Button
|Section 4: Building the Rest of the Layout|
Inserting the Hero Image
Getting Started with the Hero Content
Finishing Up the Hero Section
Inserting the Feature Headers
Building the Feature Boxes
Wireframing the Organize Section
Speeding Things Up for the Share Section
Finishing Up the Wireframing
|Section 5: Finishing Touches|
Inserting A Placeholder Image
Adding A Logo Placeholder with Text
Inserting the Remaining Image Placeholders
Inserting a Background Placeholder
Adding Subtle Interactivity
Adding Button Interactivity
Sharing the Wireframe for Review
|Section 6: Wrapping Up|
Where to Go From Here
Request a Course
At Stone River eLearning, technology is all we teach. If you're interested in programming, development or design - we have it covered.
Check out our huge catalog of courses and join the over 370,000 students currently taking Stone River eLearning courses. We currently offer 100+ different technology training courses on our Stone River eLearning website and are adding new courses on hot and trending topics every month. A subscription option is available for those with a real passion for learning.