www/server/staging/readability free-sw.html lay...

[Therese Godefroy]

CVSROOT:        /webcvs/www
Module name:    www
Changes by:     Therese Godefroy <th_g> 16/10/16 21:27:53

Modified files:
        server/staging/readability: free-sw.html layout.css 

Log message:
        Organize the text in 2 columns and add subheads.

CVSWeb URLs:
http://web.cvs.savannah.gnu.org/viewcvs/www/server/staging/readability/free-sw.html?cvsroot=www&r1=1.1&r2=1.2
http://web.cvs.savannah.gnu.org/viewcvs/www/server/staging/readability/layout.css?cvsroot=www&r1=1.1&r2=1.2

Patches:
Index: free-sw.html
===================================================================
RCS file: /webcvs/www/www/server/staging/readability/free-sw.html,v
retrieving revision 1.1
retrieving revision 1.2
diff -u -b -r1.1 -r1.2
--- free-sw.html        15 Oct 2016 07:50:19 -0000      1.1
+++ free-sw.html        16 Oct 2016 21:27:51 -0000      1.2
@@ -16,15 +16,30 @@
 <title>What is free software?
 - GNU Project - Free Software Foundation</title>
 <style type="text/css" media="print,screen"><!--
-.intro blockquote { margin: 0; }
-.note { margin: 1.5em 0 1em; }
+blockquote.intro, blockquote.subhead, .columns {
+   text-align: justify;
+   margin: 0;
+}
+blockquote.subhead p {
+   font-size: 1.1em;
+   text-align: center;
+   padding: .3em .5em;
+   background: #f5f5f5;
+}
+.note { margin: 1.5em 0 0; }
+
 @media (min-width: 38em) {
-   .intro { text-align: justify; }
+   .intro p {
+      text-align: justify;
+      margin: -.3em 0 0 0;
+   }
+   .intro { margin: 0; }
 }
 @media (min-width: 48em) {
-   .note { width: 32%; margin-top: .5em; }
-   .intro { width: 57%; float: left; }
-   .intro h3 { margin-top: 0; }
+   .note {
+      float: none;
+      width: auto; max-width: 100%;
+   }
 }
 --></style>
 <meta http-equiv="Keywords" content="GNU, FSF, Free Software Foundation, 
Linux, Emacs, GCC, Unix, Free Software, Operating System, GNU Kernel, HURD, GNU 
HURD, Hurd" />
@@ -34,11 +49,11 @@
 <!--#include virtual="/server/banner.html" -->
 
 <h2 class="c">What is free software?</h2>
-
-<div  class="intro">
 <h3>The Free Software Definition</h3>
-<blockquote>
-<p>
+
+<div class="columns">
+<blockquote  class="intro">
+<p class="inline-block">
 The free software definition presents the criteria for whether a
 particular software program qualifies as free software.  From time to
 time we revise this definition, to clarify it or to resolve questions
@@ -47,11 +62,12 @@
 software.
 </p>
 </blockquote>
-</div>
 <!--#include virtual="/licenses/fsf-licensing.html" -->
+</div>
+<hr class="thin" />
 
-<div class="article">
-<p>
+<div class="columns">
+<p class="inline-block">
 &ldquo;Free software&rdquo; means software that respects users'
 freedom and community.  Roughly, it means that <b>the users have the
 freedom to run, copy, distribute, study, change and improve the
@@ -74,7 +90,11 @@
 program <a href="/philosophy/free-software-even-more-important.html">
 an instrument of unjust power</a>.
 </p>
+</div>
 
+<blockquote class="subhead"><p>The four essential freedoms</p></blockquote>
+
+<div class="columns">
 <p>
 A program is free software if the program's users have the
 four essential freedoms:
@@ -97,7 +117,7 @@
   </li>
 </ul>
 
-<p>
+<p class="inline-block">
 A program is free software if it gives users adequately all of these
 freedoms.  Otherwise, it is nonfree.  While we can distinguish various
 nonfree distribution schemes in terms of how far they fall short of
