--- title: General Features tagline: Platforms, Frameworks, and Devices date: 2021-01-01 #last_modified: 2023-01-01 description: > J1 Template is a Bootstrap V5 website template for the static site generator Jekyll. Current software counts. Excellent tools in their latest versions make the rocket engine for each and every website. J1 Template is using current software in their latest versions. All of them are OpenSource and free to use. No license issues using JekyllOne Theme for private or professional purposes. keywords: > Jekyll, JekyllOne, Theme, Software, Platforms, Frameworks, Devices categories: [ Features ] tags: [ General ] robots: index: true follow: true image: path: /assets/images/modules/attics/christina-1920x1280.jpg width: 1920 height: 1280 regenerate: false permalink: /pages/public/features/general_features/ resources: [ animate, clipboard, comments, rouge, lightbox, iconify ] resource_options: - toccer: collapseDepth: 3 - attic: slides: - url: /assets/images/modules/attics/christina-1920x1280.jpg alt: Photo by Christina on Unsplash badge: type: unsplash author: Christina href: //unsplash.com/@wocintechchat --- // Page Initializer // ============================================================================= // Enable the Liquid Preprocessor :page-liquid: // Set (local) page attributes here // ----------------------------------------------------------------------------- // :page--attr: :url-fontawesome--home: https://fontawesome.com/ :url-roundtrip--mdi-icons: /pages/public/learn/roundtrip/mdi_icon_font/#material-design-icons // Load Liquid procedures // ----------------------------------------------------------------------------- {% capture load_attributes %}themes/{{site.template.name}}/procedures/global/attributes_loader.proc{%endcapture%} // Load page attributes // ----------------------------------------------------------------------------- {% include {{load_attributes}} scope="global" %} // Page content // ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ [role="dropcap"] Current software counts. Excellent tools in their latest versions make the rocket engine for each and every website. Jekyll One is using current software in their latest versions. All of them are OpenSource and free to use. No license issues for private or professional use. // Include sub-documents (if any) // ----------------------------------------------------------------------------- [role="mt-5"] == Platforms J1 Template is based on these popular software platforms: mdi:language-ruby[24px, md-blue ml-3 mr-2] <> >= 2.7 + mdi:language-ruby[24px, md-blue ml-3 mr-2] <> 4.3 + mdi:nodejs[24px, md-blue ml-3 mr-2] <> 14.x All software-platforms are OpenSource, free to use and available on all common operating systems like Windows, Linux, and OSX. [role="mt-4"] === Ruby For the latest versions of J1 Template (>= *2022.5.0*), Ruby V3 is recommended. The latest Ruby versions offer much better run-time performance. Ruby 3 will be up to three times faster compared to Ruby 2.0. This will definively speed-up the development processes for your new website. [role="mt-4"] === Jekyll The latest version of http://jekyllrb.com/news/2022/10/20/jekyll-4-3-0-released/[Jekyll v4.3.0 (October 2022), {browser-window--new}] including all fixes for version V4. The upcoming version *v4.3.0* will offer some new features and modernized functionality. If this version is released, all new features will be implemented in J1 as well. [role="mt-4"] === NodeJS Websites created by Jekyll One are projects managed by NodeJS. The built-in script engine provided by the package manager `npm` of NodeJS simplifies the management of J1 projects a lot. Well-known commands typically used to manage software projects are at your fingertips. Easy to learn, easy to remember. Simple commands support creators to concentrate on the content. [role="mt-5"] == Frameworks To no reinvent wheels, J1 Template is based on ready-to-use frameworks, extensions, and modules. All build-in frameworks are industry standard, well known, and accepted worldwide. mdi:bootstrap[24px, md-blue ml-3 mr-2] <> + mdi:language-html5[24px, md-blue ml-3 mr-2] <> (HTML5, CSS and Javascript) + mdi:grass[24px, md-blue ml-3 mr-2] <> + mdi:application-settings[24px, md-blue ml-3 mr-2] <> + [role="mt-4"] === Bootstrap V5 For current webs, a must: responsiveness and modern design. Jekyll One is based on Bootstrap V5, the leading platform to create today's responsive webs. [role="mt-4"] === Internet Standards Supported Professional websites on the internet define standards. All current sites support dynamic, fast loading, and some more features. For fastest loading, all HTML, CSS, and Javascript have been compressed automatically for production. Going further for dynamic, AJAX loading for J1 webs is supported as well. [role="mt-4"] === Icon Fonts No question, icons and icon fonts are essentially required to make a site better understandable. Icons are used for navigation, extensions, modules, and last but not least for the content. J1 Template supports popular icons font sets out-of-the-box: * link:{url-mdi--home}[Material Design Icons, {browser-window--new}] (MDI) * link:{url-fontawesome--home}[FontAwesome Icons V5, {browser-window--new}] (FAI) * link:{url-iconify--home}[Iconify Icons, {browser-window--new}] (ICI) All the icon sets are excellent in design and have a rich set of icons in various categories typically used for the Web. [role="mt-4"] === Fully Configurable Software products of today are not easy to manage. To get the complexity out of your way, J1 is fully configurable. No need to dive in the deep. .Example of a Text Slider configuration (`carousel.yml`) [source, yaml, role="noclip"] ---- # -------------------------------------------------------------------------- # text--template-features (features page) # - show: enabled: true id: text--template-features lightbox: false type: text text: [ "Jekyll One Theme
Clean, ..", "Jekyll meets Bootstrap
Best of ..", "J1 is Open Source
No pain ..", "Explore this site
Learn what's ..", "Create modern static sites
Secure, .." ] options: autoPlay: 5000 singleItem: true pagination: false ---- Configure what is to be done. [role="mt-5"] == Devices The Web is everywhere. J1 Template supports modern web browsers on all devices for best results on PCs, Tablets, and SmartPhones. mdi:devices[24px, md-blue ml-3 mr-2] <> + mdi:near-me[24px, md-blue ml-3 mr-2] <> + mdi:near-me[24px, md-blue ml-3 mr-2] <> + mdi:lighthouse[24px, md-blue ml-3 mr-2] <> [role="mt-4"] === Desktop and Mobile support The internet has shifted from almost exclusively desktop-driven to mostly mobile-driven nowadays. Just a decade ago, in 2010, over 90 percent of all global web traffic came from desktop computers. The percentage of global web traffic on mobile phones has surged over the past decade. As of July 2021, more than 50 percent of all web traffic came through mobile devices. .Global mobile traffic, 2011-2021 lightbox::broadbandsearch--global-mobile-traffic[ 1024, {data-broadbandsearch--global-mobile-traffic} ] Source: link:{url-broadbandsearch--mobile-internet-usage}[broadbandsearch.net, {browser-window--new}] As of 2021, more than 50 percent of the total web visits are currently mobile. For this reason, it is very important to provide good useability of your website for mobile devices. [role="mt-4"] === Desktop Web Navigation Then Naviagtion Modules of J1 Template provides multiple sub-modules. An very important one: the menu system. Based on a quite simple configuration, give your vistors easy access to all of your content pages on a mouse-click. .Example of a Menu Configuration (`navigator_menu.yml`) [source, yaml, role="noclip"] ---- # ------------------------------------------------------------------------------ # Menu LEARN # - item: Learn sublevel: - title: Where to go href: /pages/public/learn/where_to_go/ icon: paw ---- .Desktop Web Navigation lightbox::images--desktop-navigation[ 1024, {data-images--desktop-navigation} ] [role="mt-4"] === Mobile Web Navigation Mobile devices are great for Apps designed for these platforms. Using a web browser to surf websites is often frustrating on mobiles. Jekyll One provides navigation systems that cover both worlds: desktops and mobiles. .Mobile Web Navigation lightbox::images--mobile-navigation[ 400, {data-images--mobile-navigation} ] [IMPORTANT] ==== Desktop and Mobile Navigation is using the **same** configuration data (`navigator_menu.yml`). The automatically generated menus for Desktop and Mobile Devices are displayed based on the size of the viewport. ==== [role="mt-4"] === Best Google Lighthouse Scores Performance is a key factor for all users. To not get visitors lost, J1 webs are highly optimized. All Websites will achieve the best Google Lighthouse scores for performance, accessibility, best practices, and SEO at the green level. [role="mb-7"] .Google Lighthouse Scores (Starter Web at Github) lightbox::images--google-lighthouse[ 1024, {data-images--google-lighthouse} ]