Jen Kramer

Cascading Style Sheets, or CSS, is foundational to web development. Webflow allows you to create websites without code, but it's even easier and faster if you already know fundamental CSS layout concepts. In this course, explore the potential uses of CSS in Webflow with web design expert Jen Kramer.

Discover the basics of Webflow's CSS model to get started creating containers, blocks, and layouts for CSS conversion. Learn how to use Grid and Flexbox for advanced layouts as well as… Show more

Cascading Style Sheets, or CSS, is foundational to web development. Webflow allows you to create websites without code, but it's even easier and faster if you already know fundamental CSS layout concepts. In this course, explore the potential uses of CSS in Webflow with web design expert Jen Kramer.

Discover the basics of Webflow's CSS model to get started creating containers, blocks, and layouts for CSS conversion. Learn how to use Grid and Flexbox for advanced layouts as well as static, relative, and absolute positioning of elements. Along the way, Jen provides an overview of floats and breaks and how they affect page flow in your design. By the end of this course, you’ll be equipped with tips and techniques for creating and managing more efficient CSS properties in Webflow. Show less

In this course, web design and development expert Jen Kramer introduces you to a very useful new workflow that enables you to create your site layout in Figma, then move to Webflow to create the same custom website without code. Explore the essential aspects of your Figma files that are critical for working in Webflow. Find out how to mark individual assets in Figma for export to Webflow, as well as how to compress image and media assets for Webflow. Dive into creating a basic Webflow site for… Show more

In this course, web design and development expert Jen Kramer introduces you to a very useful new workflow that enables you to create your site layout in Figma, then move to Webflow to create the same custom website without code. Explore the essential aspects of your Figma files that are critical for working in Webflow. Find out how to mark individual assets in Figma for export to Webflow, as well as how to compress image and media assets for Webflow. Dive into creating a basic Webflow site for your exported assets, and learn how to integrate your Webflow code, CSS, and images to build out the right look/feel. Plus, go over ways you can make your Webflow views responsive to support all device sizes and screens. Show less

Webflow allows you to create professional-looking websites without writing a single line of code. It also lets you manage large amounts of repetitive content using a customizable database called a collection. In this course, instructor Jen Kramer shows the basics of how to add, organize, and manage a structured collection behind your Webflow interface.

Explore the advantages of using collections to sort complex information and how to display collection lists, detail pages, and more. Jen… Show more

Webflow allows you to create professional-looking websites without writing a single line of code. It also lets you manage large amounts of repetitive content using a customizable database called a collection. In this course, instructor Jen Kramer shows the basics of how to add, organize, and manage a structured collection behind your Webflow interface.

Explore the advantages of using collections to sort complex information and how to display collection lists, detail pages, and more. Jen offers pointers and practical strategies to apply category filters and display collections as you go. Along the way, test out your new technical know-how in the practice challenges at the end of each section. By the end of this course, you’ll be prepared to take your Webflow skills to the next level and design more dynamic content for your site. Show less

Starting with the basics of CSS and HTML, you'll progress through creating responsive designs for mobile, tablet, and desktop layouts. You'll learn to code complex layouts with CSS Grid and Flexbox and tackle real-world exercises like styling buttons, audio players, hamburger menus, and lists. You'll explore concepts like rem and em units, custom fonts, responsive images, and the picture element. By the end of the course, you'll have built three variations of a website, each increasing in… Show more

Starting with the basics of CSS and HTML, you'll progress through creating responsive designs for mobile, tablet, and desktop layouts. You'll learn to code complex layouts with CSS Grid and Flexbox and tackle real-world exercises like styling buttons, audio players, hamburger menus, and lists. You'll explore concepts like rem and em units, custom fonts, responsive images, and the picture element. By the end of the course, you'll have built three variations of a website, each increasing in complexity! Show less

If you are a web designer, a UX designer, or a content publisher working on websites or intranet sites, Webflow can be a great tool to know. It empowers you to build professional, responsive, customized sites using a completely visual canvas—no coding required! In this course, web design and development instructor Jen Kramer introduces you to Webflow and all the basics of what you can do with it. Jen steps through creating a starting style guide for a Webflow website. Once that's established… Show more

If you are a web designer, a UX designer, or a content publisher working on websites or intranet sites, Webflow can be a great tool to know. It empowers you to build professional, responsive, customized sites using a completely visual canvas—no coding required! In this course, web design and development instructor Jen Kramer introduces you to Webflow and all the basics of what you can do with it. Jen steps through creating a starting style guide for a Webflow website. Once that's established, she moves on to building the initial homepage and populating it with images and content. She shows you how to style the site’s content, as well as the navbar and footer, then covers how to build an inside page and link the navbar to existing pages. Once you have your pages ready, Jen shows you how to launch your site and take the necessary steps to maintain it. Show less

If you’re using a no-code tool to build your website, you may find it looks a bit generic. How can you make the site uniquely your own? CSS comes to the rescue! CSS (Cascading Style Sheets) is responsible for anything pretty on the web, including colors, fonts, layouts, and much more. Just a little bit of CSS code can give you the customizations you need, and web design and development instructor Jen Kramer shows you exactly how to do it. Jen introduces you to CodePen, a tool used for working… Show more

If you’re using a no-code tool to build your website, you may find it looks a bit generic. How can you make the site uniquely your own? CSS comes to the rescue! CSS (Cascading Style Sheets) is responsible for anything pretty on the web, including colors, fonts, layouts, and much more. Just a little bit of CSS code can give you the customizations you need, and web design and development instructor Jen Kramer shows you exactly how to do it. Jen introduces you to CodePen, a tool used for working with HTML and CSS within a web browser, then goes over what CSS does and how it’s structured. She explains how to use selectors to apply CSS to your page, then dives into CSS colors, images, boxes, sizes, and type. Plus, Jen covers more advanced CSS concepts and properties, like styling links, understanding inheritance, and debugging your creation. Show less

Got a brilliant idea for a mobile application or website? Even if you've never touched a code editor in your life, you can still make your concept a reality using one of the many no-code tools currently on the market. In this course, get a broad overview of some of the options available for designing and creating websites and applications without involving (much, if any) code and engineering. Instructor Jen Kramer explains what the current market of no-code website editors looks like, as well… Show more

Got a brilliant idea for a mobile application or website? Even if you've never touched a code editor in your life, you can still make your concept a reality using one of the many no-code tools currently on the market. In this course, get a broad overview of some of the options available for designing and creating websites and applications without involving (much, if any) code and engineering. Instructor Jen Kramer explains what the current market of no-code website editors looks like, as well as the benefits and limitations of opting for a no-code toolset. She also breaks down the most popular platforms and tools that support no-code development. Learn how to build web apps with Bubble, generate mobile apps with Thunkable, make interactive content with Outgrow, and more. Tune in to get acquainted with some of the latest and greatest tools in the no-code universe. Show less

Learn how to use Squarespace to design, build, and host stylish websites without needing to code or manage servers. Instructor Jen Kramer helps you get up to speed with this popular platform, stepping through the creation of a website for a small business. Jen spells out how the Squarespace service works and shows how to create pages, upload images, and work with assets within Squarespace, as well as manage site structure and navigation. Plus, she explains how to launch your Squarespace-hosted… Show more

Learn how to use Squarespace to design, build, and host stylish websites without needing to code or manage servers. Instructor Jen Kramer helps you get up to speed with this popular platform, stepping through the creation of a website for a small business. Jen spells out how the Squarespace service works and shows how to create pages, upload images, and work with assets within Squarespace, as well as manage site structure and navigation. Plus, she explains how to launch your Squarespace-hosted site. Whether you're well versed in web design or you have little to no coding experience, this course can help you leverage Squarespace to bring your website ideas to life. Show less

Have you always wanted to have your own website, but felt overwhelmed by the technical aspects? Wix makes it easy to build your own website by taking care of all the heavy lifting: code, web hosting, even layout. You can concentrate on the fun stuff: branding and content. In this training course with Jen Kramer, learn how to use Wix to design and visually develop a responsive small-business website. Jen covers all the steps on how to set up a brand-new site, edit the layout and design, and… Show more

Have you always wanted to have your own website, but felt overwhelmed by the technical aspects? Wix makes it easy to build your own website by taking care of all the heavy lifting: code, web hosting, even layout. You can concentrate on the fun stuff: branding and content. In this training course with Jen Kramer, learn how to use Wix to design and visually develop a responsive small-business website. Jen covers all the steps on how to set up a brand-new site, edit the layout and design, and build pages with original content and images. Plus, she shows how to add advanced features like video and chat and publish your site so that it looks great on any device. If you've been intimidated by other web tools, you're in the right place. With Wix and Jen's tips, you can create a simple website that's easy to maintain and will grow alongside your business. Show less

Are you ready to shift your CSS mindset using properties that work in any written language or device orientation? Join coding expert and veteran LinkedIn Learning instructor Jen Kramer to find out more about how to use the recently supported CSS logical properties specification, which allows you to make your models compatible with all possible directions of languages, including left to right and right to left as well as vertical languages read from either side of the screen.

Get up and… Show more