@@ -113,7 +133,12 @@
 
 <p>The rest of this page clarifies certain points about what makes
 specific freedoms adequate or not.</p>
+</div>
 
+<blockquote class="subhead"><p>Freedoms for anyone, anywhere, but free doesn't 
mean
+useful</p></blockquote>
+
+<div class="columns">
 <p>Freedom to distribute (freedoms 2 and 3) means you are free to
 redistribute copies, either with or without modifications, either
 gratis or charging a fee for distribution, to
@@ -145,7 +170,11 @@
 forbidden or stopped from doing so.  It has nothing to do with what
 functionality the program has, or whether it is useful for what you
 want to do.</p>
+</div>
 
+<blockquote class="subhead"><p>The source code must always be 
available</p></blockquote>
+
+<div class="columns">
 <p>
 The freedom to redistribute copies must include binary or executable
 forms of the program, as well as source code, for both modified and
@@ -165,7 +194,12 @@
 &ldquo;source code&rdquo; is not real source code and does not count
 as source code.
 </p>
+</div>
 
+<blockquote class="subhead"><p>No restrictions to making, using or 
distributing modified
+versions</p></blockquote>
+
+<div class="columns">
 <p>
 Freedom 1 includes the freedom to use your changed version in place of
 the original.  If the program is delivered in a product designed to
@@ -202,6 +236,10 @@
 cause, the software is not free.
 </p>
 
+</div>
+<blockquote class="subhead"><p>But some rules are acceptable, e.g. 
Copyleft</p></blockquote>
+
+<div class="columns">
 <p>
 However, certain kinds of rules about the manner of distributing free
 software are acceptable, when they don't conflict with the central
@@ -225,6 +263,10 @@
 relate to each other.
 </p>
 
+</div>
+<blockquote class="subhead"><p>Free doesn't mean 
non-commercial</p></blockquote>
+
+<div class="columns">
 <p>
 &ldquo;Free software&rdquo; does not mean &ldquo;noncommercial&rdquo;.  A free
 program must be available for commercial use, commercial development,
@@ -236,6 +278,11 @@
 <a href="/philosophy/selling.html">sell copies</a>.
 </p>
 
+</div>
+<blockquote class="subhead"><p>No restrictions on the change itself, but 
packaging rules
+may be acceptable</p></blockquote>
+
+<div class="columns">
 <p>
 Whether a change constitutes an improvement is a subjective matter.
 If your right to modify a program is limited, in substance, to changes that
@@ -274,7 +321,11 @@
 sort of requirement is acceptable only if there's a suitable aliasing
 facility that allows you to specify the original program's name as an
 alias for the modified version.</p>
+</div>
+
+<blockquote class="subhead"><p>What about export control 
regulations?</p></blockquote>
 
+<div class="columns">
 <p>
 Sometimes government <a id="exportcontrol">export control regulations</a>
 and trade sanctions can constrain your freedom to distribute copies of
@@ -296,7 +347,11 @@
 export law could make the requirement nontrivial and thus render the
 software nonfree.
 </p>
+</div>
 
+<blockquote class="subhead"><p>Required compliance with a nonfree license is 
unacceptable, but jusrisdiction may be specified</p></blockquote>
+
+<div class="columns">
 <p>
 A free license may not require compliance with the license of a
 nonfree program.  Thus, for instance, if a license requires you to
@@ -310,7 +365,12 @@
 It is acceptable for a free license to specify which jurisdiction's
 law applies, or where litigation must be done, or both.
 </p>
+</div>
 
+<blockquote class="subhead"><p>Contract-based licenses may be unacceptably
+restrictive</p></blockquote>
+
+<div class="columns">
 <p>
 Most free software licenses are based on copyright, and there are limits
 on what kinds of requirements can be imposed through copyright.  If a
@@ -330,6 +390,10 @@
 it is nonfree.
 </p>
 
