Jump to content


  • Content count

  • Joined

  • Last visited

About Nillervision

  • Rank
  • Birthday 07/15/1968

Users Experience

  • Experience
  • Area of Expertise
    Web Designer

Contact Methods

  • Website URL

Profile Information

  • Gender
  • Location
    Copenhagen, Denmark
  • Interests
    Web development, design, music

Recent Profile Visitors

12,935 profile views
  1. Valuable Feedback

    Hello Neik. Welcome to the forum. If you want to build credibility as a theme developer you should really be working on optimizing your own site, https://developers.google.com/speed/pagespeed/insights/?hl=en&url=https%3A%2F%2Fwww.themevault.net%2F&tab=desktop A PageSpeed Insights score of 30 is really not good enough Suggestions for better UX. Use a honeypot instead of captcha in your contact form Get rid of the slidetoggle on the FAQ page, unless you plan to have longer answers. Why bother the user with having to click to reveal just one or two lines of text The automatic pop up will most likely just annoy users. Nobody will react to it before having a chance to read your offers. And google might punish you for it; https://www.theverge.com/2016/8/23/12610890/google-search-punish-pop-ups-interstitial-ads Most importantly: I think you need to work a lot on your brand and credibility. Let the user know who you are. Your site has zero information about you: no images of you or your team no about-us page no info about your location, your pasion for design or your values, mission, vision etc. no testimonials from happy clients.
  2. Jquery viewport trigger

    This method returns true if the current element is in the viewport jQuery.fn.isInViewport = function() { var elementTop = jQuery(this).offset().top; var elementBottom = elementTop + jQuery(this).outerHeight(); var viewportTop = jQuery(window).scrollTop(); var viewportBottom = viewportTop + jQuery(window).height(); return elementBottom > viewportTop && elementTop < viewportBottom; }; Usage: if (jQuery('.my-element').isInViewport()) { //do something } DEMO: https://jsfiddle.net/Nillervision/fmgjbkps/ Note that this example is not listening for scroll events (which can be heavy for the browser) Instead the function is running on each animation frame: I'm not 100% sure but I think this give you a better performance because each frame is parsed by the browsers js engine anyway, and the interval between the frame "events" is determined by the device itself: var scroll = window.requestAnimationFrame; function loop() { if (jQuery('.my-element').isInViewport()) { //do something } // Recall the loop scroll(loop) } // Call the loop for the first time loop(); To support old browsers you can fallback to vendor prefixes or even a timer var scroll = window.requestAnimationFrame || window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame || window.msRequestAnimationFrame || window.oRequestAnimationFrame || // fallback to timer function(callback) { window.setTimeout(callback, 1000 / 60) };
  3. WooCommerce Size etc. Dropdown option

    This functionality is build into woocommerce it is called variable products. https://docs.woocommerce.com/document/variable-product/
  4. I'm sure this is only an issue because you have some links containing the query string somewhere on your site. Probably because of a quick copy/paste action, check the urls in your menus and inline links in your posts.
  5. What is the correct order of a site design

    Take a look at this test. Test Five: Background Image Where Desktop Image Set with Min-Width https://timkadlec.com/2012/04/media-query-asset-downloading-results/ Edit: I also found this: Source: https://www.mightyminnow.com/2013/11/what-is-mobile-first-css-and-why-does-it-rock/
  6. What is the correct order of a site design

    OK. Let me explain how I've reached this conclusion. Mobil first is a progressive enhancement model (at least from what I read everywhere). That means that our core product is designed to support the devices with the most limited features (in this case screen size/resolution) After we have provided our initial styles we gradually check if the device supports larger resolutions and if so we enhance the initial features (Alows the content to float in to columns etc.) If we were structuring our CSS in a way were the core styles (initial rules) would apply to larger screens and gracefully degrade to smaller screens, we would no longer be designing after a progressive enhancement model.
  7. Could be that the sitemap generator is indexing search results. ?s= is the url key that WP uses for search queries. If you are worried that search engines will make the same "mistake" as the sitemap generator you could take one of these precautions: Note: First of all go through the internal links on your site and make sure you dont have any links with the search query string in it. METHOD 1 In your robots.txt file add this line to prevent indexing of any search queries Disallow: /*?s METHOD 2 In your documents head element (probably located in header.php) you can use a Wordpress function to check if the page is the search result page (which can have endless amounts of URLs) and add a robots meta tag. <?php if ( is_search() ) { echo '<meta name="robots" content="noindex">'; } ?> Or use the Youst settings to do it manually on each page. (you can also manually set a canonical url) https://kb.yoast.com/kb/canonical-urls-in-wordpress-seo/ METHOD 3 Submit a sitemap to Google, Bing and other search engines with only the URLs you want indexed
  8. What is the correct order of a site design

    Not entirely. The mobile first approach also has to do with the structure of your CSS. All your your initial CSS (outside any media queries) would be the only CSS loaded on the smallest screens. Overrides to these initial styles would be placed in min-width media queries and would ONLY be loaded on larger screens which often goes hand in hand with faster connections. When using the desktop first approach the initial CSS rules would be for the largest screens possible. Devices with small screens would have to read all this CSS code only to have it overridden later by styles defined in max-width media queries.
  9. Looking for constructive criticism/feedback

    First of all thanks for making good use of my pure CSS slider @GrahamUK33 If you want I can place a HQ link on the tutorial page so people can see an example on a live production. Back on topic: When in doubt. I think it is always good to give the user a choice. Some users like scrolling, other users might prefer other options. To accommodate for this you could place a bar at the top of the timeline with either inputs for filtering or simple links, like @fisicx suggested. Here's an example fiddle: https://jsfiddle.net/Nillervision/9z3sqm1o/
  10. With "rendering" do you mean the browsers WebGL API? If so remember that everything in your 3D scene has to be compiled to JavaScript and transferred to the client over http and interpreted and rendered in a browser (which BTW was never designed for 3D calculations). With that in mind WebGL is pretty amazing. No matter what software you use to publish your 3D models on the web, you will see performance problems and slow load times if your scenes are to complex. Also, you never know the users specs (graphic card, CPU etc.) so it's really important to optimize your scenes as much as possible. A few tips for optimization: Bake details into a normal map and use the decimate modifier to reduce the polycount afterwards. Limit the number of light sources to a minimum and bake ambient occlusion and shadows into your textures rather than having them calculated in real time. Compress your bitmap textures as much as posible, and try to fit your textures to square images (256x256, 512x512 and 1024x1024 with JPEG compression usually works well) If you have repeating/ similar objects in your scene, use instances (objects with the same mesh and material data) rather than unique copies EDIT: You might also consider at gzip compression. You can either enable that in your servers configuration (.htacces file) or for the individual 3D scene
  11. Front end before or after backend?

    Most people would probably think that developing the logic to store and fetch data first, and worry about the UI later would be the best approach. But on larger projects I think it's a often a good idea to involve a frontend dev, a backend dev and a designer and have them workout the solutions together from the start. That is the model we use on complex projects at my workplace. Here is some of the reasons why. Estimates A project manager needs estimates and you can't really ask a backend dev what a logo design, or an animation will cost. Visualizing concepts The designer is usually better to communicate with the client/external shareholders because he/she can visualize the concepts with wireframes, mockups or moodboards. It is always important to have the concepts visualized, defined and agreed on before any coding starts, so that the developers don't have to rewrite large amounts of code later in the process. Better code/markup You can have the front end dev working on the UI and template/view files as soon as the visual concepts are approved by the client. The frontend dev can start by inserting dummy content in hardcoded html or even code functions that returns dummy content (if he/she knows a bit of backend). This can be a big help for the backend dev because, even though the functions would have to be rewritten, the backend dev would have a clear idea about what markup the frontender expects in the returned data. Better solutions Many problems have solutions that can be solved in both the backend and frontend domains. How do you find the best solution if your devs do not work together from the start? Say your backend dev have coded a function that fetches data via a slow external API. But the interface also have a filter function. Lets say a simple show-only-new-content-button. Instead of having the backend dev post back an argument to the function and perform a new slow API call, maybe the frontender could just code a JavaScript function that simply hides the older content when the button is clicked.
  12. Not a wordpress site

    A CMS will often be more vulnerable than PHP/HTML pages with hardcoded static content. If the CMS (or installed plugins) is poorly written, hackers can inject msql queries in form inputs or the address bar. However a site that does not use a database connection can also be hacked because the hacker can inject scripts with file operations and delete/alter your files. But if you write-protect your files, sanitize all your textinputs, and url queries, and you make sure that all your included class/funtion files have the .php extension (so no one can download them and see your code) you are making it extremely difficult to hack the site. EDIT: If your site uses a database the best way to secure it is to use prepared statements: http://php.net/manual/en/pdo.prepared-statements.php
  13. There is no way to make sure all colors will look the same in different applications. It depends on the systems and graphic cards settings for color management. You might be able to configure the settings for different applications under your graphic card settings. Make sure all applications uses the same color profile. Most browsers should suppport sRGB. Applications like PhotoShop uses advanced color management like AdobeRGB color profile which tend to render colors with more saturation than sRGB, color management in browsers are much more limited. EDIT: for more consistent results make sure your icons are saved as sRGB: https://om4.com.au/client/preparing-images-color-profiles-srgb-adobe-rgb/
  14. Nah. I think we're done. Let's wrap it in a <center> tag in the table heading and we're good to go. On second thought it might even be so good that we should to use it as a splash screen with an "enter site" button underneath. Edit: And the "Best viewed in Netscape" disclaimer of cause
  15. Jacks logo is almost perfect, it just needed to be animated.