Are you ready to shift your CSS mindset using properties that work in any written language or device orientation? Join coding expert and veteran LinkedIn Learning instructor Jen Kramer to find out more about how to use the recently supported CSS logical properties specification, which allows you to make your models compatible with all possible directions of languages, including left to right and right to left as well as vertical languages read from either side of the screen.

Get up and running with these twelve practical coding challenges that test your capabilities and ramp up your skill set. Reorient yourself as a multilingual developer using logical properties to fit your designs, such as logical borders, padding and margin, writing mode, the logical box model, widths and heights, floats and text alignment, layouts, positioning, refactoring, and more. By the end of this course, you’ll be ready to start writing with multiple modes and layouts at the same time. Show less

Discover new HTML elements and CSS Selectors that you might not know! Learn the hard parts of CSS, including inheritance, specificity, and the cascade. Plus, get hands-on with modern CSS selectors like :is(), :where(), and :has()! With this knowledge, you'll be able to create web pages with fewer classes and more concise and meaningful HTML.

Do you need to know the basics of HTML, but don’t want to get bogged down in an immersive HTML/CSS class? Then check out this course with Jen Kramer, where she teaches you HTML basics that will help you get your job done, from completing simple website updates, to creating landing pages, and formatting email newsletters. Jen starts with the basics of HTML/CSS markup code and covers the structure of common HTML pages. She shows you the most common HTML tags you’re likely to use, like quotes… Show more

Do you need to know the basics of HTML, but don’t want to get bogged down in an immersive HTML/CSS class? Then check out this course with Jen Kramer, where she teaches you HTML basics that will help you get your job done, from completing simple website updates, to creating landing pages, and formatting email newsletters. Jen starts with the basics of HTML/CSS markup code and covers the structure of common HTML pages. She shows you the most common HTML tags you’re likely to use, like quotes, images, linking to PDFs, and embedding videos, and illustrates how to modify and update common markup to customize web-based marketing projects. Jen also provides a few challenges and solutions so you can apply what you’ve learned along the way. Show less

Do you have an idea for a new app or product but don’t know what it takes to get it built? No-code tools can create incredible web-based outcomes. But you need to plan wisely, think about your design, and choose the tool that’s right for you. In this course, instructor Jen Kramer shows you how to plan a successful no-code project by mapping out your entire workflow at the onset.

Discover planning strategies to stay focused and work more efficiently, boosting your productivity along the… Show more

Do you have an idea for a new app or product but don’t know what it takes to get it built? No-code tools can create incredible web-based outcomes. But you need to plan wisely, think about your design, and choose the tool that’s right for you. In this course, instructor Jen Kramer shows you how to plan a successful no-code project by mapping out your entire workflow at the onset.

Discover planning strategies to stay focused and work more efficiently, boosting your productivity along the way. Jen offers tips on how to clarify the purpose and value of your product, create and maintain a unique style and brand, and identify your specific data and user flows so you’re fully prepared when it’s time to start building. Find out why it’s so important to assess your options to ensure you get the most out of your tools. There’s nothing worse than backtracking to solve problems—so why not plan ahead to set yourself up for success? Show less

CSS properties? Easy. CSS layout? Sure. Figuring out which part of a CSS stylesheet applies to a document, especially when there are multiple parts that might apply? Much harder. In this course, Jen Kramer explains that, yes, CSS has powerful rules for addressing these situations, and helps you figure out how to efficiently combine styles to make your website look exactly how you want it to look. After a quick CSS terminology review, Jen dives into the three parts of the cascade that work… Show more

CSS properties? Easy. CSS layout? Sure. Figuring out which part of a CSS stylesheet applies to a document, especially when there are multiple parts that might apply? Much harder. In this course, Jen Kramer explains that, yes, CSS has powerful rules for addressing these situations, and helps you figure out how to efficiently combine styles to make your website look exactly how you want it to look. After a quick CSS terminology review, Jen dives into the three parts of the cascade that work together to determine what style is displayed on a webpage: Inheritance, specificity, and the cascade itself. She looks at each part independently, then shows how the cascade works with inheritance and specificity to identify the final styling for a given page. Show less

The demand for websites, web apps, and native apps has reached new heights, and programmers are needed now more than ever. Some of today’s development happens with no-code and low-code tools that allow people with no technical background to build and customize their own applications. If you’re a seasoned coder, it can get a bit confusing sometimes. But you need to be able to talk clearly and directly about your projects, which means collaborating with no-coders, too.

In this audio-only… Show more

The demand for websites, web apps, and native apps has reached new heights, and programmers are needed now more than ever. Some of today’s development happens with no-code and low-code tools that allow people with no technical background to build and customize their own applications. If you’re a seasoned coder, it can get a bit confusing sometimes. But you need to be able to talk clearly and directly about your projects, which means collaborating with no-coders, too.

In this audio-only course—part of the Tech on the Go series—veteran LinkedIn Learning instructor Jen Kramer walks you through the fundamentals of the no-code landscape. Learn about the historical perspective of no-code on the web and the ways in which no-code can improve efficiency on development teams. Explore use cases for no-code solutions, automation, security, and troubleshooting. Along the way, Jen highlights some of the pros and cons of no-code so you can grow your skills and become a more well-rounded developer. Show less

If you ever find yourself doing the same kinds of tasks over and over, you’ve probably wished that you could send out notifications via Slack or text message automatically when these tasks are done, instead of always relying on email. If that sounds familiar, then Zapier may be just the thing you need. Zapier allows you to connect different web technologies, without knowing a single line of code.

Join instructor and web design expert Jen Kramer as she shows you how to integrate and… Show more

If you ever find yourself doing the same kinds of tasks over and over, you’ve probably wished that you could send out notifications via Slack or text message automatically when these tasks are done, instead of always relying on email. If that sounds familiar, then Zapier may be just the thing you need. Zapier allows you to connect different web technologies, without knowing a single line of code.

Join instructor and web design expert Jen Kramer as she shows you how to integrate and automate your workflow—so you can save time you didn’t even know you were losing. Get started with a basic understanding of Zapier before you explore templates and set out making connections of your own. By the end of this course, you’ll have the skills you need to integrate Gmail with Google Drive, Twitter with Google Sheets, Webflow with Airtable, and more, planning your own automations with confidence for better time management today. Show less

Creating web applications has usually presented a choice of tradeoffs: You can learn to code, or pay a developer thousands of dollars to do it for you. Or, you could use a web-based starter system, but then you’re limited to what plugins are available to you. Enter Bubble, a new approach to an old problem. In this course, Jen Kramer shows you how to get started using this no-code platform that’s targeted at people with limited technical backgrounds who want to develop web applications. After… Show more

Creating web applications has usually presented a choice of tradeoffs: You can learn to code, or pay a developer thousands of dollars to do it for you. Or, you could use a web-based starter system, but then you’re limited to what plugins are available to you. Enter Bubble, a new approach to an old problem. In this course, Jen Kramer shows you how to get started using this no-code platform that’s targeted at people with limited technical backgrounds who want to develop web applications. After going over some of the basic Bubble functionality, Jen dives in and demonstrates how to use Bubble to build a quick application for making a grocery list. Through this project, she shows you how to use the Bubble editor, how to create, populate and update/edit a page in Bubble, how to add a login, and how to add style and interactivity to the app, and much more. If you don’t have a coding background but have always wanted to create your own web apps, this may be the course for you. Show less

Are you interested in learning more about a career in web design and development? Getting on the internet is one thing, but it’s a little harder to think about how the internet is designed, let alone how you can get involved with designing it.

In this course, instructor Jen Kramer gives you an introduction to the core structures, vocabulary, and practices that you need to get started creating on the web. Learn about the fundamentals of clients, servers, and browsers, building your skill… Show more

Are you interested in learning more about a career in web design and development? Getting on the internet is one thing, but it’s a little harder to think about how the internet is designed, let alone how you can get involved with designing it.

In this course, instructor Jen Kramer gives you an introduction to the core structures, vocabulary, and practices that you need to get started creating on the web. Learn about the fundamentals of clients, servers, and browsers, building your skill set for website planning and prototyping, and developing your understanding of user experience and user interface. Get an overview of the three main front-end technologies of websites: HTML, CSS, and JavaScript—followed by a brief introduction to writing code to find out what it’s really like. Not interested in code? No problem. Jen walks you through the available tools and resources that require no coding knowledge at all. Show less

If you’re a day-to-day Joomla! user, you know it was a long wait for the latest version of the open-source content management system. But at long last, you can rejoice—Joomla! 4 is here. Discover the enhancements and latest features of Joomla! 4 with instructor Jen Kramer, as she unpacks all things content-related and gives you the tools you need to get the most out of this highly anticipated release.

Learn how to configure Joomla! 4 and get started exploring categories, articles, menus,… Show more

If you’re a day-to-day Joomla! user, you know it was a long wait for the latest version of the open-source content management system. But at long last, you can rejoice—Joomla! 4 is here. Discover the enhancements and latest features of Joomla! 4 with instructor Jen Kramer, as she unpacks all things content-related and gives you the tools you need to get the most out of this highly anticipated release.