+</div>
+<blockquote class="subhead"><p>Avoid confusing terms</p></blockquote>
+
+<div class="columns">
 <p>
 When talking about free software, it is best to avoid using terms
 like &ldquo;give away&rdquo; or &ldquo;for free,&rdquo; because those terms 
imply that
@@ -340,7 +404,11 @@
 a list of proper <a href="/philosophy/fs-translations.html">translations of
 &ldquo;free software&rdquo;</a> into various languages.
 </p>
+</div>
+
+<blockquote class="subhead"><p>How we interpret these criteria</p></blockquote>
 
+<div class="columns">
 <p>
 Finally, note that criteria such as those stated in this free software
 definition require careful thought for their interpretation.  To decide
@@ -354,7 +422,11 @@
 a conclusion about a new issue, we often update these criteria to make
 it easier to see why certain licenses do or don't qualify.
 </p>
+</div>
+
+<blockquote class="subhead"><p>Get help with free licenses</p></blockquote>
 
+<div class="columns">
 <p>
 If you are interested in whether a specific license qualifies as a free
 software license, see our <a href="/licenses/license-list.html">list
@@ -376,9 +448,11 @@
 help you can ensure that the license really is a free software license
 and avoid various practical problems.
 </p>
+</div>
 
 <h3 id="beyond-software">Beyond Software</h3>
 
+<div class="columns">
 <p>
 <a href="/philosophy/free-doc.html">Software manuals must be free</a>,
 for the same reasons that software must be free, and because the
@@ -398,9 +472,11 @@
 has been extended to a definition of <a href="http://freedomdefined.org/";>
 free cultural works</a> applicable to any kind of works.
 </p>
+</div>
 
 <h3 id="open-source">Open Source?</h3>
 
+<div class="columns">
 <p>
 Another group uses the term &ldquo;open source&rdquo; to mean
 something close (but not identical) to &ldquo;free software&rdquo;.  We
@@ -410,6 +486,7 @@
 never refers to freedom</a>.
 </p>
 </div>
+<hr class="thin" />
 
 <h3 id="History">History</h3>
 
@@ -596,7 +673,7 @@
 
 <p class="unprintable">Updated:
 <!-- timestamp start -->
-$Date: 2016/10/15 07:50:19 $
+$Date: 2016/10/16 21:27:51 $
 <!-- timestamp end -->
 </p>
 </div>

Index: layout.css
===================================================================
RCS file: /webcvs/www/www/server/staging/readability/layout.css,v
retrieving revision 1.1
retrieving revision 1.2
diff -u -b -r1.1 -r1.2
--- layout.css  13 Oct 2016 10:56:19 -0000      1.1
+++ layout.css  16 Oct 2016 21:27:51 -0000      1.2
@@ -277,6 +277,10 @@
 .no-bullet li { list-style: none; }
 
 .no-display { display: none; }
+.inline-block {
+   display: inline-block;
+   margin: 0;
+}
 
 
 /*** SEPARATORS ***/
@@ -295,6 +299,7 @@
 hr.thin {
    clear: both;
    height: 1px;
+   margin: 1.5em 0;
    border: none;
    background: #d4d4d4;
    background-image: linear-gradient(to right, #d4d4d4, #333, #d4d4d4);
@@ -951,13 +956,25 @@
 .article p, .article pre, .article li, .article dt, .article dd {
    line-height: 1.5em;
 }
+
 @media (min-width: 38em) {
    .article {
+      clear: both;
       text-align: justify;
       max-width: 35.7em;
       margin: auto;
    }
+   .columns {
+      -webkit-column-count: 2;
+      -webkit-column-gap: 1.5em;
+      -moz-column-count: 2;
+      -moz-column-gap: 1.5em;
+      column-count: 2;
+      column-gap: 1.5em;
+   }
+   .columns > *:first-child { margin-top: 0; }
 }
+
 @media (min-width: 48em) {
    .article { clear: both; padding: .1em 12% 0; }
    .article ul, .article ol { margin-left: 0; margin-right: 0; }