{"id":11841,"date":"2026-02-11T10:31:36","date_gmt":"2026-02-11T09:31:36","guid":{"rendered":"https:\/\/spgoo.org\/?page_id=11841"},"modified":"2026-02-11T10:38:47","modified_gmt":"2026-02-11T09:38:47","slug":"analyse-phonetique","status":"publish","type":"page","link":"https:\/\/spgoo.org\/?page_id=11841","title":{"rendered":"Analyse phon\u00e9tique"},"content":{"rendered":"    <style>\r\n        * {\r\n            margin: 0;\r\n            padding: 0;\r\n            box-sizing: border-box;\r\n        }\r\n\r\n\/*        body {\r\n            font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;\r\n            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);\r\n            min-height: 100vh;\r\n            padding: 20px;\r\n        } *\/\r\n\r\n        .containerPhonetique {\r\n            max-width: 1400px;\r\n            margin: 0 auto;\r\n        }\r\n\r\n        h1 {\r\n            color: white;\r\n            text-align: center;\r\n            margin-bottom: 30px;\r\n            font-size: 2.5em;\r\n            text-shadow: 2px 2px 4px rgba(0,0,0,0.3);\r\n        }\r\n\r\n        .input-section {\r\n            background: white;\r\n            padding: 30px;\r\n            border-radius: 15px;\r\n            box-shadow: 0 8px 32px rgba(0,0,0,0.2);\r\n            margin-bottom: 30px;\r\n        }\r\n\r\n        .input-section h2 {\r\n            color: #667eea;\r\n            margin-bottom: 15px;\r\n            font-size: 1.5em;\r\n        }\r\n\r\n        .text-input {\r\n            width: 100%;\r\n            min-height: 120px;\r\n            padding: 15px;\r\n            border: 2px solid #e0e0e0;\r\n            border-radius: 10px;\r\n            font-size: 1.1em;\r\n            font-family: 'Georgia', serif;\r\n            line-height: 1.6;\r\n            resize: vertical;\r\n            transition: border-color 0.3s;\r\n        }\r\n\r\n        .text-input:focus {\r\n            outline: none;\r\n            border-color: #667eea;\r\n        }\r\n\r\n        .controls {\r\n            display: flex;\r\n            gap: 15px;\r\n            margin-top: 15px;\r\n            flex-wrap: wrap;\r\n        }\r\n\r\n        .btn {\r\n            padding: 12px 30px;\r\n            border: none;\r\n            border-radius: 25px;\r\n            font-size: 1em;\r\n            cursor: pointer;\r\n            transition: all 0.3s;\r\n            box-shadow: 0 4px 15px rgba(0,0,0,0.1);\r\n        }\r\n\r\n        .btn-primary {\r\n            background: linear-gradient(135deg, #667eea, #764ba2);\r\n            color: white;\r\n        }\r\n\r\n        .btn-primary:hover {\r\n            transform: translateY(-2px);\r\n            box-shadow: 0 6px 20px rgba(102, 126, 234, 0.4);\r\n        }\r\n\r\n        .btn-secondary {\r\n            background: #f0f0f0;\r\n            color: #333;\r\n        }\r\n\r\n        .btn-secondary:hover {\r\n            background: #e0e0e0;\r\n        }\r\n\r\n        .options {\r\n            display: flex;\r\n            gap: 20px;\r\n            margin-top: 15px;\r\n            flex-wrap: wrap;\r\n        }\r\n\r\n        .option-group {\r\n            display: flex;\r\n            align-items: center;\r\n            gap: 8px;\r\n        }\r\n\r\n        .option-group input[type=\"checkbox\"] {\r\n            width: 18px;\r\n            height: 18px;\r\n            cursor: pointer;\r\n            accent-color: #667eea;\r\n        }\r\n\r\n        .option-group label {\r\n            color: #555;\r\n            cursor: pointer;\r\n            font-size: 0.95em;\r\n        }\r\n\r\n        .results {\r\n            display: grid;\r\n            grid-template-columns: repeat(auto-fit, minmax(500px, 1fr));\r\n            gap: 20px;\r\n        }\r\n\r\n        .result-card {\r\n            background: white;\r\n            padding: 25px;\r\n            border-radius: 15px;\r\n            box-shadow: 0 8px 32px rgba(0,0,0,0.2);\r\n        }\r\n\r\n        .result-card h3 {\r\n            color: #667eea;\r\n            margin-bottom: 15px;\r\n            font-size: 1.3em;\r\n            display: flex;\r\n            align-items: center;\r\n            gap: 10px;\r\n        }\r\n\r\n        .result-card h3::before {\r\n            content: '';\r\n            width: 4px;\r\n            height: 24px;\r\n            background: #667eea;\r\n            border-radius: 2px;\r\n        }\r\n\r\n        .transcription {\r\n            background: #f8f9fa;\r\n            padding: 20px;\r\n            border-radius: 10px;\r\n            font-family: 'Courier New', monospace;\r\n            font-size: 1.3em;\r\n            line-height: 2;\r\n            color: #333;\r\n            margin-bottom: 10px;\r\n            border-left: 4px solid #667eea;\r\n        }\r\n\r\n        .transcription.ipa {\r\n            font-size: 1.5em;\r\n            color: #764ba2;\r\n        }\r\n\r\n        .phoneme-grid {\r\n            display: grid;\r\n            grid-template-columns: repeat(auto-fill, minmax(80px, 1fr));\r\n            gap: 10px;\r\n            margin-top: 15px;\r\n        }\r\n\r\n        .phoneme-item {\r\n            background: #f0f0f0;\r\n            padding: 12px;\r\n            border-radius: 8px;\r\n            text-align: center;\r\n            transition: all 0.3s;\r\n            cursor: pointer;\r\n            border: 2px solid transparent;\r\n        }\r\n\r\n        .phoneme-item:hover {\r\n            background: #e8eaf6;\r\n            border-color: #667eea;\r\n            transform: translateY(-2px);\r\n        }\r\n\r\n        .phoneme-symbol {\r\n            font-size: 1.8em;\r\n            font-weight: bold;\r\n            color: #667eea;\r\n            font-family: 'Courier New', monospace;\r\n        }\r\n\r\n        .phoneme-count {\r\n            font-size: 0.9em;\r\n            color: #666;\r\n            margin-top: 5px;\r\n        }\r\n\r\n        .phoneme-description {\r\n            font-size: 0.75em;\r\n            color: #999;\r\n            margin-top: 3px;\r\n        }\r\n\r\n        .phenomena-list {\r\n            list-style: none;\r\n        }\r\n\r\n        .phenomena-item {\r\n            background: #f8f9fa;\r\n            padding: 15px;\r\n            border-radius: 8px;\r\n            margin-bottom: 12px;\r\n            border-left: 4px solid #667eea;\r\n        }\r\n\r\n        .phenomena-type {\r\n            font-weight: 600;\r\n            color: #667eea;\r\n            margin-bottom: 5px;\r\n            text-transform: uppercase;\r\n            font-size: 0.85em;\r\n        }\r\n\r\n        .phenomena-example {\r\n            font-family: 'Courier New', monospace;\r\n            color: #333;\r\n            margin-top: 5px;\r\n        }\r\n\r\n        .phenomena-explanation {\r\n            color: #666;\r\n            font-size: 0.9em;\r\n            margin-top: 5px;\r\n            font-style: italic;\r\n        }\r\n\r\n        .stats-grid {\r\n            display: grid;\r\n            grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));\r\n            gap: 15px;\r\n            margin-top: 15px;\r\n        }\r\n\r\n        .stat-box {\r\n            background: linear-gradient(135deg, #667eea, #764ba2);\r\n            color: white;\r\n            padding: 20px;\r\n            border-radius: 12px;\r\n            text-align: center;\r\n            box-shadow: 0 4px 15px rgba(102, 126, 234, 0.3);\r\n        }\r\n\r\n        .stat-number {\r\n            font-size: 2.5em;\r\n            font-weight: bold;\r\n            margin-bottom: 5px;\r\n        }\r\n\r\n        .stat-label {\r\n            font-size: 0.9em;\r\n            opacity: 0.9;\r\n        }\r\n\r\n        .syllable-breakdown {\r\n            background: #f8f9fa;\r\n            padding: 15px;\r\n            border-radius: 10px;\r\n            margin-top: 15px;\r\n        }\r\n\r\n        .syllable {\r\n            display: inline-block;\r\n            background: white;\r\n            padding: 8px 15px;\r\n            margin: 5px;\r\n            border-radius: 20px;\r\n            font-family: 'Courier New', monospace;\r\n            font-size: 1.1em;\r\n            border: 2px solid #e0e0e0;\r\n            transition: all 0.3s;\r\n            cursor: pointer;\r\n        }\r\n\r\n        .syllable:hover {\r\n            border-color: #667eea;\r\n            background: #e8eaf6;\r\n        }\r\n\r\n        .syllable-structure {\r\n            font-size: 0.75em;\r\n            color: #999;\r\n            margin-left: 5px;\r\n        }\r\n\r\n        .prosody-notation {\r\n            background: #f8f9fa;\r\n            padding: 20px;\r\n            border-radius: 10px;\r\n            font-family: 'Courier New', monospace;\r\n            font-size: 1.2em;\r\n            line-height: 2.5;\r\n            margin-top: 15px;\r\n        }\r\n\r\n        .stress-mark {\r\n            color: #e74c3c;\r\n            font-weight: bold;\r\n        }\r\n\r\n        .intonation-mark {\r\n            color: #3498db;\r\n            font-size: 1.5em;\r\n        }\r\n\r\n        .pause-mark {\r\n            color: #95a5a6;\r\n        }\r\n\r\n        .legend {\r\n            background: #fff3cd;\r\n            padding: 15px;\r\n            border-radius: 8px;\r\n            margin-top: 15px;\r\n            border-left: 4px solid #ffc107;\r\n        }\r\n\r\n        .legend-item {\r\n            display: flex;\r\n            align-items: center;\r\n            gap: 10px;\r\n            margin: 5px 0;\r\n            font-size: 0.9em;\r\n        }\r\n\r\n        .legend-symbol {\r\n            font-family: 'Courier New', monospace;\r\n            font-weight: bold;\r\n            min-width: 30px;\r\n        }\r\n\r\n        .table-wrapper {\r\n            overflow-x: auto;\r\n            margin-top: 15px;\r\n        }\r\n\r\n        table {\r\n            width: 100%;\r\n            border-collapse: collapse;\r\n            font-size: 0.9em;\r\n        }\r\n\r\n        th, td {\r\n            padding: 12px;\r\n            text-align: left;\r\n            border-bottom: 1px solid #e0e0e0;\r\n        }\r\n\r\n        th {\r\n            background: #f8f9fa;\r\n            color: #667eea;\r\n            font-weight: 600;\r\n        }\r\n\r\n        tr:hover {\r\n            background: #f8f9fa;\r\n        }\r\n\r\n        .ipa-symbol {\r\n            font-family: 'Courier New', monospace;\r\n            font-size: 1.3em;\r\n            color: #764ba2;\r\n            font-weight: bold;\r\n        }\r\n\r\n        .example-sentences {\r\n            background: #e8f5e9;\r\n            padding: 15px;\r\n            border-radius: 8px;\r\n            margin-bottom: 20px;\r\n            border-left: 4px solid #4caf50;\r\n        }\r\n\r\n        .example-sentences h4 {\r\n            color: #2e7d32;\r\n            margin-bottom: 10px;\r\n        }\r\n\r\n        .example-sentence {\r\n            margin: 8px 0;\r\n            padding: 8px;\r\n            background: white;\r\n            border-radius: 5px;\r\n            cursor: pointer;\r\n            transition: all 0.3s;\r\n        }\r\n\r\n        .example-sentence:hover {\r\n            background: #c8e6c9;\r\n        }\r\n\r\n        .loading {\r\n            text-align: center;\r\n            padding: 40px;\r\n            color: #667eea;\r\n        }\r\n\r\n        .loading-spinner {\r\n            width: 50px;\r\n            height: 50px;\r\n            border: 4px solid #e0e0e0;\r\n            border-top-color: #667eea;\r\n            border-radius: 50%;\r\n            animation: spin 1s linear infinite;\r\n            margin: 20px auto;\r\n        }\r\n\r\n        @keyframes spin {\r\n            to { transform: rotate(360deg); }\r\n        }\r\n\r\n        @media (max-width: 768px) {\r\n            .results {\r\n                grid-template-columns: 1fr;\r\n            }\r\n\r\n            h1 {\r\n                font-size: 1.8em;\r\n            }\r\n        }\r\n    <\/style>\r\n\r\n\r\n<div class=\"containerPhonetique\">\r\n        <h1>\ud83d\udd0a Analyseur Phon\u00e9tique Fran\u00e7ais<\/h1>\r\n\r\n        <div class=\"input-section\">\r\n            <h2>\ud83d\udcdd Texte \u00e0 analyser<\/h2>\r\n            \r\n            <div class=\"example-sentences\">\r\n                <h4>\ud83d\udca1 Exemples (cliquez pour charger) :<\/h4>\r\n                <div class=\"example-sentence\" onclick=\"loadExample(0)\">\r\n                    Les scientifiques ont r\u00e9cemment d\u00e9couvert une tourbi\u00e8re remarquable.\r\n                <\/div>\r\n                <div class=\"example-sentence\" onclick=\"loadExample(1)\">\r\n                    Les enfants jouent dans le jardin avec leurs amis.\r\n                <\/div>\r\n                <div class=\"example-sentence\" onclick=\"loadExample(2)\">\r\n                    L&#8217;analyse phon\u00e9tique permet de comprendre les sons d&#8217;une langue.\r\n                <\/div>\r\n                <div class=\"example-sentence\" onclick=\"loadExample(3)\">\r\n                    Nous avons observ\u00e9 des variations importantes dans la prononciation.\r\n                <\/div>\r\n            <\/div>\r\n\r\n            <textarea \r\n                id=\"textInput\" \r\n                class=\"text-input\" \r\n                placeholder=\"Entrez votre texte fran\u00e7ais ici...\"\r\n            >Les scientifiques ont r\u00e9cemment d\u00e9couvert une tourbi\u00e8re remarquable.<\/textarea>\r\n\r\n            <div class=\"options\">\r\n                <div class=\"option-group\">\r\n                    <input type=\"checkbox\" id=\"showLiaisons\" checked>\r\n                    <label for=\"showLiaisons\">Marquer les liaisons<\/label>\r\n                <\/div>\r\n                <div class=\"option-group\">\r\n                    <input type=\"checkbox\" id=\"showStress\" checked>\r\n                    <label for=\"showStress\">Marquer les accents<\/label>\r\n                <\/div>\r\n                <div class=\"option-group\">\r\n                    <input type=\"checkbox\" id=\"narrowTranscription\">\r\n                    <label for=\"narrowTranscription\">Transcription \u00e9troite<\/label>\r\n                <\/div>\r\n                <div class=\"option-group\">\r\n                    <input type=\"checkbox\" id=\"detectReductions\" checked>\r\n                    <label for=\"detectReductions\">D\u00e9tecter les r\u00e9ductions<\/label>\r\n                <\/div>\r\n            <\/div>\r\n\r\n            <div class=\"controls\">\r\n                <button class=\"btn btn-primary\" onclick=\"analyzeText()\">\ud83d\udd0d Analyser<\/button>\r\n                <button class=\"btn btn-secondary\" onclick=\"clearAll()\">\ud83d\uddd1\ufe0f Effacer<\/button>\r\n                <button class=\"btn btn-secondary\" onclick=\"exportAnalysis()\">\ud83d\udce5 Exporter<\/button>\r\n            <\/div>\r\n        <\/div>\r\n\r\n        <div id=\"results\"><\/div>\r\n    <\/div>\r\n\r\n\n\n<script type='text\/javascript'>\nvar id = \"11850\";<\/script>\n<script type='text\/javascript' src='https:\/\/spgoo.org\/wp-content\/uploads\/winp-css-js\/11850.js?ver=1770802705'><\/script>\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-11841","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/spgoo.org\/index.php?rest_route=\/wp\/v2\/pages\/11841","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/spgoo.org\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/spgoo.org\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/spgoo.org\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/spgoo.org\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=11841"}],"version-history":[{"count":2,"href":"https:\/\/spgoo.org\/index.php?rest_route=\/wp\/v2\/pages\/11841\/revisions"}],"predecessor-version":[{"id":11852,"href":"https:\/\/spgoo.org\/index.php?rest_route=\/wp\/v2\/pages\/11841\/revisions\/11852"}],"wp:attachment":[{"href":"https:\/\/spgoo.org\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=11841"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}