Learn how to configure Joomla! 4 and get started exploring categories, articles, menus, display options, and more. Find out what the latest version offers for modules and components, along with a handful of important extensions and tips on how to use them. Jen walks through everything you need to know about working with templates to control the look of your site and managing access control lists to configure user access and site permissions. Along the way, she provides practice challenges that allow you to test your new skills. Show less

Get to know CSS in the right way without the fluff. You'll style text, build navigation bars, headers/footers, add icons, and more. You'll even build a professional portfolio website by the end of the course! Companion website at https://gettingstartedwith.css.education

Learn the essential CSS layout techniques for building responsive, beautiful web applications. You'll get hands-on practice using CSS Grid for two-dimensional, grid-based layouts and Flexbox for styling one-directional flow. You'll master using these techniques together along with responsive images to build real-world, responsive web layouts!

If you are a web designer, a UX designer, or a content publisher working on websites or intranet sites, Webflow can be a great tool to know. It empowers you to build professional, responsive, customized sites using a completely visual canvas—no coding required! In this course, web design and development instructor Jen Kramer introduces you to Webflow and all the basics of what you can do with it. Jen steps through creating the initial homepage for a Webflow website and populating it with images… Show more

If you are a web designer, a UX designer, or a content publisher working on websites or intranet sites, Webflow can be a great tool to know. It empowers you to build professional, responsive, customized sites using a completely visual canvas—no coding required! In this course, web design and development instructor Jen Kramer introduces you to Webflow and all the basics of what you can do with it. Jen steps through creating the initial homepage for a Webflow website and populating it with images and content. She shows you how to style the site’s content, as well as the navbar and footer, then covers how to build an About page and link the navbar to existing pages. Once you have your pages ready, Jen walks you through launching your site and taking the necessary steps to maintain it. Show less

Got a brilliant idea for a mobile application or website? Even if you've never touched a code editor in your life, you can still make your concept a reality using one of the many no-code tools currently on the market. In this course, get a broad overview of some of the options available for designing and creating websites and applications without involving (much, if any) code and engineering. Instructor Jen Kramer explains what the current market of no-code website editors looks like, as well… Show more

Got a brilliant idea for a mobile application or website? Even if you've never touched a code editor in your life, you can still make your concept a reality using one of the many no-code tools currently on the market. In this course, get a broad overview of some of the options available for designing and creating websites and applications without involving (much, if any) code and engineering. Instructor Jen Kramer explains what the current market of no-code website editors looks like, as well as the benefits and limitations of opting for a no-code toolset. She also breaks down the most popular platforms and tools that support no-code development. Learn how to build web apps with Bubble, generate mobile apps with Thunkable, make interactive content with Outgrow, and more. Tune in to get acquainted with some of the latest and greatest tools in the no-code universe. Show less

Even if your product or service is truly original, the app or site you build for it is going to share elements with every other app or site on the planet. Take, for example, the humble navigation bar, which your users need to find their way through your site. In this course, instructor Jen Kramer demonstrates how to create beautiful, accessible navbars using HTML and CSS techniques that work in any web context. Jen starts by detailing the proper markup for a nav bar and the box model associated… Show more

Even if your product or service is truly original, the app or site you build for it is going to share elements with every other app or site on the planet. Take, for example, the humble navigation bar, which your users need to find their way through your site. In this course, instructor Jen Kramer demonstrates how to create beautiful, accessible navbars using HTML and CSS techniques that work in any web context. Jen starts by detailing the proper markup for a nav bar and the box model associated with its elements. She then goes over how to style both vertical and horizontal navigation bars—including how to put a logo right in the middle of a horizontal navbar. Finally, Jen shares a few advanced tricks, including how to create dropdowns and mobile layouts with hamburger buttons with CSS, no JavaScript required. Show less

Have you always wanted to have your own website, but felt overwhelmed by the technical aspects? Wix makes it easy to build your own website by taking care of all the heavy lifting: code, web hosting, even layout. You can concentrate on the fun stuff: branding and content. In this training course with Jen Kramer, learn how to use Wix to design and visually develop a responsive small-business website. Jen covers all the steps on how to set up a brand-new site, edit the layout and design, and… Show more

Have you always wanted to have your own website, but felt overwhelmed by the technical aspects? Wix makes it easy to build your own website by taking care of all the heavy lifting: code, web hosting, even layout. You can concentrate on the fun stuff: branding and content. In this training course with Jen Kramer, learn how to use Wix to design and visually develop a responsive small-business website. Jen covers all the steps on how to set up a brand-new site, edit the layout and design, and build pages with original content and images. Plus, she shows how to add advanced features like video and chat and publish your site so that it looks great on any device. If you've been intimidated by other web tools, you're in the right place. With Wix and Jen's tips, you can create a simple website that's easy to maintain and will grow alongside your business. Show less

When Joomla! 3.0 was released in 2012, the web was a much different place—Bootstrap 2 was new, HTML 5 wasn’t finalized, and mobile websites were just starting to take over the world. After nearly nine years with the same interface, the Joomla! 4.0 release candidate is here with some new looks that reflect the way the web and mobile web work now. In this course, Jen Kramer gives you a tour of the major features of Joomla! 4.0, ahead of its final release. She starts with a look at Cassiopeia and… Show more

When Joomla! 3.0 was released in 2012, the web was a much different place—Bootstrap 2 was new, HTML 5 wasn’t finalized, and mobile websites were just starting to take over the world. After nearly nine years with the same interface, the Joomla! 4.0 release candidate is here with some new looks that reflect the way the web and mobile web work now. In this course, Jen Kramer gives you a tour of the major features of Joomla! 4.0, ahead of its final release. She starts with a look at Cassiopeia and Atum, the latest website and administrator templates in Joomla. Jen also gives an overview of the built-in components, modules, and plug-ins, and their capabilities. Finally, she looks at one of the major new features in Joomla! 4.0, the workflow feature, which allows you to vet content within Joomla before publication. (Note: This course was recorded using Joomla! 4.0 release candidate 2. If you are using a different version, you may see slight variations between release candidates.) Show less

Expand your HTML repertoire, including element names, required and common attributes, example code, and links to more learning. Bundled and organized from the #30DaysofHTML email course run in April 2021.

To fully realize what you know about topics like HTML and CSS, it sometimes helps to challenge yourself with small projects. That’s what this course does for you. Over the course’s twelve challenges, instructor Jen Kramer walks you through building a full webpage from scratch, using HTML and CSS. The first group of four challenges involves building a portion of the webpage using a Flexbox-based layout. The second group of four challenges focuses on building a horizontal navigation bar with a… Show more

To fully realize what you know about topics like HTML and CSS, it sometimes helps to challenge yourself with small projects. That’s what this course does for you. Over the course’s twelve challenges, instructor Jen Kramer walks you through building a full webpage from scratch, using HTML and CSS. The first group of four challenges involves building a portion of the webpage using a Flexbox-based layout. The second group of four challenges focuses on building a horizontal navigation bar with a CSS-powered hamburger button. The final four challenges step through creating a grid-based layout and combining work completed across challenges to create a beautiful, responsive webpage. Show less

Today's content management systems are easier to use than ever before. So what does it mean to have an ultra-flexible CMS that isn't too technically difficult to use? In this course, instructor Jen Kramer explains the Editor X workflows and workspace, including how to create and edit content and how to build and publish websites. Jen shows you how to create a project and choose a template, walks you through the interface, and describes how to use the theme manager to configure colors and type… Show more

Today's content management systems are easier to use than ever before. So what does it mean to have an ultra-flexible CMS that isn't too technically difficult to use? In this course, instructor Jen Kramer explains the Editor X workflows and workspace, including how to create and edit content and how to build and publish websites. Jen shows you how to create a project and choose a template, walks you through the interface, and describes how to use the theme manager to configure colors and type. She covers how to add a logo, customize your page’s navigation, and add a variety of features to your page. Jen steps through reordering sections of your page and building additional pages. She concludes with an explanation of how to launch your Editor X site. Show less

Hyperlinks are the foundation of the World Wide Web, but they come in many different flavors. Do you want to link to a specific point in a document? Make a phone call, or send an email? Link from images or dedicated navigation bars instead of text? In this course, instructor Jen Kramer gives you all the tools you need to make those tasks easy. Jen goes over basic links, linking to different files and resources, and linking from images, headers, text, and more. She shows you how you can style… Show more

Hyperlinks are the foundation of the World Wide Web, but they come in many different flavors. Do you want to link to a specific point in a document? Make a phone call, or send an email? Link from images or dedicated navigation bars instead of text? In this course, instructor Jen Kramer gives you all the tools you need to make those tasks easy. Jen goes over basic links, linking to different files and resources, and linking from images, headers, text, and more. She shows you how you can style links and individual link states using CSS selectors, then goes into how you can make exceptions and create different styles. Jen covers the steps you should take to maintain links and redirect them when necessary. Show less

Every CSS layout relies on the display property to tell it basic rules for how to present content. In this course, instructor Jen Kramer explains why the display property is so important and walks you through basic display values and newer display values that you need to understand to make effective use of this property. Jen discusses inline-level elements and the inline display value. She covers block-level elements, the block display value, and how to nest inline and block elements in HTML… Show more

