Hi Karsten, thanks for the feedback. I've updated the copy on my webserver (http://tucker.wales/tor/exonerator/) to clean up the markup a little (I rushed the previous version out at 3AM). I've also improved readibility by using indentation, as is now generally accepted in web development.
> > Maybe we could also add some information about the expected IP and > > date formats in the whitespace, too. > > Let's talk about that. I'm also not sure if putting examples into the > two input text boxes is such a good idea. I heard that it can confuse > people by thinking there's already an IP address entered, so why would > they have to put in another one, which is even more problematic on > browsers with date selector. It also hides the fact that ExoneraTor > supports searches by IPv6 addresses. Maybe we can put in different > placeholders and add some good explanations below the form. I still > think that less is more with respect to text length, but if we can > come up with some smart text there, that might do it. > I think we could accomplish a good way of providing that information - let me have a little play around over the next few days/week and I'll try to propose a good solution. > So, here's the diff with my questions: > > @@ -6,6 +6,7 @@ > <meta name="viewport" content="width=device-width, initial-scale=1"> > <title>ExoneraTor</title> > <link rel="stylesheet" href="css/bootstrap.min.css"> > +<link rel="stylesheet" href="css/styles.css"> > <link href="images/favicon.ico" type="image/x-icon" rel="icon"> > </head> > <body> > > Is it good practice to use a custom .css file in combination with > Bootstrap, or should we try to only use Bootstrap's classes, > properties, etc. to come up with the approximate design that we want? > Or, would it be possible to stick with Bootstrap-only styles for now > until there's no other way than using our own style file to do the > thing we want? > It's completely good practice to use custom css styles/files alongside Bootstrap. It's the only real way to add custom styling to the page and this method of creating a "sticky footer" is actually suggested in the Bootstrap examples. > > > @@ -17,10 +18,15 @@ > </div><!-- page-header --> > </div><!-- col --> > </div><!-- row --> > - - > <div class="row"> > <div class="col-xs-12"> > <div class="text-center"> > +<div class="row vbottom15"> > +<div class="col-xs-12"> > +<h4>Enter the details of the relay that you would like to check > below:</h4> > +</div> > +</div> > +<div class="row"></div> > <form class="form-inline"> > <div class="form-group"> > <label for="inputIp" class="control-label">IP address</label> > > What's the purpose of that last row there that doesn't come with any > columns? > I've removed that in the new version, it wasn't meant to be there. > > > @@ -35,6 +41,9 @@ > </div><!-- text-center --> > </div><!-- col --> > </div><!-- row --> > +</div><!-- container --> > +<footer> > +<div class="container"> > <div class="row"> > <div class="col-xs-6"> > <h3>About Tor</h3> > > I guess the <footer> is what moves the footer to the bottom, together > with our styles.css, right? Is that a common HTML thing, a > Bootstrap-specific thing, a custom tag that only works with our > styles.css, or how does this work? Is this the most Bootstrap-y way > to do it? (As you notice, I'm trying to stick to the defaults as long > as possible.) > Correct - the margin added to the bottom of the body, along with the position and height CSS attributes of <footer>, is what moves the footer to the bottom of the page. The <footer> tag is HTML5, so it won't work on older browsers - because of this, I've changed the markup to use div.footer in the updated version instead of a <footer> tag. This ensures compatibility with older, non-HTML5 browsers. > > > @@ -54,7 +63,9 @@ > <p class="text-center small">"Tor" and the "Onion Logo" are <a > href="https://www.torproject.org/docs/trademark-faq.html.en";>registered > trademarks</a> > of The Tor Project, Inc.</p> > </div><!-- col --> > </div><!-- row --> > - -</div><!-- container --> > +</div> > +</footer> > </body> > </html> > > Makes sense. By the way, is it good practice to add these comments, > or is that just something that old people do who first learned HTML in > the late 90's and whose favorite HTML editor is vim? > It's up to the author, to be honest - it can't hurt to keep them there, I would agree that it helps greatly to improve readibility (especially when using a lot of divs). Thanks, Joshua Lee Tucker @tuckerwales
_______________________________________________ tor-relays mailing list [email protected] https://lists.torproject.org/cgi-bin/mailman/listinfo/tor-relays
