Skip to main content
Diego Hernan Marciano
Home

Main navigation

  • About Me
  • Work experience
  • Studies
  • Articles
    • 3D Printing
    • Electronics
    • SAP
    • Web development
    • Woodworking
    • Programming
  • Contact Me

User account menu

  • Log in

Search

  • Floating somewhere? Time to clear your mind, ups... your div

    Submitted by dmarciano on Fri, 06/30/2017 - 22:23
    When you start using floats on your site things are great till sibling parent elements start getting wrongly positioned in relation to the children of the previous one. This tries to clarify some information around that and propose some solutions for every case.
    • Read more about Floating somewhere? Time to clear your mind, ups... your div
    • Log in to post comments
  • Semantic elements, or giving the right hand to search engine bots

    Submitted by dmarciano on Thu, 06/29/2017 - 04:26
    Just a quick explanation of why semantic elements are important and how does that help search engines analyze your site.
    • Read more about Semantic elements, or giving the right hand to search engine bots
    • Log in to post comments
  • Sizing boxes

    Submitted by dmarciano on Thu, 06/29/2017 - 03:52
    I will try to sum up the basic concept about sizing (margin, border and padding) and content-box vs border-box box sizing concepts.
    • Read more about Sizing boxes
    • Log in to post comments
  • First steps into resposive development - Flexboxes

    Submitted by dmarciano on Mon, 06/26/2017 - 17:28
    One of the most useful tools regarding for responsible designs is "Flexbox", it is a super nice property that will make your boxes take advantage of the full width, resize and wrap as the view port size changes. I'll tell you some characteristics about flex boxes ans the two main CSS properties you'll use to create them, then I'll go through some examples with media queries and the order property in CSS so you can take control of the boxes as they get resized.
    • Read more about First steps into resposive development - Flexboxes
    • Log in to post comments
  • First steps into resposive development - Media queries

    Submitted by dmarciano on Mon, 06/26/2017 - 02:22

    So now that you are into responsive design you realize that you would like to have different media style sheets for different screen sizes, I mean, while taking advantage of the precision of a mouse on the big screens by having your buttons at a regular size you would probably want to make them bigger on the smaller screens.

    One clear and easy way to do that is by applying different style sheets to different devices, now when this can be achieved by many different ways, one of the preferred are media queries. 

    • Read more about First steps into resposive development - Media queries
    • Log in to post comments
  • First steps into resposive development - A design tip about click target sizes

    Submitted by dmarciano on Fri, 06/23/2017 - 03:22

    Dude, I just saw your last two posts, my view port is fine now and the images are just scaled to fit on the screen, AWESOME! Now I have a new and different problem, I just decided to put a "my messages" and a "log out" buttons just next to each other on my site and despite on my mobile both are correctly rendered links (A.k.a <nav a>) I just keep accidentally pressing log out when I want to see my messages, and login in three times in a row is not being fun anymore and even less for my users.

    • Read more about First steps into resposive development - A design tip about click target sizes
    • Log in to post comments
  • First steps into resposive development - View port overflow

    Submitted by dmarciano on Fri, 06/23/2017 - 02:33

    If you saw my previous post about defining the view port probably you solved only some of the issues that appear when rendering your site on different screens, but now it kinda renders you keep facing issues, and in this post we'll talk of one that mainly affects the small ones, and it is called "View port overflow".

    • Read more about First steps into resposive development - View port overflow
    • Log in to post comments
  • First steps into resposive development - Defining the view port

    Submitted by dmarciano on Fri, 06/23/2017 - 01:55

    Your site is rendering fine on your laptop? It is easy to reach that first one as you are developing there, but what happens when you render your site on a mobile device or a tablet? I can guess that if you are reading this is because it is doing weird stuff in there.

    Old school guys never worried about this as everything was rendered on desktop/laptop PCs, nowadays a site is used from almost any kind of screen, from your mobile to your smart. And with that you fall into the situation were the site starts rendering weird because the viewport was never defined.

    • Read more about First steps into resposive development - Defining the view port
    • Log in to post comments

Footer menu

  • Contact

Copyright © 2023. All rights reserved