Every CSS layout relies on the display property to tell it basic rules for how to present content. In this course, instructor Jen Kramer explains why the display property is so important and walks you through basic display values and newer display values that you need to understand to make effective use of this property. Jen discusses inline-level elements and the inline display value. She covers block-level elements, the block display value, and how to nest inline and block elements in HTML. Jen describes how to use “display: none” and “visibility: hidden” to hide content. Then she goes into newer display values, such as inline flex and grid values, the flow-root property, inline-block, tables, and list items. Jen concludes with recommendations on further HTML and CSS learning. Show less

Making your own website may be easier than ever before, with the amount of services, sites, and tools at your disposal, but all those options and choices may lead to decision paralysis. What domain do you pick? What hosting service do you use? How do you design the site to match your brand? Let longtime LinkedIn Learning instructor Jen Kramer show you the way. In this course, Jen covers the important decisions to be made in the no-code website realm, from the first decisions, to building the… Show more

Making your own website may be easier than ever before, with the amount of services, sites, and tools at your disposal, but all those options and choices may lead to decision paralysis. What domain do you pick? What hosting service do you use? How do you design the site to match your brand? Let longtime LinkedIn Learning instructor Jen Kramer show you the way. In this course, Jen covers the important decisions to be made in the no-code website realm, from the first decisions, to building the site, to maintaining the site after creation. She covers factors to consider when making personal aesthetic choices such as fonts, tone, and imagery, as well as technical aspects like choosing a platform, optimizing images for the web, and improving website performance. If you have an idea or brand you want to promote with a website, this course will give you the tools to help you get up and running. Show less

Squarespace websites offer a variety of content types that you can leverage to make your sites more interactive and engaging. In this course, explore the different types of pages and content that you can add and tailor for your website. Learn how to set up a blog on your Squarespace website, including how to customize the design and include media files. Find out how to post new blog content featuring images. See how to create a new website that can display your upcoming events, complete with a… Show more

Squarespace websites offer a variety of content types that you can leverage to make your sites more interactive and engaging. In this course, explore the different types of pages and content that you can add and tailor for your website. Learn how to set up a blog on your Squarespace website, including how to customize the design and include media files. Find out how to post new blog content featuring images. See how to create a new website that can display your upcoming events, complete with a sign-up page so visitors can receive newsletters and notifications. Put these new site-building skills together as you follow along with the final example project where you get to see a microsite built for a restaurant. Show less

Learn how to use Squarespace to design, build, and host stylish websites without needing to code or manage servers. Instructor Jen Kramer helps you get up to speed with this popular platform, stepping through the creation of a website for a small business. Jen spells out how the Squarespace service works and shows how to create pages, upload images, and work with assets within Squarespace, as well as manage site structure and navigation. Plus, she explains how to launch your Squarespace-hosted… Show more

Learn how to use Squarespace to design, build, and host stylish websites without needing to code or manage servers. Instructor Jen Kramer helps you get up to speed with this popular platform, stepping through the creation of a website for a small business. Jen spells out how the Squarespace service works and shows how to create pages, upload images, and work with assets within Squarespace, as well as manage site structure and navigation. Plus, she explains how to launch your Squarespace-hosted site. Whether you're well versed in web design or you have little to no coding experience, this course can help you leverage Squarespace to bring your website ideas to life. Show less

CSS makes it easy to create compelling online experiences, but style sheets also work for pages off the screen. The need for print persists and site developers should know how to create not just workable but appealing print results. Learn why print style sheets are important and how they can help improve the user experience for your website, in this course with veteran web designer and teacher Jen Kramer. Jen explains how to create and link CSS via an external print style sheet or a print-based… Show more

CSS makes it easy to create compelling online experiences, but style sheets also work for pages off the screen. The need for print persists and site developers should know how to create not just workable but appealing print results. Learn why print style sheets are important and how they can help improve the user experience for your website, in this course with veteran web designer and teacher Jen Kramer. Jen explains how to create and link CSS via an external print style sheet or a print-based media query. She then shows how to use standard best practices to optimize page layouts for print vs. screen, including hiding and showing content exclusive to each media type. Plus, learn how to take your print page formatting to the next level using the CSS paged media and fragmentations specifications, which allow you to set page breaks, adjust margins, and control the formatting and layout of text. Show less

Learn from the ground up on what Responsive Design is and how to start implementing it in your HTML and CSS. This base understanding, will help you even when working in Content Management systems. In this course, Jen Kramer shows you how to structure your HTML and CSS for different screen dimensions using media queries and how to work with images in responsive design.

While most web developers have encountered media queries as part of their work on responsive layouts, media queries offer many more options than just the size of the viewport. In this course, instructor Jen Kramer explores some of the latest and greatest media query options available to Chrome, Firefox, Edge, and Safari. Learn how to test for different styles of interaction, determine how devices are held, figure out what resolution they have, and combine these options to build better sites and… Show more

While most web developers have encountered media queries as part of their work on responsive layouts, media queries offer many more options than just the size of the viewport. In this course, instructor Jen Kramer explores some of the latest and greatest media query options available to Chrome, Firefox, Edge, and Safari. Learn how to test for different styles of interaction, determine how devices are held, figure out what resolution they have, and combine these options to build better sites and apps. Jen also covers complex media queries using and, not, and comma-separated conditions. Plus, she shows you how to keep these choices from breaking your projects in older devices. Show less

Got a brilliant idea for a mobile application or website? Even if you've never touched a code editor in your life, you can still make your concept a reality using one of the many no-code tools currently on the market. In this course, get a broad overview of some of the options available for designing and creating websites and applications without involving (much, if any) code and engineering. Instructor Jen Kramer explains what the current market of no-code website editors looks like, as well… Show more

Got a brilliant idea for a mobile application or website? Even if you've never touched a code editor in your life, you can still make your concept a reality using one of the many no-code tools currently on the market. In this course, get a broad overview of some of the options available for designing and creating websites and applications without involving (much, if any) code and engineering. Instructor Jen Kramer explains what the current market of no-code website editors looks like, as well as the benefits and limitations of opting for a no-code toolset. She also breaks down the most popular platforms and tools that support no-code development. Learn how to build web apps with Bubble, generate mobile apps with Thunkable, make interactive content with Outgrow, and more. Tune in to get acquainted with some of the latest and greatest tools in the no-code universe. Show less

Web development focuses on creating highly visual content, but many crawlers ignore the layouts and imagery that give human readers context. To aid Google Search and other bots, you can use structured semantic data. This invisible but critical metadata determines how your sites appear online and can help boost your search rankings. In this course, Jen Kramer shows how to add data structured for machine readers to pages also intended for humans. Learn how to describe content in schemas, use meta… Show more

Web development focuses on creating highly visual content, but many crawlers ignore the layouts and imagery that give human readers context. To aid Google Search and other bots, you can use structured semantic data. This invisible but critical metadata determines how your sites appear online and can help boost your search rankings. In this course, Jen Kramer shows how to add data structured for machine readers to pages also intended for humans. Learn how to describe content in schemas, use meta tags, and leverage tools like the Structured Data Markup Helper and Structured Data Testing Tool—both from Google—to add microdata and JSON-LD code to your pages. In chapter three, Jen provides several structured data examples as well as a challenge to test your ability to provide rich search results. Show less

The HTML head element is different from the rest of the language, providing context rather than content. Want to control how your page appears on social media? Apply a title? Link a style? All that and more happen in the head. In this course, learn to leverage the invisible but powerful head element to improve search engine rankings, social media sharing, and more. Instructor Jen Kramer shows how to establish the fundamentals, like doctype and language, and use the meta tags to configure… Show more

The HTML head element is different from the rest of the language, providing context rather than content. Want to control how your page appears on social media? Apply a title? Link a style? All that and more happen in the head. In this course, learn to leverage the invisible but powerful head element to improve search engine rankings, social media sharing, and more. Instructor Jen Kramer shows how to establish the fundamentals, like doctype and language, and use the meta tags to configure character sets, color themes, authors, and more, as well as redirect pages. Plus, learn how to control how links to your page are shown on Facebook with the Open Graph tag. Then discover how to set page titles, link and specify styles, and add JavaScript to your page with other crucial tags. Show less

Jen Kramer walks you through setting up a HTML and CSS webpage. Learning the fundamental structure concept of HTML layout and CSS styling can help you work with templates in CMS sites, such as WordPress, Joomla, and Drupal.

Sometimes you need to share data, and not just visualizations, directly with other people. HTML tables make this easy. While they have a complex history of use and misuse, HTML tables are great at their key purpose: presenting data. In this course, learn how to create table structures that fit your data precisely, are easy to style, and work well for sharing. Instructor Jen Kramer covers the essential skills you need to learn to display and format tabular data on the web. Watch and learn how to… Show more

Sometimes you need to share data, and not just visualizations, directly with other people. HTML tables make this easy. While they have a complex history of use and misuse, HTML tables are great at their key purpose: presenting data. In this course, learn how to create table structures that fit your data precisely, are easy to style, and work well for sharing. Instructor Jen Kramer covers the essential skills you need to learn to display and format tabular data on the web. Watch and learn how to build tables with HTML, style tables with CSS, and make your tables accessible to users with disabilities on all types of devices.
Learning Objectives:
Adding content to tables
Defining table headers
Styling borders
Alternating table row colors
Grouping columns
Styling table borders, headers, and footers
Making tables responsive Show less

Learn about how to use Webflow, the web-based tool for easily creating responsive websites without coding. Instructor Jen Kramer covers creating a new site with Webflow, adding content and media, customizing the navigation and visual layout, and adding additional pages. She also shares how to publish a site, monitor its performance, and keep it updated with new content.

Learning Objectives:
How Webflow is different from WordPress
The Webflow interface
Working with the Webflow… Show more

Learn about how to use Webflow, the web-based tool for easily creating responsive websites without coding. Instructor Jen Kramer covers creating a new site with Webflow, adding content and media, customizing the navigation and visual layout, and adding additional pages. She also shares how to publish a site, monitor its performance, and keep it updated with new content.

Learning Objectives:
How Webflow is different from WordPress
The Webflow interface
Working with the Webflow editor
Creating a project and choosing a template
Adding a logo
Changing colors and fonts
Configuring the home page
Building inside pages
Adding text and images
Configuring the contact page
Publishing a site Show less

HTML is a powerful tool kit that gives your code superpowers, if you choose to use them. Thanks to the built-in behaviors in HTML, you can reduce the amount of explicit code you need. Structure your documents so that they work well as well as look good, and you can make your content available to more people and more programs. In this course, Jen Kramer shows you how to craft semantic, meaningful HTML, demystifying essential HTML tags and attributes along the way. She helps you make sure your… Show more

HTML is a powerful tool kit that gives your code superpowers, if you choose to use them. Thanks to the built-in behaviors in HTML, you can reduce the amount of explicit code you need. Structure your documents so that they work well as well as look good, and you can make your content available to more people and more programs. In this course, Jen Kramer shows you how to craft semantic, meaningful HTML, demystifying essential HTML tags and attributes along the way. She helps you make sure your pages (including elements like navigation) are properly structured and sectioned, and shows how to use the language's unique features for representing quotes, figures, dates, and times.
Topics include:
- Structuring documents
- Identifying headings and paragraphs
- Adding semantic navigation
- Working with ordered, unordered, and definition lists
- Adding links and emphasized text
- Adding images, quotes, and line breaks
- Identifying semantic problems Show less

When responsive web design was first introduced, it was at once magical and inefficient. Designers had to work with floats to lay out their grid-based systems, as well as hack media queries. Recent advances in CSS simplify this process, letting your design adapt to circumstances more fluidly. But leveraging these new features requires abandoning current practices and shifting to a model where you trade precise control for consistency and ease of implementation. This course can help you make… Show more

When responsive web design was first introduced, it was at once magical and inefficient. Designers had to work with floats to lay out their grid-based systems, as well as hack media queries. Recent advances in CSS simplify this process, letting your design adapt to circumstances more fluidly. But leveraging these new features requires abandoning current practices and shifting to a model where you trade precise control for consistency and ease of implementation. This course can help you make that shift. Jen Kramer lays out how to do math directly in CSS via the calc() function and leverage custom properties, or variables, to streamline your CSS. Along the way, Jen shares examples of how to use these properties, including how to add custom properties to type scale and work with Flexbox and Grid.
Show less

Explore creative-oriented career paths in web design and development including user experience (UX) design, user interface (UI) design, internet marketing, graphic design, and more. Learn which personality types are best suited for each career opportunity and what skills are required for each position. Instructor Jen Kramer also covers which tools are current in each field, shares why coding is still a key literacy for web designers, and offers further resources for each area of interest.

The Frontend Masters Bootcamp is a complete crash course, and everything you need to get up and running with HTML, CSS and JavaScript. By completing the coursework contained in the Bootcamp, along with practice, you will be well on your way into the world of web development!

Co-instructor: Brian Holt, Microsoft, who covers JavaScript. I teach HTML and CSS.

For the first time in the history of the web, CSS is graced with tools for laying out web pages without hacks. Flexbox and Grid provide methods for creating responsive websites with designs not previously possible. CSS Calc and CSS Custom Properties give us a first chance to use math and variables within CSS itself, without requiring compiling. Together, these four new CSS modules work together to revolutionize the way we lay out web pages with CSS.

Discover how to effectively leverage the power of selectors to select the elements you want to style without adding classes, changing HTML, or getting overly specific with your selectors. In this course, instructor Jen Kramer demonstrates how to pinpoint specific parts (and groups of parts) in an HTML document using the powerful declarative syntax of CSS selectors. Jen covers combinator selectors, attribute selectors, pseudo-class and pseudo-element selectors, and the universal selector. She… Show more

Discover how to effectively leverage the power of selectors to select the elements you want to style without adding classes, changing HTML, or getting overly specific with your selectors. In this course, instructor Jen Kramer demonstrates how to pinpoint specific parts (and groups of parts) in an HTML document using the powerful declarative syntax of CSS selectors. Jen covers combinator selectors, attribute selectors, pseudo-class and pseudo-element selectors, and the universal selector. She also offers tips for determining which selectors might not be supported by your browser choices and shares best practices for mixing selectors in your document. And because this is an easily-tested syntax, Jen includes questions at the end of most videos to reinforce your understanding of each concept. Show less

You—a person with little or no training in web design—have found yourself in charge of a website. Maybe even two. While your task might initially seem daunting, designing and running a great site is completely within your powers. In this weekly series, Jen Kramer shows you how, providing quick, actionable tips designed to help accidental web designers like yourself create and manage high-quality sites. Learn new techniques in the areas of content, marketing, and technology, from how to define… Show more

You—a person with little or no training in web design—have found yourself in charge of a website. Maybe even two. While your task might initially seem daunting, designing and running a great site is completely within your powers. In this weekly series, Jen Kramer shows you how, providing quick, actionable tips designed to help accidental web designers like yourself create and manage high-quality sites. Learn new techniques in the areas of content, marketing, and technology, from how to define your website’s voice to how to effectively focus your social media messaging. Plus, Jen provides a weekly question to consider with other accidental web designers in the course’s LinkedIn Group. Tune in every Wednesday for a new tip. Show less

Wix makes it easy to build your own website. It takes care of all the heavy lifting: code, web hosting, even layout. You can concentrate on the fun stuff: branding and content. Learn how to use Wix to design and visually develop a responsive small-business website, in this training course with Jen Kramer. Jen shows how to set up a brand-new site, edit the layout and design, and build pages with original content and images. Plus, learn how to add advanced features like video and chat and publish… Show more

Wix makes it easy to build your own website. It takes care of all the heavy lifting: code, web hosting, even layout. You can concentrate on the fun stuff: branding and content. Learn how to use Wix to design and visually develop a responsive small-business website, in this training course with Jen Kramer. Jen shows how to set up a brand-new site, edit the layout and design, and build pages with original content and images. Plus, learn how to add advanced features like video and chat and publish your site so that it looks great on any device. If you've been intimidated by other web tools, you're in the right place. With Wix and Jen's tips, you can create a simple website that's easy to maintain and will grow alongside your business. Show less

Your idea is going to be BIG. You just know it. But before you hire your favorite developer to go build it, take a step back. Creating a brand-new product is a risk; many of them fail within their first year. Is there a proven way to set yourself up for success?

Yes! All it takes is some preparation. By taking the time to do upfront validation, planning and iterating before you build, you can avoid ideas that flop and create a product that exceeds expectations.

Interested in selling your products online? In this course, Jen Kramer helps you get started by stepping through how to configure ecommerce on your Squarespace site. Jen shows how to create a website for physical products that need shipping and digital products that need downloading. She also shares how to create a site for service products that require in-person or virtual attendance at an event, how to create variants for a service product, and how to list a service product in a calendar… Show more

Interested in selling your products online? In this course, Jen Kramer helps you get started by stepping through how to configure ecommerce on your Squarespace site. Jen shows how to create a website for physical products that need shipping and digital products that need downloading. She also shares how to create a site for service products that require in-person or virtual attendance at an event, how to create variants for a service product, and how to list a service product in a calendar listing. Plus, learn how to configure payments and emails for your physical, digital, or service products, how to offer gift cards, and more. Upon wrapping up this course, you'll be ready to get your own ecommerce site up and running using this popular online authoring platform.
Show less

Bootstrap is the most popular design framework in the world. Bootstrap is an HTML, CSS and Javascript framework that allows you to create clean-looking websites. Bootstrap provides pre-built code that solves many of the tricky elements, such as responsiveness, that slow down web projects. This class is the perfect introduction for anyone who wants to start using Bootstrap. These videos will show you how to use Bootstrap 4's grid system, and responsive features. You'll also learn how to… Show more

Bootstrap is the most popular design framework in the world. Bootstrap is an HTML, CSS and Javascript framework that allows you to create clean-looking websites. Bootstrap provides pre-built code that solves many of the tricky elements, such as responsiveness, that slow down web projects. This class is the perfect introduction for anyone who wants to start using Bootstrap. These videos will show you how to use Bootstrap 4's grid system, and responsive features. You'll also learn how to customize forms, menus, buttons and text. Show less

Take your first steps in building websites by first learning how the web works. This course is aimed at beginners to give you the foundational knowledge of how the web works. You'll take a look at the terminology of web servers, web services, and the devices we use to use the internet. You'll also see how files and folders created on our computers can be assembled to create a web page that can be uploaded onto a server and viewed on the internet.

Learn how to use Squarespace to design, build, and host stylish websites without needing to code heavily or manage servers. Instructor Jen Kramer helps you get up to speed with this popular platform, stepping through the creation of three different websites: a small business informational site, a conference website, and a single-page restaurant website. Jen spells out how the Squarespace service works and shows how to plan out a successful site, create pages and assets within Squarespace, and… Show more

Learn how to use Squarespace to design, build, and host stylish websites without needing to code heavily or manage servers. Instructor Jen Kramer helps you get up to speed with this popular platform, stepping through the creation of three different websites: a small business informational site, a conference website, and a single-page restaurant website. Jen spells out how the Squarespace service works and shows how to plan out a successful site, create pages and assets within Squarespace, and manage site structure and navigation. Plus, she explains how to launch and maintain your Squarespace-hosted site. Whether you're well versed in web design or you have little to no coding experience, this course can help you leverage Squarespace to bring your website ideas to life. Show less

HTML is an essential programming language that's highly useful for structuring documents for the web. In this course, learn the basics of HTML markup code as they apply to common marketing projects. Instructor Jen Kramer explains what HTML is, exactly, and goes over techniques and concepts that can help you confidently approach marketing tasks such as formatting email newsletters and making simple updates to a website. She covers head and body tags, lists, implementing images, creating tables… Show more

HTML is an essential programming language that's highly useful for structuring documents for the web. In this course, learn the basics of HTML markup code as they apply to common marketing projects. Instructor Jen Kramer explains what HTML is, exactly, and goes over techniques and concepts that can help you confidently approach marketing tasks such as formatting email newsletters and making simple updates to a website. She covers head and body tags, lists, implementing images, creating tables, editing raw HTML in MailChimp, and more.
Topics include:
Working with head and body tags
Nesting one list inside of another
Creating links within a page
Linking to PDF files
Quoting and citing text
Fixing HTML in MailChimp Show less

We'll begin with a quick review of the industry's current standard: float-based grid systems. We'll review how to code one (quickly), plus advantages and disadvantages of this type of layout. We'll also review media queries and responsive images, including the new tag and the Picturefill polyfill.

We'll quickly move on to Flexbox, first exploring exactly how Flexbox works, since it's very different from floats. We'll code a simple grid system with Flexbox, and we'll explore the… Show more

We'll begin with a quick review of the industry's current standard: float-based grid systems. We'll review how to code one (quickly), plus advantages and disadvantages of this type of layout. We'll also review media queries and responsive images, including the new tag and the Picturefill polyfill.

We'll quickly move on to Flexbox, first exploring exactly how Flexbox works, since it's very different from floats. We'll code a simple grid system with Flexbox, and we'll explore the similarities and differences with a float-based grid system.

Next, we'll take advantage of Flexbox's amazing alignment and the ordering features to juice up our grid, taking us places that simply weren't possible with floats.

Finally, we'll wrap up our first day by considering a common problem. You have some number of items you must lay out in columns and/or rows on a web page, but you have no idea how many items there are. (An item could be an image, a card, a media object, or anything else that would be considered a unit of content.)

On the second day, we'll dive into CSS Grid, the brand-new spec available in the latest browsers. We'll look at Grid's basic syntax, working on a layout of a Mondrian painting as an example, which we'll create with Grid. Next, we'll move on to some of the alternative Grid syntaxes, and we'll explore nested and offset grid layouts. Of course, we'll also cover compatibility issues -- how can we make Grid work across browsers, with reasonable fallbacks?

Finally, with Flexbox and Grid understood and mastered, we'll try combining these elements for the best solution to a web page layout problem.

By the end of this course, you'll be able to articulate the strengths and weaknesses of float-based layout, Flexbox, and Grid, and you'll be able to code responsive layouts with each of these technologies. Show less

Need to build a responsive website or app quickly? Foundation 6 simplifies the creation of mobile-ready, cross-browser interfaces. An open-source framework, it features a 12-column grid; buttons of many different shapes, sizes, and functionality; fully functional components that are ready to use; and much more. Plus, its Flexbox-based grid system and easy-to-edit styles make it a real timesaver—even for more advanced developers. Get an introduction to the most frequently used Foundation… Show more

Need to build a responsive website or app quickly? Foundation 6 simplifies the creation of mobile-ready, cross-browser interfaces. An open-source framework, it features a 12-column grid; buttons of many different shapes, sizes, and functionality; fully functional components that are ready to use; and much more. Plus, its Flexbox-based grid system and easy-to-edit styles make it a real timesaver—even for more advanced developers. Get an introduction to the most frequently used Foundation components, and how they fit together, in this introductory training course. Instructor Jen Kramer helps you create a responsive layout, modify the look and feel by editing the underlying CSS, and customize the navigation. She demonstrates how to add card-based approaches, modal dialogs, photo carousels, and other JavaScript-based effects.
Topics include:
Working with the XY Grid system
Adjusting margins and padding
Block versus vertical grids
Overriding CSS
Including cards and callouts
Customizing the navigation, including dropdown and drilldown menus
Adding JavaScript effects such as a carousel or tooltips Show less

You’re new at your job. You’re a project manager and you’ve just been tasked with overseeing the new website. You’re thrilled! But you’re also freaked out because you’ve never led a project like this in your life. Don’t despair. In this video course, web design vets Jen Kramer and Heather O’Neill will put your mind at ease and mentor you towards gold. They’ll show you, in step-by-step fashion, how to plan and design a website—from defining site goals and choosing a target audience to designing… Show more

You’re new at your job. You’re a project manager and you’ve just been tasked with overseeing the new website. You’re thrilled! But you’re also freaked out because you’ve never led a project like this in your life. Don’t despair. In this video course, web design vets Jen Kramer and Heather O’Neill will put your mind at ease and mentor you towards gold. They’ll show you, in step-by-step fashion, how to plan and design a website—from defining site goals and choosing a target audience to designing a page architecture and establishing a tone of voice. Along the way, you’ll learn about project outlines, must-know business concepts (value proposition, success metrics, etc.), branding, ethnographic research, market research, personas, information architecture, UX design, usability testing, and more. By the end of the course, you’ll be able to deliver a website specification that’s ready to code...and impress your boss. Show less

Coding a form correctly on your websites is extremely important because forms typically fulfill a call to action- we ask the users to sign up for a newsletter, email with questions, purchase a product, register for services, and so much more. Forms that are coded incorrectly or that use outdated standards often result in a loss of usability, which in turn can lead to fewer sales, contacts, or any of the other actions we ask our users to perform.

In this course you will begin with a form… Show more

Coding a form correctly on your websites is extremely important because forms typically fulfill a call to action- we ask the users to sign up for a newsletter, email with questions, purchase a product, register for services, and so much more. Forms that are coded incorrectly or that use outdated standards often result in a loss of usability, which in turn can lead to fewer sales, contacts, or any of the other actions we ask our users to perform.

In this course you will begin with a form that’s not written in HTML5 or according to standards, and you'll rework it to bring it up to HTML5 standards, including some layout tips for making the form work on mobile devices. Show less

Get an introduction to Sass—syntactically awesome style sheets—in this hands-on video course from programmer and author Jen Kramer. Sass allows CSS designers to create style sheets that are easier to follow and less repetitive, leveraging data structures like variables, if/else statements, functions, and loops. With this video, you’ll learn how to install and configure a Sass compiler, understand the differences between Sass and CSS, and learn SCSS syntax.

Joomla!, the open-source CMS, easily expands to make websites that do almost whatever you want. In this course, Jen Kramer introduces the modules, components, extensions, and templates that will help you take Joomla! further. Learn about the core modules (like custom HTML and search) and then find out how to build out contact forms and redirect web traffic with components, use extensions to create backups and upload media, and change the look of your site with templates. Make sure to test your… Show more

Joomla!, the open-source CMS, easily expands to make websites that do almost whatever you want. In this course, Jen Kramer introduces the modules, components, extensions, and templates that will help you take Joomla! further. Learn about the core modules (like custom HTML and search) and then find out how to build out contact forms and redirect web traffic with components, use extensions to create backups and upload media, and change the look of your site with templates. Make sure to test your new skills by taking the practice challenges issued along the way.
Show less

Find new and interesting ways to display your site content with Joomla!, the open-source CMS, and these tutorials from Jen Kramer. Jen shows how to create and modify the look of categories, articles, lists, and menus, and implement advanced functionality like tagging and version control. She'll teach you how to add links, images, videos, and dropdown menus to your Joomla! site, as well as configure some crucial display options. Make sure to test your new skills by taking the practice challenges… Show more

Find new and interesting ways to display your site content with Joomla!, the open-source CMS, and these tutorials from Jen Kramer. Jen shows how to create and modify the look of categories, articles, lists, and menus, and implement advanced functionality like tagging and version control. She'll teach you how to add links, images, videos, and dropdown menus to your Joomla! site, as well as configure some crucial display options. Make sure to test your new skills by taking the practice challenges issued along the way. Show less

In Migrating from Joomla! 2.5 to Joomla! 3.3, Jen Kramer walks through migrating a typical Joomla! site to Joomla! 3.3—a move that will be obligatory once version 2.5 is retired in December 2014. Jen shows how to prep your site for migration, upgrade Joomla! and its extensions, start the migration, and then test your site functionality once the migration is complete. She also demonstrates how to tweak an existing template to work with Joomla! 3, or install a different template altogether.

Joomla! is one of the most popular open-source content management systems in the world, powering over 30 million websites. In this course Jen Kramer will help you install Joomla! locally or remotely, so you can run it from your own computer or on a web host everyone can access. Learn how to install Joomla! with either WAMP (Windows) or MAMP (Mac) stacks, configure Joomla! on a web host, and move your site from a web-hosted environment to a local one—or vice versa. Plus, learn the keys to… Show more

Joomla! is one of the most popular open-source content management systems in the world, powering over 30 million websites. In this course Jen Kramer will help you install Joomla! locally or remotely, so you can run it from your own computer or on a web host everyone can access. Learn how to install Joomla! with either WAMP (Windows) or MAMP (Mac) stacks, configure Joomla! on a web host, and move your site from a web-hosted environment to a local one—or vice versa. Plus, learn the keys to administering Joomla!, both locally and remotely, including updating Joomla! when the next version is released. Show less

Do more with LESS in Bootstrap. In this course, Jen Kramer shows you how to customize the look and feel of your Bootstrap site with LESS CSS, as well as LESS mixins and Bootstap's own customization screens. You'll learn how to configure Prepros, a LESS compiler; work within the LESS file structure; and start modifying fonts, color, spacing, and more with the variables.less file. Then LESS's mixins will allow you to make advanced customizations like custom buttons and tab styles.

In this advanced course, learn to build responsive websites with Foundation—the clean, simple design framework that uses integrated CSS and JavaScript. Jen Kramer covers Foundation's twelve-column grid system, including the small, medium, and large grid options that make layouts easy to assemble. Then learn how to adjust Foundation's default CSS styling to make your buttons, thumbnails, and other page elements look just the way you want, and add top, side, and off-canvas navigation bars. Jen… Show more

In this advanced course, learn to build responsive websites with Foundation—the clean, simple design framework that uses integrated CSS and JavaScript. Jen Kramer covers Foundation's twelve-column grid system, including the small, medium, and large grid options that make layouts easy to assemble. Then learn how to adjust Foundation's default CSS styling to make your buttons, thumbnails, and other page elements look just the way you want, and add top, side, and off-canvas navigation bars. Jen also shows you how to work with cool JavaScript-based effects like Orbit (an image carousel), Reveal (a modal window plugin), and Interchange (offering responsive image management). Show less

Twitter's Bootstrap is one of the most popular HTML/CSS/JavaScript frameworks for creating responsive websites. Here, Jen Kramer shows you how to add interactive elements like a thumbnail gallery, image carousel, or contact form using Bootstrap and a simple text editor. Plus, learn to style these features with CSS and add helpful JavaScript-based pop-ups and tooltips that enhance their usability. Along the way, you can test your Bootstrap prowess with a series of challenge videos.

Meet Bootstrap, the one-stop shop for designing sleek, mobile-ready websites with HTML5, CSS3, and JavaScript. It's an open-source, responsive design framework, featuring a grid-based layout system, web-ready icons you can incorporate into your designs, fully functional navigation, and much more. Join Jen Kramer for a quick overview of all of the goodies in Bootstrap, and then learn how to customize the grid, override the CSS to customize your site, and leverage Bootstrap's stylish built-in… Show more

Meet Bootstrap, the one-stop shop for designing sleek, mobile-ready websites with HTML5, CSS3, and JavaScript. It's an open-source, responsive design framework, featuring a grid-based layout system, web-ready icons you can incorporate into your designs, fully functional navigation, and much more. Join Jen Kramer for a quick overview of all of the goodies in Bootstrap, and then learn how to customize the grid, override the CSS to customize your site, and leverage Bootstrap's stylish built-in JavaScript effects. Once you're prepared to test your knowledge, you can take the hands-on challenges offered by Jen. Show less

Foundation is one of the most popular responsive design frameworks—clean and simple. But much of Foundation's styling is accomplished via slightly more complex CSS: Compass and Sass. This course with Jen Kramer shows how to install Foundation, Compass, and Sass, and customize your own Foundation site. Learn how to start a new project, navigate the Sass file structure, and use the main _setting.scss file to style color, fonts, spacing, and more. Plus, learn about advanced features like… Show more

Foundation is one of the most popular responsive design frameworks—clean and simple. But much of Foundation's styling is accomplished via slightly more complex CSS: Compass and Sass. This course with Jen Kramer shows how to install Foundation, Compass, and Sass, and customize your own Foundation site. Learn how to start a new project, navigate the Sass file structure, and use the main _setting.scss file to style color, fonts, spacing, and more. Plus, learn about advanced features like functions, mixins, extended styles, and much more. Show less

Discover how to make websites more search engine friendly, more meaningful, and more future-proof with semantics. In this course, Jen Kramer shows you how simple HTML5 tags add meaning to page structure, and how microdata and metadata can be used to add identifying information—such as author and type of content—right on a page. All this adds up to creating pages that score better (and rank faster) in Google and other search engines, and work better in the growing array of bots and other… Show more

Discover how to make websites more search engine friendly, more meaningful, and more future-proof with semantics. In this course, Jen Kramer shows you how simple HTML5 tags add meaning to page structure, and how microdata and metadata can be used to add identifying information—such as author and type of content—right on a page. All this adds up to creating pages that score better (and rank faster) in Google and other search engines, and work better in the growing array of bots and other programs searching the web on behalf of devices. Show less

Twitter Bootstrap is one of the most used HTML/CSS/JavaScript frameworks for creating responsive websites. In this course, Jen Kramer shows you how to add interactive elements like a thumbnail gallery, dropdown menus, or a contact form using Bootstrap and a simple text editor. Plus, learn to add helpful pop-ups and tooltips that enhance the usability of these features. The principles illustrated here can carry into using Bootstrap in content management systems as well as with static websites.

ZURB Foundation is a sophisticated and popular tool for creating responsive websites. This course introduces the framework and provides a quick overview of all of the goodies in Foundation. Author Jen Kramer shows you how to download Foundation and understand its file structure, create a responsive layout with its 12-column grid, and leverage the built-in JavaScript effects to build dropdown menus, image carousels, and more.

In this course, Jen Kramer shows how to build a custom Joomla! template that automatically tailors and sizes content for a wide range of displays, from desktops to mobile devices. This course covers using Joomla! 3 with its built-in Bootstrap framework, and a start-to-finish development strategy that covers everything from converting the wireframe to HTML, to styling the headers and footers. Jen also shows how to incorporate Dreamweaver and the Firefox developer tools into your workflow, and… Show more

In this course, Jen Kramer shows how to build a custom Joomla! template that automatically tailors and sizes content for a wide range of displays, from desktops to mobile devices. This course covers using Joomla! 3 with its built-in Bootstrap framework, and a start-to-finish development strategy that covers everything from converting the wireframe to HTML, to styling the headers and footers. Jen also shows how to incorporate Dreamweaver and the Firefox developer tools into your workflow, and accommodate multiple layouts and color variations in a single template. Show less

In this course, Jen Kramer shows how to use Joomla! to build a website from scratch—all without a single line of code. Discover how to create and organize content, add menus and sidebars, change the look of the site with templates, control who creates and edits content, and much more. The course also shows you how to evaluate the quality of extensions, plugins, and templates and how to download and install them. Finally, Jen emphasizes the importance of backing up your Joomla! site, and… Show more

In this course, Jen Kramer shows how to use Joomla! to build a website from scratch—all without a single line of code. Discover how to create and organize content, add menus and sidebars, change the look of the site with templates, control who creates and edits content, and much more. The course also shows you how to evaluate the quality of extensions, plugins, and templates and how to download and install them. Finally, Jen emphasizes the importance of backing up your Joomla! site, and explains how to create and store those backups. Show less

Bootstrap is a free web development tool from Twitter that, with a little bit of CSS and JavaScript experience, makes building websites quick, intuitive, and fun. Author Jen Kramer explores its 12-column grid layout; typography and icon libraries; fully functional components like nav bars, buttons, and tabs; and much more. This course also shows how to add JavaScript extras like dropdown menus, modal windows, and photo carousels.

In Joomla! 2.5 Essential Training, Jen Kramer uses Joomla! to build a web site from scratch—no programming required—and guides site designers through the process, from installation to launch. The course demonstrates how to create and organize content; add menus, sidebars, and other features; change the look with templates; install plug-ins and extensions; assign specific users to create and edit content; and much more. Jen also shows how to evaluate the quality of third-party extensions and… Show more

In Joomla! 2.5 Essential Training, Jen Kramer uses Joomla! to build a web site from scratch—no programming required—and guides site designers through the process, from installation to launch. The course demonstrates how to create and organize content; add menus, sidebars, and other features; change the look with templates; install plug-ins and extensions; assign specific users to create and edit content; and much more. Jen also shows how to evaluate the quality of third-party extensions and templates and how to download and install them, and emphasizes the importance of backups for your Joomla! site, with details on creating and storing those backups. Show less

Course retired on March 19, 2015. In Migrating from Joomla! 1.5 to Joomla! 2.5, Jen Kramer walks through moving a typical site to Joomla! 2.5 using two different tools, jUpgrade and SP Upgrade. jUpgrade and SP Upgrade migrate the 1.5 database content to 2.5 automatically, which maintains your data and settings. Jen shows how to download and configure the tools; how to adjust modules, images, and templates that may have shifted during the move; and how to update an old custom template for… Show more

Course retired on March 19, 2015. In Migrating from Joomla! 1.5 to Joomla! 2.5, Jen Kramer walks through moving a typical site to Joomla! 2.5 using two different tools, jUpgrade and SP Upgrade. jUpgrade and SP Upgrade migrate the 1.5 database content to 2.5 automatically, which maintains your data and settings. Jen shows how to download and configure the tools; how to adjust modules, images, and templates that may have shifted during the move; and how to update an old custom template for Joomla! 2.5 and fix any styling issues postmigration. Show less

In this course, author Jen Kramer uses access control lists (ACLs) to define and implement user permissions on a Joomla web site. The course covers granting access to front-end content, customizing a login page for different user groups, delivering specific content to certain user types, and creating a simplified back end. The course also includes tips and tricks for styling the offline access page and working with the ACL Manager extension.

As one of the most downloaded open source content management systems on the market today, Joomla! allows you to build functional, interactive Web sites without having to know PHP or MySQL. With this unique book-and-DVD package, you ll get up to speed with Joomla! and learn to build a complete Web site all at your own pace. Along with detailed guidance and an abundance of screen shots, this unique book-and-DVD combo clearly demonstrates every step of the process for using Joomla! when creating a… Show more

As one of the most downloaded open source content management systems on the market today, Joomla! allows you to build functional, interactive Web sites without having to know PHP or MySQL. With this unique book-and-DVD package, you ll get up to speed with Joomla! and learn to build a complete Web site all at your own pace. Along with detailed guidance and an abundance of screen shots, this unique book-and-DVD combo clearly demonstrates every step of the process for using Joomla! when creating a Web site.

* Offers a unique book-and-DVD package to walk you through using Joomla! to create a Web site
* Describes programming considerations for you to keep in mind and poses questions to ask yourself when creating a site with Joomla!
* Presents both written and visual assistance for building a complete Web site from start to finish

Use this soup-to-nuts book and DVD package as a detailed resource for building Web sites with Joomla! Show less

Course retired on March 19, 2015. In Joomla! 1.6 and 1.7 Essential Training, Jen Kramer uses Joomla! 1.6 to build a web site from scratch, from installation to launch. The course covers Joomla! 1.6 new features, demonstrates how to create and organize content, and add menus, sidebars, and other interface features. The course also explains how to change the site look and feel with Joomla! templates, install plug-ins and extensions, assign users to create and edit content, and much more. Exercise… Show more

Course retired on March 19, 2015. In Joomla! 1.6 and 1.7 Essential Training, Jen Kramer uses Joomla! 1.6 to build a web site from scratch, from installation to launch. The course covers Joomla! 1.6 new features, demonstrates how to create and organize content, and add menus, sidebars, and other interface features. The course also explains how to change the site look and feel with Joomla! templates, install plug-ins and extensions, assign users to create and edit content, and much more. Exercise files accompany the course. Show less

Course retired on March 19, 2015. In Joomla!: Creating and Editing Custom Templates, Jen Kramer shows web designers how to create eye-popping web sites with Joomla! templates and CSS for Joomla 1.6, 1.7, and 2.5. The course starts with the basics: how to add the Joomla! template codes to a static HTML layout, install the template package, and clean up styling after installation. The course also covers advanced styling techniques, such as creating multiple layouts within the same Joomla!… Show more

Course retired on March 19, 2015. In Joomla!: Creating and Editing Custom Templates, Jen Kramer shows web designers how to create eye-popping web sites with Joomla! templates and CSS for Joomla 1.6, 1.7, and 2.5. The course starts with the basics: how to add the Joomla! template codes to a static HTML layout, install the template package, and clean up styling after installation. The course also covers advanced styling techniques, such as creating multiple layouts within the same Joomla! template, configuring menus and submenus, and implementing template overrides and template styles. Exercise files accompany the course. Show less

Everything you need to know to plan and maintain a Joomla! site

Joomla! offers powerful functionality and ease of configuration, making it an immensely popular open source content management system. However, far more than simply downloading and installing Joomla! is required in order to create a dynamic web site. This book walks you through the critical steps that must be taken in the planning process prior to establishing a Joomla! site. Joomla! expert Jen Kramer reviews essential… Show more

Everything you need to know to plan and maintain a Joomla! site

Joomla! offers powerful functionality and ease of configuration, making it an immensely popular open source content management system. However, far more than simply downloading and installing Joomla! is required in order to create a dynamic web site. This book walks you through the critical steps that must be taken in the planning process prior to establishing a Joomla! site. Joomla! expert Jen Kramer reviews essential questions that need to be asked of a client, discusses technical solutions to a variety of challenges, and explains how a site structure should be organized. Show less

Course retired on March 19, 2015. In Web Site Strategy and Planning, Jen Kramer shows that there’s more to building a web site than just implementation. She describes how to create a plan that will ensure the end product meets the client’s needs and is as efficient and scalable as possible. Jen explains how to identify the right technology for the design, whether it is CMS-driven or static, and how to organize content and graphics. She shows how to create a project proposal that includes… Show more

Course retired on March 19, 2015. In Web Site Strategy and Planning, Jen Kramer shows that there’s more to building a web site than just implementation. She describes how to create a plan that will ensure the end product meets the client’s needs and is as efficient and scalable as possible. Jen explains how to identify the right technology for the design, whether it is CMS-driven or static, and how to organize content and graphics. She shows how to create a project proposal that includes pricing and milestones that demonstrate to the client that work is being done. She also discusses how to measure the success of the design through analytics and user feedback. Show less

Course retired on March 19, 2015. In Preparing CMS Web Graphics and Layouts Using Open-Source Tools, Jen Kramer shows how developers and graphic designers can collaborate to create a great site design that integrates with a content management system (CMS) like WordPress, Drupal, or Joomla!, all using open-source software. This workflow is based on two existing open-source design tools, KompoZer and GIMP. Jen shows how to modify web graphics and create slices with GIMP, and then place these in… Show more

Course retired on March 19, 2015. In Preparing CMS Web Graphics and Layouts Using Open-Source Tools, Jen Kramer shows how developers and graphic designers can collaborate to create a great site design that integrates with a content management system (CMS) like WordPress, Drupal, or Joomla!, all using open-source software. This workflow is based on two existing open-source design tools, KompoZer and GIMP. Jen shows how to modify web graphics and create slices with GIMP, and then place these in an HTML page integrated with CSS in KompoZer. Along the way, she discusses web design best practices and special challenges that might arise when designing for CMS software. Exercise files are included with this course. Show less

Course retired on March 19, 2015. Joomla! 1.5: Styling with CSS shows how those familiar with Joomla! and with hand-coded HTML and CSS can take the next step in creating a dynamic website with a unique look and feel. Jen Kramer McKibben goes deep into the functionality of this open-source content management system, exploring topics like putting more style into modules, editing CSS on the fly using the Firefox Web Developer toolbar, creating horizontal and vertical menu layouts, and including… Show more

Course retired on March 19, 2015. Joomla! 1.5: Styling with CSS shows how those familiar with Joomla! and with hand-coded HTML and CSS can take the next step in creating a dynamic website with a unique look and feel. Jen Kramer McKibben goes deep into the functionality of this open-source content management system, exploring topics like putting more style into modules, editing CSS on the fly using the Firefox Web Developer toolbar, creating horizontal and vertical menu layouts, and including images in those menus. Exercise files accompany the course. Show less

Course retired on March 19, 2015. Custom templates are the key to making a Joomla!-driven website stand out. In Joomla! 1.5 Creating and Editing Custom Templates, Jen Kramer McKibben offers instruction and insight to help Joomla! users create eye-popping websites. Jen starts with the basics, like how to add the Joomla! template codes to a static HTML layout, install the template package, and clean up styling after installation. She also shows how to make multiple layouts within the same Joomla!… Show more

Course retired on March 19, 2015. Custom templates are the key to making a Joomla!-driven website stand out. In Joomla! 1.5 Creating and Editing Custom Templates, Jen Kramer McKibben offers instruction and insight to help Joomla! users create eye-popping websites. Jen starts with the basics, like how to add the Joomla! template codes to a static HTML layout, install the template package, and clean up styling after installation. She also shows how to make multiple layouts within the same Joomla! template, configure menus and submenus, and more. Exercise files accompany the course. Show less